24 outline: 4px solid red;
31 background-color: red !important;
34 background-color: green !important;
37 transform: translateZ(0);
41 background-color: green;
45 background-color: red;
49 if (window.testRunner) {
50 testRunner.dumpAsText();
51 testRunner.waitUntilDone();
56 if (window.testRunner)
57 document.getElementById('layers1').innerText = window.internals.layerTreeAsText(document);
59 window.setTimeout(function() {
60 var firstImage = document.querySelectorAll('img')[0];
61 firstImage.style.visibility = 'visible';
63 if (window.testRunner)
64 document.getElementById('layers2').innerText = window.internals.layerTreeAsText(document);
66 window.setTimeout(function() {
67 var secondContainer = document.querySelectorAll('.container')[1];
68 secondContainer.style.visibility = 'visible';
70 if (window.testRunner) {
71 document.getElementById('layers3').innerText = window.internals.layerTreeAsText(document);
72 testRunner.notifyDone();
77 window.addEventListener('load', doTest, false);
81 <!-- Tests dynamic changes of visibility, using directly composited images. -->
82 <div class="composited container"><img src="../resources/thiswayup.png" class="hidden composited box"></div>
83 <div class="composited hidden container"><img src="../resources/thiswayup.png" class="composited box"></div>
84 <div class="composited hidden container"><img src="../resources/thiswayup.png" class="visible composited box"></div>
87 <pre id="layers1"></pre>
90 <pre id="layers2"></pre>
93 <pre id="layers3"></pre>