The serialization of motion-path: path string should use double quotes.
Reported by
boris.ch...@gmail.com,
Aug 12
|
|||||||
Issue description
UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:61.0) Gecko/20100101 Firefox/61.0
Steps to reproduce the problem:
1. Set offset-path and use path() function
e.g. set "offset-path: path("M 10 10 Z");" to a div
2. Get the computed style of offset-path (or its specified value)
e.g. console.log(getComputedStyle(div).offsetPath);
What is the expected behavior?
According to the spec of https://drafts.csswg.org/cssom/#serialize-a-string:
The expected value should be: path("M 10 10 Z")
What went wrong?
The actual value is: path('M 10 10 Z')
Did this work before? N/A
Does this work in other browsers? Yes
Chrome version: 68.0.3440.106 Channel: n/a
OS Version: OS X 10.13
Flash Version:
The SVG path (V1.1) spec and Motion path spec don't mention the format of the serialization. However, [https://drafts.csswg.org/cssom/#serialize-a-string] says to use double-quotes for string, so I think the web-platform tests and the result of chrome should be fixed.
,
Aug 12
This may block Issue 654664.
,
Aug 13
,
Aug 13
boris.chiou@ - Thanks for filing the issue...!! Could you please provide a sample test file/url to test the issue from TE-end. This will help us in triaging the issue further. Thanks...!!
,
Aug 13
About the test, we could check the web-platform tests [1]. For path() function, Eric (from Google) wrote this tests, but he used single quotes, instead of double quotes, so Google Chrome could pass the tests, but this may not be correct because the serialization of a string should use double quotes [2], according to the spec.
In other words, in [1], it tries to parse this SVG Path, |path('m 0 0 h -100')|, and checking the output by |path('m 0 0 h -100')|. However, we should and I'd like to update the wpt to use double-quotes and check if the output is |path("m 0 0 h -1")|.
[1] https://github.com/web-platform-tests/wpt/blob/aaac36358ac55215fbb28d62d235470859001e91/css/motion/parsing/offset-path-parsing-valid.html#L24-L25
[2] https://drafts.csswg.org/cssom/#serialize-a-string
,
Aug 13
Thank you for providing more feedback. Adding the requester to the cc list. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Aug 20
,
Sep 7
,
Sep 7
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/85683b62dc35f1f2e323c6384cb3a0bb193330d2 commit 85683b62dc35f1f2e323c6384cb3a0bb193330d2 Author: Fredrik Söderquist <fs@opera.com> Date: Fri Sep 07 21:13:52 2018 Serialize the path() function with double quotes Per https://drafts.csswg.org/cssom/#serialize-a-string double quotes should be used when serializing strings. Bug: 873527 Change-Id: I3b7a3c6425c6a5d0d6f96399663f5ae8b3929a59 Reviewed-on: https://chromium-review.googlesource.com/1213171 Commit-Queue: Eric Willigers <ericwilligers@chromium.org> Reviewed-by: Eric Willigers <ericwilligers@chromium.org> Cr-Commit-Position: refs/heads/master@{#589652} [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/animations/responsive/animations-responsive-d.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/animations/responsive/animations-responsive-offset-path.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/css-parser/d-parsing.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/css-parser/offset-path-parsing.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/css3/motion-path/offset-path.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/css3/motion-path/offset.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/css/motion/parsing/offset-parsing-valid.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/css/motion/parsing/offset-path-parsing-valid-expected.txt [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/svg/path/property/d-interpolation-discrete.svg [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/svg/path/property/d-interpolation-relative-absolute.svg [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/svg/path/property/d-interpolation-single.svg [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/external/wpt/svg/path/property/getComputedStyle.svg [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/WebKit/LayoutTests/svg/css/path-element.html [modify] https://crrev.com/85683b62dc35f1f2e323c6384cb3a0bb193330d2/third_party/blink/renderer/core/css/css_path_value.cc
,
Sep 7
|
|||||||
►
Sign in to add a comment |
|||||||
Comment 1 Deleted