OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../resources/js-test.js"></script> |
| 3 |
| 4 <div id="sandbox"></div> |
| 5 |
| 6 <script> |
| 7 description("Media query listeners should fire grouped by the MediaQueryList
."); |
| 8 |
| 9 var sandbox = document.getElementById("sandbox"); |
| 10 var iframe = document.createElement("iframe"); |
| 11 sandbox.appendChild(iframe); |
| 12 |
| 13 var matchMedia = iframe.contentWindow.matchMedia; |
| 14 var mediaList1 = matchMedia("(max-width: 100px)"); |
| 15 var mediaList2 = matchMedia("(max-width: 100px)"); |
| 16 var mediaList3 = matchMedia("(max-width: 100px)"); |
| 17 |
| 18 var listenersCalled = []; |
| 19 |
| 20 function makeListener(label) { |
| 21 return function() { listenersCalled.push(label); }; |
| 22 } |
| 23 |
| 24 mediaList3.addListener(makeListener("mediaList3_1")); |
| 25 mediaList2.addListener(makeListener("mediaList2_1")); |
| 26 mediaList1.addListener(makeListener("mediaList1_1")); |
| 27 mediaList2.addListener(makeListener("mediaList2_2")); |
| 28 |
| 29 shouldBe("mediaList1.matches", "true"); |
| 30 shouldBe("mediaList2.matches", "true"); |
| 31 shouldBe("mediaList3.matches", "true"); |
| 32 |
| 33 // FIXME: You shouldn't need to touch offsetTop to force these updates. |
| 34 |
| 35 iframe.style.width = "200px"; |
| 36 iframe.offsetTop; |
| 37 |
| 38 var expectedResult = ["mediaList1_1", "mediaList2_1", "mediaList2_2", "media
List3_1"]; |
| 39 shouldBe("listenersCalled", "expectedResult"); |
| 40 </script> |
OLD | NEW |