Chrome rejects changes between similar unprefixed & prefixed gradient syntax |
||||||||||
Issue descriptionChrome Version: 59.0.3067.0 (Official Build) dev (64-bit) OS: Ubuntu 16.04 What steps will reproduce the problem? (1) Load https://dholbert.github.io/tests/misc/webkit-linear-gradient-dynamic-1.html What is the expected result? Top two divs should look the same (and have orange at the top). Bottom two divs should look the same (and have blue at the top). What happens instead? The right two divs reject the dynamic style tweak - they have the gradient going in the wrong direction. Please use labels and text to provide additional information. * The testcase is testing dynamic changes between "linear-gradient" and "-webkit-linear-gradient" expressions. (Note that these syntaxes should point the gradient in *opposite directions* -- the prefixed version is implicitly "from" a given point, whereas the unprefixed version is "to" that point.) * The top 2 divs are both given unprefixed linear-gradient(to bottom, orange, blue), though the top-right div first briefly gets a prefixed style, which seems to prevent it from accepting the change to the unprefixed style. * Similar (but reverse) for the bottom 2 divs - they should both end up with unprefixed style, with blue at the top. I'm guessing that the CSS Parser is mistakenly thinking that the new style is the same as the old style, and rejecting the style change. Firefox Nightly 55 & Edge 14 both give "expected result". Chrome 59 dev and Safari 10 give the buggy results.
,
Apr 19 2017
> * Similar (but reverse) for the bottom 2 divs - they should both end up with unprefixed style, with blue at the top. Sorry -- I meant to say the bottom-two divs should end up with PREFIXED style. Also: I filed this as https://bugs.webkit.org/show_bug.cgi?id=171015 for Safari/WebKit, FWIW.
,
Apr 19 2017
Possibly simpler / more direct STR: Compare the results of these two experiments. EXPERIMENT A: 1. Visit https://www.example.org/ and hit F12 to open console 2. Type in the following: document.body.style.backgroundImage = "linear-gradient(to bottom, red, blue)"; alert(document.body.style.backgroundImage) --> Notice that the alert shows the value that you assigned, and visually, the gradient starts out at red. EXPERIMENT B (now with an intermediate prefixed style) 1. Visit https://www.example.org/ and hit F12 to open console 2. Type in the following: document.body.style.backgroundImage = "-webkit-linear-gradient(bottom, red, blue)" 3. Type in the following: document.body.style.backgroundImage = "linear-gradient(to bottom, red, blue)"; alert(document.body.style.backgroundImage) EXPECTED RESULTS: The two experiments should produce the same final state -- visually as well as the contents of the alert() dialog. They're doing the exact same thing, but just with an intermediate style in the second experiment. ACTUAL RESULTS: In the second experiment, we get stuck at the intermediate prefixed style (with "-webkit" in the serialization, and with blue at the top)
,
Apr 19 2017
Note that if you tweak the args (e.g. use "yellow" as one of the colors in the intermediate style in Experiment B), then it works correctly. The issue only happens when the args are the same (aside from the "to" token in the modern syntax). It seems that Chrome mistakenly assumes that this means the change has no effect.
,
Apr 20 2017
,
Apr 20 2017
,
Apr 20 2017
,
Oct 17 2017
,
Nov 27 2017
,
Dec 6 2017
,
Dec 6
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue. Sorry for the inconvenience if the bug really should have been left as Available. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Dec 10
|
||||||||||
►
Sign in to add a comment |
||||||||||
Comment 1 by dholb...@gmail.com
, Apr 19 2017