LayoutTests/fast/media/mq-js-media-forward-syntax.html

   1 <html>
   2 <head>
   3 <title>CSS3 media query test: stylesheet media.mediaText = parsing, media descriptor fallback in document.StyleSheet.media.mediaText</title>
   4 <link rel="help" href="http://www.w3.org/TR/css3-mediaqueries/" />
   5
   6 <!-- the media property of stylesheet below will be manipulated, and
   7  manipulation should respect html media descriptor forward-compatible syntax.
   8  This means the manipulation should succeed. -->
   9 <style type="text/css">
  10
  11 p#result { color: green;}
  12
  13 @media screen and resolution > 40dpi {
  14 /* media query with syntax error should fail */
  15 /* corresponding DOM manipulation to the mediaText of the stylesheet will succeed */
  16 p#result { color: red;}
  17
  18 }
  19 </style>
  20 <script language="javascript">
  21 function test() {
  22    // this should not throw, because StyleSheet should respect Media Description forward-compatible syntax
  23    document.styleSheets[0].media.mediaText = "screen and resolution > 40dpi";
  24    document.getElementById("result").innerHTML = "This text should be green.";
  25 }
  26 </script>
  27
  28
  29 </head>
  30 <body onload="test()">
  31 <p id="result">Failure: test not run</p>
  32 </body>
  33 </html>