layout/reftests/cssom/computed-style-cross-window-ref.html

   1 <!DOCTYPE HTML>
   2 <title>getComputedStyle across windows</title>
   3 <style>
   4 p { color: blue }
   5
   6 div { margin: 1em 0 }
   7 </style>
   8
   9 <script>
  10
  11 var gRunCount = 2;
  12
  13 function run() {
  14   if (--gRunCount != 0)
  15     return;
  16
  17   var i = document.getElementById("i");
  18
  19   var pout = document.getElementById("out");
  20   var poutnone = document.getElementById("outnone");
  21   var pin = i.contentDocument.getElementsByTagName("p")[0];
  22   var pinnone = i.contentDocument.getElementsByTagName("p")[1];
  23
  24   document.getElementById("res1").style.color =
  25     window.getComputedStyle(pin).color;
  26
  27   document.getElementById("res2").style.color =
  28     i.contentWindow.getComputedStyle(pout).color;
  29
  30   document.getElementById("res3").style.color =
  31     window.getComputedStyle(pinnone).color;
  32
  33   document.getElementById("res4").style.color =
  34     i.contentWindow.getComputedStyle(poutnone).color;
  35 }
  36
  37 </script>
  38 <body onload="run()">
  39
  40 <p id="out">This is a paragraph outside the iframe.</p>
  41 <div style="display:none"><p id="outnone">This is a paragraph outside the iframe.</p></div>
  42
  43 <iframe id="i" src="computed-style-cross-window-inner.html" onload="run()"></iframe>
  44
  45 <div style="color:fuchsia">This paragraph is the color that
  46 outerWindow.getComputedStyle says the paragraph inside the iframe
  47 is.</div>
  48
  49 <div style="color:blue">This paragraph is the color that
  50 iframeWindow.getComputedStyle says the paragraph outside the iframe
  51 is.</div>
  52
  53 <div style="color:fuchsia">This paragraph is the color that
  54 outerWindow.getComputedStyle says the display:none paragraph inside the
  55 iframe is.</div>
  56
  57 <div style="color:blue">This paragraph is the color that
  58 iframeWindow.getComputedStyle says the display:none paragraph outside
  59 the iframe is.</div>