Skip to content

GitLab

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

[css-typed-om] Add support for motion path properties. 

This patch adds support for motion path properties. We had to modify
the computed style computation for <position> values. Previously, we
parse a <position> value as a CSSValuePair, but compute them to a
CSSValueList containing two items. This is very strange, so we just
compute to a CSSValuePair. Since both serialize to the same string,
this has no behavioural changes on CSSOM.

Bug: 820299
Change-Id: I2131055dad0785eb47ea2d2d89f00229f4376bae
Reviewed-on: https://chromium-review.googlesource.com/967915Reviewed-by: default avatarnainar <nainar@chromium.org>
Commit-Queue: Darren Shen <shend@chromium.org>
Cr-Commit-Position: refs/heads/master@{#543975}
parent ac1a8082
Hide whitespace changes
Inline Side-by-side
Showing with 147 additions and 4 deletions
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset-anchor.html 0 → 100644
View file @ 11493484
<meta charset="utf-8">
<title>'offset-anchor' 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('offset-anchor', [
{ syntax: 'auto' },
{ syntax: '<position>' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset-distance.html 0 → 100644
View file @ 11493484
<!doctype html>
<meta charset="utf-8">
<title>'offset-distance' 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('offset-distance', [
{ syntax: '<length>' },
{ syntax: '<percentage>' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset-path.html 0 → 100644
View file @ 11493484
<!doctype html>
<meta charset="utf-8">
<title>'offset-path' 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('offset-path', [
{ syntax: 'none' },
]);
runUnsupportedPropertyTests('offset-path', [
'ray(45deg closest-side)',
'path("M 100 100 L 300 100 L 200 300 Z")',
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset-position.html 0 → 100644
View file @ 11493484
<!doctype html>
<meta charset="utf-8">
<title>'offset-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('offset-position', [
{ syntax: 'auto' },
{ syntax: '<position>' },
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset-rotate.html 0 → 100644
View file @ 11493484
<meta charset="utf-8">
<title>'offset-rotate' 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';
runUnsupportedPropertyTests('offset-rotate', [
'auto 90deg',
'reverse -90deg',
]);
</script>
third_party/WebKit/LayoutTests/external/wpt/css/css-typed-om/the-stylepropertymap/properties/offset.html 0 → 100644
View file @ 11493484
<!doctype html>
<meta charset="utf-8">
<title>'offset' 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';
runUnsupportedPropertyTests('offset', [
'auto', '10px 30px', 'none',
'ray(45deg closest-side)',
'path("M 100 100 L 300 100 L 200 300 z")',
'ray(45deg closest-side) / 40px 20px'
]);
</script>
third_party/WebKit/Source/core/css/CSSProperties.json5
View file @ 11493484
...@@ -1906,6 +1906,8 @@ ...@@ -1906,6 +1906,8 @@
default_value: "LengthPoint(Length(kAuto), Length(kAuto))", default_value: "LengthPoint(Length(kAuto), Length(kAuto))",
type_name: "LengthPoint", type_name: "LengthPoint",
converter: "ConvertPositionOrAuto", converter: "ConvertPositionOrAuto",
keywords: ["auto"],
typedom_types: ["Keyword", "Position"]
}, },
{ {
name: "offset-distance", name: "offset-distance",
...@@ -1915,6 +1917,7 @@ ...@@ -1915,6 +1917,7 @@
field_template: "<length>", field_template: "<length>",
default_value: "Length(0, kFixed)", default_value: "Length(0, kFixed)",
converter: "ConvertLength", converter: "ConvertLength",
typedom_types: ["Length", "Percentage"]
}, },
{ {
name: "offset-path", name: "offset-path",
...@@ -1927,6 +1930,8 @@ ...@@ -1927,6 +1930,8 @@
default_value: "nullptr", default_value: "nullptr",
type_name: "BasicShape", type_name: "BasicShape",
converter: "ConvertOffsetPath", converter: "ConvertOffsetPath",
keywords: ["none"],
typedom_types: ["Keyword"]
}, },
{ {
name: "offset-position", name: "offset-position",
...@@ -1939,6 +1944,8 @@ ...@@ -1939,6 +1944,8 @@
default_value: "LengthPoint(Length(kAuto), Length(kAuto))", default_value: "LengthPoint(Length(kAuto), Length(kAuto))",
type_name: "LengthPoint", type_name: "LengthPoint",
converter: "ConvertPositionOrAuto", converter: "ConvertPositionOrAuto",
keywords: ["auto"],
typedom_types: ["Keyword", "Position"]
}, },
{ {
name: "offset-rotate", name: "offset-rotate",
......
third_party/WebKit/Source/core/css/cssom/StyleValueFactory.cpp
View file @ 11493484
...@@ -70,6 +70,12 @@ CSSStyleValue* CreateStyleValueWithPropertyInternal(CSSPropertyID property_id, ...@@ -70,6 +70,12 @@ CSSStyleValue* CreateStyleValueWithPropertyInternal(CSSPropertyID property_id,
return CSSUnsupportedStyleValue::Create(property_id, value); return CSSUnsupportedStyleValue::Create(property_id, value);
case CSSPropertyTransform: case CSSPropertyTransform:
return CSSTransformValue::FromCSSValue(value); return CSSTransformValue::FromCSSValue(value);
case CSSPropertyOffsetAnchor:
case CSSPropertyOffsetPosition:
// offset-anchor and offset-position can be 'auto'
if (value.IsIdentifierValue())
return CreateStyleValue(value);
FALLTHROUGH;
case CSSPropertyObjectPosition: case CSSPropertyObjectPosition:
return CSSPositionValue::FromCSSValue(value); return CSSPositionValue::FromCSSValue(value);
case CSSPropertyAlignItems: { case CSSPropertyAlignItems: {
......
third_party/WebKit/Source/core/css/properties/ComputedStyleUtils.cpp
View file @ 11493484
...@@ -50,10 +50,10 @@ CSSValue* ComputedStyleUtils::ValueForPosition(const LengthPoint& position, ...@@ -50,10 +50,10 @@ CSSValue* ComputedStyleUtils::ValueForPosition(const LengthPoint& position,
if (position.X().IsAuto()) if (position.X().IsAuto())
return CSSIdentifierValue::Create(CSSValueAuto); return CSSIdentifierValue::Create(CSSValueAuto);
CSSValueList* list = CSSValueList::CreateSpaceSeparated(); return CSSValuePair::Create(
list->Append(*ZoomAdjustedPixelValueForLength(position.X(), style)); ZoomAdjustedPixelValueForLength(position.X(), style),
list->Append(*ZoomAdjustedPixelValueForLength(position.Y(), style)); ZoomAdjustedPixelValueForLength(position.Y(), style),
return list; CSSValuePair::kKeepIdenticalValues);
} }
CSSValue* ComputedStyleUtils::ValueForOffset(const ComputedStyle& style, CSSValue* ComputedStyleUtils::ValueForOffset(const ComputedStyle& style,
......
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