CSS Custom Properties are hard to use from inside of Polymer elements |
||||||
Issue descriptionRepro steps: 1) Turn off vulcanization and compile Chromium. 2) Go to chrome://downloads The toolbar color is broken, because in the non-vulcanized version --md-background-color CSS var is not defined. Also there is a related warning in the console (see screenshot).
,
May 5 2016
the fix for this coincides with unblocking the history page from using md_colors.css (our shared custom props file)
,
May 5 2016
,
May 5 2016
correction: it's because the <link> was inside of shadow DOM, not a <template> http://i.imgur.com/Gw9zEVg.png
,
May 5 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/916c6e84f2a975baec9fc965c76653dcbfd939b4 commit 916c6e84f2a975baec9fc965c76653dcbfd939b4 Author: dbeam <dbeam@chromium.org> Date: Thu May 05 19:35:07 2016 MD Downloads: fix unvulcanized build by adding <style no-process> Vulcanize finds <link>s and inlines them. In this sense, it does what it says on the tin. But, unfortunately, in this case the browser would not have loaded <link href> inside of shadow DOM (i.imgur.com/Gw9zEVg.png). So there's a behavioral difference between the vulcanized and unvulcanized versions of downloads. Additionally, all <style> inside of <dom-module>s are processed through Polymer's CSS custom prop shim. In this case, it replaces unresolved(?) variables with ''. This disables sharing of native custom properties between history and downloads. So I've added <style no-process>, which circumvents Polymer's CSS custom prop shim. It's meant to be a minimal, temporary solution until the Polymer team lands a better, more thorough alternative that bypasses the shim everywhere for browsers that support CSS custom props (and possibly @apply). R=tsergeant@chromium.org BUG= 608098 CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation Review-Url: https://codereview.chromium.org/1952123002 Cr-Commit-Position: refs/heads/master@{#391871} [modify] https://crrev.com/916c6e84f2a975baec9fc965c76653dcbfd939b4/chrome/browser/resources/md_downloads/manager.html [modify] https://crrev.com/916c6e84f2a975baec9fc965c76653dcbfd939b4/chrome/browser/resources/md_downloads/vulcanized.html [modify] https://crrev.com/916c6e84f2a975baec9fc965c76653dcbfd939b4/third_party/polymer/v1_0/chromium.patch [modify] https://crrev.com/916c6e84f2a975baec9fc965c76653dcbfd939b4/third_party/polymer/v1_0/components-chromium/polymer/polymer-extracted.js
,
May 5 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/ee1833f510be9a7da4eb75bfecbf4581f71ee193 commit ee1833f510be9a7da4eb75bfecbf4581f71ee193 Author: dbeam <dbeam@chromium.org> Date: Thu May 05 21:37:14 2016 MD Downloads: move md_colors.css to useful place Previously it was inside shadow DOM, which has no effect. R=michaelpg@chromium.org BUG= 608098 CQ_INCLUDE_TRYBOTS=tryserver.chromium.linux:closure_compilation Review-Url: https://codereview.chromium.org/1948023004 Cr-Commit-Position: refs/heads/master@{#391909} [modify] https://crrev.com/ee1833f510be9a7da4eb75bfecbf4581f71ee193/chrome/browser/resources/md_downloads/manager.html [modify] https://crrev.com/ee1833f510be9a7da4eb75bfecbf4581f71ee193/chrome/browser/resources/md_downloads/vulcanized.html
,
Jun 3 2016
we should probably just wait for https://github.com/Polymer/polymer/pull/3587 at this point
,
Sep 26 2016
Since we're now using native custom properties in Polymer, we can remove the no-process hack. I'll send out a CL to do this shortly.
,
Sep 27 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/b8534fb568a8450d5a52589a73343735709d17cd commit b8534fb568a8450d5a52589a73343735709d17cd Author: tsergeant <tsergeant@chromium.org> Date: Tue Sep 27 05:50:55 2016 MD WebUI: Remove <style no-process> from Polymer <style no-process> was added in crrev.com/391871 as a temporary measure to allow native custom properties to be used without being overridden by Polymer's shim. All Polymer pages now use native custom properties, so this bypass is no longer necessary. This CL removes it from our Polymer checkout and the MD History/Downloads pages, with no visible changes as a result. BUG= 608098 CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation Review-Url: https://codereview.chromium.org/2370653002 Cr-Commit-Position: refs/heads/master@{#421119} [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/chrome/browser/resources/md_downloads/manager.html [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/chrome/browser/resources/md_downloads/vulcanized.html [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/chrome/browser/resources/md_history/app.html [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/chrome/browser/resources/md_history/app.vulcanized.html [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/third_party/polymer/v1_0/chromium.patch [modify] https://crrev.com/b8534fb568a8450d5a52589a73343735709d17cd/third_party/polymer/v1_0/components-chromium/polymer/polymer-extracted.js
,
Sep 27 2016
|
||||||
►
Sign in to add a comment |
||||||
Comment 1 by dbeam@chromium.org
, Apr 30 2016Components: UI>Browser>Downloads