Skip to content

GitLab

T
tangled
Commit ca7556b5 authored by Darren Shen's avatar Darren Shen Committed by Commit Bot
Browse files
Options

[css-typed-om] Add support for background properties. 

We cannot support background-repeat and background-position yet because
they are both implemented as shorthands in Blink, but are not shorthands
in the spec.

We'd need to refactor the existing code to allow shorthands to reify
as proper Typed OM objects. There are also some tricky bits to support
styleMap.set with shorthands given a proper Typed OM object.

Bug: 820299
Change-Id: I064ce37a48bee3d73965b66b323e20abf5a9099f
Reviewed-on: https://chromium-review.googlesource.com/994593
Commit-Queue: Darren Shen <shend@chromium.org>
Reviewed-by: default avatarRune Lillesveen <futhark@chromium.org>
Cr-Commit-Position: refs/heads/master@{#548705}
parent 71511b2c
Hide whitespace changes
Inline Side-by-side
Showing with 230 additions and 0 deletions
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-attachment.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-attachment' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-attachment', [
{ syntax: 'scroll' },
{ syntax: 'fixed' },
{ syntax: 'local' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-blend-mode.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-blend-mode' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-blend-mode', [
{ syntax: 'normal' },
{ syntax: 'multiply' },
{ syntax: 'screen' },
{ syntax: 'overlay' },
{ syntax: 'darken' },
{ syntax: 'lighten' },
{ syntax: 'color-dodge' },
{ syntax: 'color-burn' },
{ syntax: 'hard-light' },
{ syntax: 'soft-light' },
{ syntax: 'difference' },
{ syntax: 'exclusion' },
{ syntax: 'hue' },
{ syntax: 'saturation' },
{ syntax: 'color' },
{ syntax: 'luminosity' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-clip.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-clip' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-clip', [
{ syntax: 'border-box' },
{ syntax: 'padding-box' },
{ syntax: 'content-box' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-origin.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-origin' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-origin', [
{ syntax: 'border-box' },
{ syntax: 'padding-box' },
{ syntax: 'content-box' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-position-expected.txt 0 → 100644
View file @ ca7556b5
This is a testharness.js-based test.
FAIL Can set 'background-position' to CSS-wide keywords assert_equals: expected "CSSKeywordValue" but got "CSSStyleValue"
FAIL Can set 'background-position' to var() references assert_equals: expected "CSSUnparsedValue" but got "CSSStyleValue"
FAIL Can set 'background-position' to a position Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
PASS Setting 'background-position' to a length throws TypeError
PASS Setting 'background-position' to a percent throws TypeError
PASS Setting 'background-position' to a time throws TypeError
PASS Setting 'background-position' to a flexible length throws TypeError
PASS Setting 'background-position' to a number throws TypeError
PASS Setting 'background-position' to a URL throws TypeError
PASS Setting 'background-position' to a transform throws TypeError
Harness: the test ran to completion.
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-position.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-position' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runPropertyTests('background-position', [
{ syntax: '<position>' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-repeat-expected.txt 0 → 100644
View file @ ca7556b5
This is a testharness.js-based test.
FAIL Can set 'background-position' to CSS-wide keywords assert_equals: expected "CSSKeywordValue" but got "CSSStyleValue"
FAIL Can set 'background-position' to var() references assert_equals: expected "CSSUnparsedValue" but got "CSSStyleValue"
FAIL Can set 'background-position' to the 'repeat-x' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
FAIL Can set 'background-position' to the 'repeat-y' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
FAIL Can set 'background-position' to the 'repeat' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
FAIL Can set 'background-position' to the 'space' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
FAIL Can set 'background-position' to the 'round' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
FAIL Can set 'background-position' to the 'no-repeat' keyword Failed to execute 'set' on 'StylePropertyMap': Invalid type for property
PASS Setting 'background-position' to a length throws TypeError
PASS Setting 'background-position' to a percent throws TypeError
PASS Setting 'background-position' to a time throws TypeError
PASS Setting 'background-position' to a flexible length throws TypeError
PASS Setting 'background-position' to a number throws TypeError
PASS Setting 'background-position' to a position throws TypeError
PASS Setting 'background-position' to a URL throws TypeError
PASS Setting 'background-position' to a transform throws TypeError
FAIL 'background-position' does not supported 'space repeat' assert_not_equals: Unsupported value must not be null got disallowed value null
Harness: the test ran to completion.
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-repeat.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-repeat' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-position', [
{ syntax: 'repeat-x' },
{ syntax: 'repeat-y' },
{ syntax: 'repeat' },
{ syntax: 'space' },
{ syntax: 'round' },
{ syntax: 'no-repeat' },
]);
runUnsupportedPropertyTests('background-position', [
'space repeat'
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/background-size.html 0 → 100644
View file @ ca7556b5
<!doctype html>
<meta charset="utf-8">
<title>'background-size' property</title>
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-get">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#dom-stylepropertymap-set">
<link rel="help" href="https://drafts.css-houdini.org/css-typed-om-1/#property-stle-value-normalization">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../../resources/testhelper.js"></script>
<script src="resources/testsuite.js"></script>
<body>
<div id="log"></div>
<script>
'use strict';
runListValuedPropertyTests('background-size', [
{ syntax: '<length>' },
{ syntax: '<percentage>' },
{ syntax: 'auto' },
{ syntax: 'cover' },
{ syntax: 'contain' },
]);
runUnsupportedPropertyTests('background-size', [
'200px 100px'
]);
</script>
third_party/WebKit/Source/core/css/CSSProperties.json5
View file @ ca7556b5
...@@ -774,16 +774,29 @@ ...@@ -774,16 +774,29 @@
name: "background-attachment", name: "background-attachment",
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"], property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
custom_apply_functions_all: true, custom_apply_functions_all: true,
keywords: ["scroll", "fixed", "local"],
typedom_types: ["Keyword"],
separator: " "
}, },
{ {
name: "background-blend-mode", name: "background-blend-mode",
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"], property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
custom_apply_functions_all: true, custom_apply_functions_all: true,
keywords: [
"normal", "multiply", "screen", "overlay", "darken", "lighten",
"color-dodge", "color-burn", "hard-light", "soft-light", "difference",
"exclusion", "hue", "saturation", "color", "luminosity"
],
typedom_types: ["Keyword"],
separator: " "
}, },
{ {
name: "background-clip", name: "background-clip",
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"], property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
custom_apply_functions_all: true, custom_apply_functions_all: true,
keywords: ["border-box", "padding-box", "content-box"],
typedom_types: ["Keyword"],
separator: " "
}, },
{ {
name: "background-color", name: "background-color",
...@@ -812,6 +825,9 @@ ...@@ -812,6 +825,9 @@
name: "background-origin", name: "background-origin",
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"], property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
custom_apply_functions_all: true, custom_apply_functions_all: true,
keywords: ["border-box", "padding-box", "content-box"],
typedom_types: ["Keyword"],
separator: " "
}, },
{ {
name: "background-position-x", name: "background-position-x",
...@@ -838,6 +854,9 @@ ...@@ -838,6 +854,9 @@
property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"], property_methods: ["ParseSingleValue", "CSSValueFromComputedStyleInternal"],
interpolable: true, interpolable: true,
custom_apply_functions_all: true, custom_apply_functions_all: true,
keywords: ["auto", "cover", "contain"],
typedom_types: ["Keyword", "Length", "Percentage"],
separator: " "
}, },
{ {
name: "baseline-shift", name: "baseline-shift",
......
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