third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html - Issue 2366313006: CSS Properties and Values API: Support non-inherited custom properties

Unified Diff: third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html

Issue 2366313006: CSS Properties and Values API: Support non-inherited custom properties (Closed)

Patch Set: use de morgan's law Created 4 years, 3 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Index: third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html

diff --git a/third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html b/third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html

new file mode 100644

index 0000000000000000000000000000000000000000..29c0714e50b9a29808ee3a2e5b4ff054df1d4ded

--- /dev/null

+++ b/third_party/WebKit/LayoutTests/custom-properties/registered-properties-inheritance.html

@@ -0,0 +1,45 @@

+<!DOCTYPE HTML>

+<script src="../resources/testharness.js"></script>

+<script src="../resources/testharnessreport.js"></script>

+<style>

+#outer {

+ --inherited-length-1: 10px;

+ --inherited-length-2: var(--non-inherited-length-1);

+ --inherited-length-3: 30px;

+ --non-inherited-length-1: 22px;

+ --non-inherited-length-3: calc(var(--non-inherited-length-2) * 10);

+#inner {

+ --inherited-length-3: 15px;

+ --non-inherited-length-1: 40px;

+ --non-inherited-length-2: 90px;

+</style>

+<div id=outer><div id=inner></div></div>

+<script>

+CSS.registerProperty({name: '--inherited-length-1', syntax: '<length>', initialValue: '1px', inherits: true});

+CSS.registerProperty({name: '--inherited-length-2', syntax: '<length>', initialValue: '2px', inherits: true});

+CSS.registerProperty({name: '--inherited-length-3', syntax: '<length>', initialValue: '3px', inherits: true});

+CSS.registerProperty({name: '--non-inherited-length-1', syntax: '<length>', initialValue: '4px'});

+CSS.registerProperty({name: '--non-inherited-length-2', syntax: '<length>', initialValue: '5px'});

+CSS.registerProperty({name: '--non-inherited-length-3', syntax: '<length>', initialValue: '6px'});

+test(function() {

+ outerComputedStyle = getComputedStyle(outer);

+ assert_equals(outerComputedStyle.getPropertyValue('--inherited-length-1'), '10px');

+ assert_equals(outerComputedStyle.getPropertyValue('--inherited-length-2'), '22px');

+ assert_equals(outerComputedStyle.getPropertyValue('--inherited-length-3'), '30px');

+ assert_equals(outerComputedStyle.getPropertyValue('--non-inherited-length-1'), '22px');

+ assert_equals(outerComputedStyle.getPropertyValue('--non-inherited-length-2'), '5px');

+ assert_equals(outerComputedStyle.getPropertyValue('--non-inherited-length-3'), '50px');

+ innerComputedStyle = getComputedStyle(inner);

+ assert_equals(innerComputedStyle.getPropertyValue('--inherited-length-1'), '10px');

+ assert_equals(innerComputedStyle.getPropertyValue('--inherited-length-2'), '22px');

+ assert_equals(innerComputedStyle.getPropertyValue('--inherited-length-3'), '15px');

+ assert_equals(innerComputedStyle.getPropertyValue('--non-inherited-length-1'), '40px');

+ assert_equals(innerComputedStyle.getPropertyValue('--non-inherited-length-2'), '90px');

+ assert_equals(innerComputedStyle.getPropertyValue('--non-inherited-length-3'), '6px');

+}, "Registered properties are correctly inherited (or not) depending on the inherits flag.");

+</script>

« no previous file with comments | « no previous file | third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp » ('j') | no next file with comments »