| OLD | NEW |
|---|
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <title>CSS3 media query test: @media css rule media.mediaText property parsing,
media query syntax error should be handled correctly.</title> | 3 <title>CSS3 media query test: @media css rule media.mediaText property parsing,
media query syntax error should be handled correctly.</title> |
| 4 <link rel="help" href="http://www.w3.org/TR/CSS21/media.html" /> | 4 <link rel="help" href="http://www.w3.org/TR/CSS21/media.html" /> |
| 5 | 5 |
| 6 <style type="text/css"> | 6 <style type="text/css"> |
| 7 p#result {color: green} | 7 p#result {color: green} |
| 8 | 8 |
| 9 @media not screen { | 9 @media not screen { |
| 10 /* query will be modified from javascript */ | 10 /* query will be modified from javascript */ |
| 11 /* the manipulation contains syntax error, and should fail */ | 11 /* the manipulation contains syntax error, and should fail */ |
| 12 p#result {color: red} | 12 p#result {color: red} |
| 13 } | 13 } |
| 14 | 14 |
| 15 @media screen and resolution > 40dpi { | 15 @media screen and resolution > 40dpi { |
| 16 /* media query with syntax error should fail */ | 16 /* media query with syntax error should fail */ |
| 17 /* corresponding DOM manipulation will fail */ | 17 /* corresponding DOM manipulation will fail */ |
| 18 p#result {color: red} | 18 p#result {color: red} |
| 19 } | 19 } |
| 20 </style> | 20 </style> |
| 21 <script language="javascript"> | 21 <script language="javascript"> |
| 22 function test() { | 22 function test() { |
| 23 // The following is valid according to the CSS 2.1 note: "Media Queries |
| 24 // supercedes this error handling.", as it is malformed and should be |
| 25 // represented as "not all". |
| 23 try { | 26 try { |
| 24 // this should throw | |
| 25 document.styleSheets[0].cssRules[1].media.mediaText = "screen and resolu
tion > 40dpi"; | 27 document.styleSheets[0].cssRules[1].media.mediaText = "screen and resolu
tion > 40dpi"; |
| 26 } catch (e) { | |
| 27 document.getElementById("result").innerHTML = "This text should be green
."; | 28 document.getElementById("result").innerHTML = "This text should be green
."; |
| 28 document.getElementById("details").innerHTML = "Caught exception: " + e; | 29 document.getElementById("details").innerHTML = "New media: " + document.
styleSheets[0].cssRules[1].media.mediaText; |
| 29 } | 30 } catch(e) { |
| 31 document.getElementById("details").innerHTML = "An exception was caught:
" + e |
| 32 } |
| 30 } | 33 } |
| 31 </script> | 34 </script> |
| 32 | 35 |
| 33 </head> | 36 </head> |
| 34 <body onload="test()"> | 37 <body onload="test()"> |
| 35 <p id="result">Failure: test not run</p> | 38 <p id="result">Failure: test not run</p> |
| 36 <p id="details"></p> | 39 <p id="details"></p> |
| 37 </body> | 40 </body> |
| 38 </html> | 41 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 14578010:
Fixing inconsistency with the media query spec and other browsers (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master