1375980 - stylo: site issue: i tag with data:image/svg+xml background on mobile.de

Status: VERIFIED DUPLICATE of bug 1376092

(Core :: CSS Parsing and Computation, defect)

Description

[Darkspirit]

Attachment: 2017-06-23_mobile.de.png

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:56.0) Gecko/20100101 Firefox/56.0
Build ID: 20170623115718

Steps to reproduce:

(I am just walking through this list: http://www.alexa.com/topsites/countries/DE)

This time: https://www.mobile.de/
The images on those car type buttons in the search widget are not visible.

See screenshot. 
left: stylo enabled, webrender/webrendest disabled
right: sylo disabled, webrender/webrendest enabled

Comment 1

[Bobby Holley (:bholley)]

This may be the same as bug 1375977 - over to Jeremy since he's investigating that bug.

Comment 2

[Darkspirit]

If I change
<noscript><link href="/cph/grunticon/icons-fallback.css" rel="stylesheet"></noscript>
to
<link href="/cph/grunticon/icons-fallback.css" rel="stylesheet">
icons are displayed.

Note "grunticon" in the path.
So we know they set that icons by script and have a fallback (grunticon/icons-fallback.css).

The noscript fallback sets
background-image: url('png/searchcar-current-xxl.png');
where we normally would have
url('data:image/svg+xml[...]

The path name of the fallback css file lets me assume that they use grunticon which uses:

Quote from https://github.com/filamentgroup/grunticon#loadcss
> loadCSS
> See: https://github.com/filamentgroup/loadcss

The same github user appeared in bug 1376092 comment 8 with his loadcss project:

(In reply to Emilio Cobos Álvarez [:emilio] from comment #8)
> Ok, so that bit is
> https://github.com/filamentgroup/loadCSS/blob/master/src/loadCSS.js and
> https://github.com/filamentgroup/loadCSS/blob/master/src/cssrelpreload.js.
> 
> That script has:
> 
>     // temporarily set media to something inapplicable to ensure it'll fetch
> without blocking render
>     ss.media = "only x";
> 
> Which means that we'll think that the stylesheet is not applicable when it
> loads. They create the <link> using Javascript, so we _do_ get that media
> right the first time (unlike when they come from the HTML parser, which is
> bug 1372041)... But we don't update it properly when they change the media
> to the original media="all", so the Servo side of things will always believe
> that that stylesheet doesn't apply.
> 
> So this is a slightly different variant of bug 1372041, which hopefully will
> be resolved soon and will fix this one too.

So we can mark this as duplicate of bug 1376092 and live will be more beautiful.

Comment 3

[Darkspirit]

correction: "and life will be more beautiful"

I think I'll wait for bug 1372041 first, before I report further bugs.

Comment 4

[Darkspirit]

Nightly 56 x64 20170703100343 @ Debian Testing (Linux 4.9.0-3-amd64, Radeon RX480)
about:support > Stylo: true (enabled by user)

Verified fixed: https://www.mobile.de/