Skip to content

GitLab

T
tangled
Commit 420cb5b0 authored by Anders Hartvoll Ruud's avatar Anders Hartvoll Ruud Committed by Commit Bot
Browse files
Options

[@property] Add tests for @property and CSS Typed OM 

The @property rule is relevant for CSS Typed OM, because the syntax of
a registered custom property can now be changed several times, or even
revert back to unregistered. This affects how values should reify.

Bug: 973830
Change-Id: I0ad5ba843b89d9153657e8b3f464e2dd33659cd2
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2160894
Commit-Queue: Anders Hartvoll Ruud <andruud@chromium.org>
Reviewed-by: default avatarIan Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/master@{#762081}
parent 1b511cca
Hide whitespace changes
Inline Side-by-side
Showing with 64 additions and 0 deletions
third_party/blink/web_tests/external/wpt/css/css-properties-values-api/at-property-typedom.html 0 → 100644
View file @ 420cb5b0
<!DOCTYPE html>
<link rel="help" href="https://drafts.css-houdini.org/css-properties-values-api-1/#css-style-value-reification">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="./resources/utils.js"></script>
<div id=div></div>
<script>
test(() => {
let name = generate_name();
with_style_node(`div { ${name}: 100px; }`, () => {
// Before registering the property, ${name} should reify as a
// a token sequence.
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnparsedValue');
assert_equals(div.computedStyleMap().get(name).toString(), ' 100px');
with_at_property({
name: name,
syntax: '"<length>"',
inherits: false,
initialValue: '0px'
}, () => {
// After registering, it should reify as a <length>.
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnitValue');
assert_equals(div.computedStyleMap().get(name).value, 100);
assert_equals(div.computedStyleMap().get(name).unit, 'px');
});
// After @property is removed, the computed value is once again a token
// sequence.
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnparsedValue');
assert_equals(div.computedStyleMap().get(name).toString(), ' 100px');
});
}, 'Properties declared with @property reify correctly');
test(() => {
let name = generate_name();
// 0 is valid as a both <length> and <integer>, which reify differently.
with_style_node(`div { ${name}: 0; }`, () => {
with_at_property({
name: name,
syntax: '"<length>"',
inherits: false,
initialValue: '1000px'
}, () => {
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnitValue');
assert_equals(div.computedStyleMap().get(name).value, 0);
assert_equals(div.computedStyleMap().get(name).unit, 'px');
with_at_property({
name: name,
syntax: '"<integer>"',
inherits: false,
initialValue: '1000'
}, () => {
assert_equals(div.computedStyleMap().get(name).constructor.name, 'CSSUnitValue');
assert_equals(div.computedStyleMap().get(name).value, 0);
assert_equals(div.computedStyleMap().get(name).unit, 'number');
});
});
});
}, 'Re-declaring a property with a different type affects reification');
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment