layout/style/test/test_bug732209.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=732209
   5 -->
   6 <head>
   7   <meta charset="utf-8">
   8   <title>Test for Bug 732209</title>
   9   <script src="/tests/SimpleTest/SimpleTest.js"></script>
  10   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11   <style>
  12     #content span { color: red; }
  13     #content span.reverse { color: green; }
  14     #content { display: block !important; }
  15     #content span::before { content: attr(id); }
  16   </style>
  17   <link rel="stylesheet" href="bug732209-css.sjs?one">
  18   <link rel="stylesheet" href="bug732209-css.sjs?two" crossorigin>
  19   <link rel="stylesheet" href="bug732209-css.sjs?three" crossorigin="use-credentials">
  20   <link rel="stylesheet"
  21         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?four">
  22   <link rel="stylesheet"
  23         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?five"
  24         crossorigin>
  25   <link rel="stylesheet"
  26         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?six"
  27         crossorigin="use-credentials">
  28   <link rel="stylesheet"
  29         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?seven&cors-anonymous">
  30   <link rel="stylesheet" id="cross-origin-sheet"
  31         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?eight&cors-anonymous"
  32         crossorigin>
  33   <link rel="stylesheet"
  34         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?nine&cors-anonymous"
  35         crossorigin="use-credentials">
  36   <link rel="stylesheet"
  37         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?ten&cors-credentials">
  38   <link rel="stylesheet"
  39         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?eleven&cors-credentials"
  40         crossorigin>
  41   <link rel="stylesheet"
  42         href="http://example.com/tests/layout/style/test/bug732209-css.sjs?twelve&cors-credentials"
  43         crossorigin="use-credentials">
  44 </head>
  45 <body>
  46 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=732209">Mozilla Bug 732209</a>
  47 <p id="display"></p>
  48 <div id="content" style="display: none">
  49   <span id="one"></span>
  50   <span id="two"></span>
  51   <span id="three"></span>
  52   <span id="four"></span>
  53   <span id="five" class="reverse"></span>
  54   <span id="six" class="reverse"></span>
  55   <span id="seven"></span>
  56   <span id="eight"></span>
  57   <span id="nine" class="reverse"></span>
  58   <span id="ten"></span>
  59   <span id="eleven"></span>
  60   <span id="twelve"></span>
  61 </div>
  62 <pre id="test" style="color: red">
  63 <script type="application/javascript">
  64
  65 /** Test for Bug 732209 **/
  66
  67 SimpleTest.waitForExplicitFinish();
  68 addLoadEvent(function() {
  69   var spans = $("content").querySelectorAll("span");
  70   for (var i = 0; i < spans.length; ++i) {
  71     is(getComputedStyle(spans[i], "").color, "rgb(0, 128, 0)",
  72        "Span " + spans[i].id + " should be green");
  73   }
  74
  75   try {
  76     var sheet = $("cross-origin-sheet").sheet;
  77     dump('aaa\n');
  78     is(sheet.cssRules.length, 2,
  79        "Should be able to get length of list of rules");
  80     is(sheet.cssRules[0].style.color, "green",
  81        "Should be able to read individual rules");
  82   } catch (e) {
  83     ok(false,
  84        "Should be allowed to access cross-origin sheet that opted in with CORS: " + e);
  85   }
  86
  87   SimpleTest.finish();
  88 });
  89
  90
  91
  92 </script>
  93 </pre>
  94 </body>
  95 </html>