layout/style/test/test_computed_style_no_pseudo.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=505515
   5 -->
   6 <head>
   7   <title>Test for Bug 505515</title>
   8   <script src="/tests/SimpleTest/SimpleTest.js"></script>
   9   <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  10   <style type="text/css">
  11
  12   #display { color: black; background: white; }
  13   #display span { position: relative; display: inline-block; }
  14   #display:first-line { color: blue; }
  15
  16   </style>
  17 </head>
  18 <body onload="run()">
  19 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=505515">Mozilla Bug 505515</a>
  20 <p id="display" style="width: 30em">This <span id="sp">is</span> some text in which the first line is in a different color.</p>
  21 <pre id="test">
  22 <script type="application/javascript">
  23
  24 SimpleTest.waitForExplicitFinish();
  25
  26 /** Test for Bug 505515 **/
  27
  28 function run() {
  29   var p = document.getElementById("display");
  30   var span = document.getElementById("sp");
  31
  32   isnot(span.offsetWidth, 0,
  33         "span should have width (and we flushed layout)");
  34   is(getComputedStyle(p, "").color, "rgb(0, 0, 0)",
  35      "p should be black too");
  36
  37   let spanStyle = getComputedStyle(span, "");
  38   let width = spanStyle.width;
  39
  40   isnot(width.indexOf("px"), -1,
  41         "should be able to get the used value")
  42   is(width, spanStyle.width,
  43      "shouldn't lose track of the frame");
  44   is(spanStyle.color, "rgb(0, 0, 0)",
  45      "span should be black");
  46
  47   SimpleTest.finish();
  48 }
  49
  50 </script>
  51 </pre>
  52 </body>
  53 </html>