Page MenuHomePhabricator

SVG icons embedded in stylesheets broken in Wikimedia production due to mime-type confusion
Closed, ResolvedPublic

Description

Screenshot of problem in production.

As of recently, we have SVG versions of the external link icons in MediaWiki. These are embedded as base64 encoded data uris by CSSMin in ResourceLoader.

Locally, these are working fine for me. Comes out as:

background-image: linear-gradient(transparent,transparent),url(data:image/svg+xml;base64,PD...

In production, however, they are broken.
E.g.: https://www.mediawiki.org/wiki/VisualEditor/Basic_example_worksheet#Links

background-image: linear-gradient(transparent,transparent),url(data:application/xml;base64,PD...

I can consistently reproduce this in Chrome (latest stable). I eliminated other causes by verifying that it breaks locally if I change the mime type in the CSS manually, and visa versa by changing it to image/svg+xml in the browser console when looking at production.

Not sure if this supposed to work according to the spec, but fact is, Chrome (maybe other browsers as well) does not accept application/xml in data uris for background images.


Version: wmf-deployment
Severity: major

Attached:

Screen_Shot_2014-01-03_at_13.10.36.png (804×2 px, 295 KB)

Details

Reference
bz59249