New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

<style scoped> is translated to <link rel="stylesheet" scoped> however there is no browser support for the latter #918

Closed
GoogleCodeExporter opened this Issue Apr 6, 2015 · 7 comments

Comments

Projects
None yet
1 participant
@GoogleCodeExporter
Copy link

GoogleCodeExporter commented Apr 6, 2015

What steps will reproduce the problem?
1. open source of https://www.highdefinition.ch/test.html?ModPagespeed=off
2. open source of https://www.highdefinition.ch/test.html
3. look for "scoped", compare

What is the expected output? 
<style scoped="scoped">@import url('/styles/kendo.metroblack.min.css')</style>

What do you see instead?
<link rel="stylesheet" href="/styles/kendo.metroblack.min.css" scoped="scoped"/>

<link scoped> is currently not supported by any browsers. The 
<style>@import</style> workaround has to be used. This translation of mod 
pagespeed is not only useless, it breaks the page.

What version of the product are you using (please check X-Mod-Pagespeed
header)?
X-Mod-Pagespeed: 1.7.30.4-3847

On what operating system?
Fedora 20

Which version of Apache?
Server: Apache/2.4.7 (Fedora) OpenSSL/1.0.1e-fips mod_nss/2.4.6 NSS/3.15.3 
Basic ECC PHP/5.5.10 mod_wsgi/3.4 Python/2.7.5 mod_perl/2.0.9-dev Perl/v5.18.2

Which MPM?
Whats that?

URL of broken page:
See above



Original issue reported on code.google.com by frederic...@gmail.com on 25 Mar 2014 at 3:10

@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Thanks for the report. Workaround would be to disable inline_import_to_link.
I think I'll go ahead and fix it right now (modulo imminent lunch), since it's 
very easy to do so.


Original comment by morlov...@google.com on 25 Mar 2014 at 3:28

  • Changed state: Accepted
@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Is <style scoped> only supported in FF?

Original comment by matterb...@google.com on 25 Mar 2014 at 3:29

@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Seems like it per:
http://caniuse.com/style-scoped
Chrome status is behind a flag, and doesn't seem like there is a current 
timeline:
http://www.chromestatus.com/features/5374137958662144
... But given this basically just needs an if statement in each of 2 filters 
(css_inline_import_to_link and outline_css), I think we should just handle it.

Original comment by morlov...@google.com on 25 Mar 2014 at 3:38

@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Actually looks like Chrome is planning on removing it entirely:
https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/R1x18ZLS5qQ

Original comment by morlov...@google.com on 25 Mar 2014 at 3:40

@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Well currently you have to enable "Experimentelle Webplattformfunktionen 
aktivieren" (in english probably "activate experimental webplatform functions") 
under about:flags in chrome. This feature is handy in my case. But I will 
probably have to de-minify the foreign css and put additional selectors in it 
in order to cope with probably dead end feature of scoped css files. A really 
painful job...

Original comment by frederic...@gmail.com on 25 Mar 2014 at 8:00

@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

This issue was closed by revision r3886.

Original comment by morlov...@google.com on 25 Mar 2014 at 8:49

  • Changed state: Fixed
@GoogleCodeExporter

This comment has been minimized.

Copy link

GoogleCodeExporter commented Apr 6, 2015

Original comment by morlov...@google.com on 25 Mar 2014 at 8:52

  • Added labels: Milestone-v31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment