Work around IE9's broken handling of .styleSheet.cssText

IE9 drops @media queries from .styleSheet.cssText when that property
is read. Therefore we can't trust it to contain what we put there
previously.

Bug: T108727
Change-Id: Ic4f553966e48e3fc608a47ef193df923227ceb96

diff --git a/resources/src/mediawiki/mediawiki.js b/resources/src/mediawiki/mediawiki.js
index 5dd2acb..1577fff 100644 (file)
--- a/resources/src/mediawiki/mediawiki.js
+++ b/resources/src/mediawiki/mediawiki.js
@@ -924,14 +924,22 @@
                                        // Verify that the element before the marker actually is a
                                        // <style> tag and one that came from ResourceLoader
                                        // (not some other style tag or even a `<meta>` or `<script>`).
-                                       if ( $style.data( 'ResourceLoaderDynamicStyleTag' ) === true ) {
+                                       if ( $style.data( 'ResourceLoaderDynamicStyleTag' ) ) {
                                                // There's already a dynamic <style> tag present and
                                                // we are able to append more to it.
                                                styleEl = $style.get( 0 );
                                                // Support: IE6-10
                                                if ( styleEl.styleSheet ) {
                                                        try {
-                                                               styleEl.styleSheet.cssText += cssText;
+                                                               // Support: IE9
+                                                               // We can't do styleSheet.cssText += cssText, since IE9 mangles this property on
+                                                               // write, dropping @media queries from the CSS text. If we read it and used its
+                                                               // value, we would accidentally apply @media-specific styles to all media. (T108727)
+                                                               if ( document.documentMode === 9 ) {
+                                                                       styleEl.styleSheet.cssText = $style.data( 'ResourceLoaderDynamicStyleTag' ) + cssText;
+                                                               } else {
+                                                                       styleEl.styleSheet.cssText += cssText;
+                                                               }
                                                        } catch ( e ) {
                                                                mw.track( 'resourceloader.exception', { exception: e, source: 'stylesheet' } );
                                                        }
@@ -943,7 +951,15 @@
                                        }
                                }
 
-                               $( newStyleTag( cssText, getMarker() ) ).data( 'ResourceLoaderDynamicStyleTag', true );
+                               $style = $( newStyleTag( cssText, getMarker() ) );
+
+                               if ( document.documentMode === 9 ) {
+                                       // Support: IE9
+                                       // Preserve original CSS text because IE9 mangles it on write
+                                       $style.data( 'ResourceLoaderDynamicStyleTag', cssText );
+                               } else {
+                                       $style.data( 'ResourceLoaderDynamicStyleTag', true );
+                               }
 
                                fireCallbacks();
                        }