| OLD | NEW |
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <link rel="help" href="http://www.whatwg.org/specs/web-apps/current-work/multipa
ge/interactive-elements.html#attr-details-open"> | |
| 5 <script src="../../resources/js-test.js"></script> | |
| 6 </head> | |
| 7 <body> | |
| 8 <details id="details" ontoggle="handleToggleEventFromHTMLAttribute(event)"> | |
| 9 <summary>details</summary> | |
| 10 <input> | |
| 11 </details> | |
| 12 <script> | |
| 13 description("Tests that a 'toggle' event is fired asynchronously whenever the op
en attribute is added to or removed from a details element."); | |
| 14 window.jsTestIsAsync = true; | |
| 15 | |
| 16 var toggleEventCount = 0; | |
| 17 var toggleEventCountFromHTMLAttribute = 0; | |
| 18 var testEvent; | |
| 19 | |
| 20 function handleToggleEventFromHTMLAttribute(ev) { | |
| 21 testEvent = ev; | |
| 22 shouldBe("testEvent.__proto__", "Event.prototype"); | |
| 23 shouldBeEqualToString("testEvent.type", "toggle"); | |
| 24 ++toggleEventCountFromHTMLAttribute; | |
| 25 } | |
| 26 | |
| 27 function handleToggleEvent(ev) { | |
| 28 testEvent = ev; | |
| 29 shouldBe("testEvent.__proto__", "Event.prototype"); | |
| 30 shouldBeEqualToString("testEvent.type", "toggle"); | |
| 31 ++toggleEventCount; | |
| 32 } | |
| 33 | |
| 34 function checkSingleToggleEvent() { | |
| 35 shouldBe("toggleEventCount", "1"); | |
| 36 shouldBe("toggleEventCountFromHTMLAttribute", "1"); | |
| 37 shouldBeTrue("details.open"); | |
| 38 testEventsCoalesced(); | |
| 39 } | |
| 40 | |
| 41 function testToogleEventFired() { | |
| 42 shouldBe("toggleEventCount", "0"); | |
| 43 shouldBe("toggleEventCountFromHTMLAttribute", "0"); | |
| 44 details.open = true; | |
| 45 shouldBe("toggleEventCount", "0"); | |
| 46 shouldBe("toggleEventCountFromHTMLAttribute", "0"); | |
| 47 setTimeout(checkSingleToggleEvent, 0); | |
| 48 } | |
| 49 | |
| 50 function checkEventsCoalesced() { | |
| 51 shouldBe("toggleEventCount", "2"); | |
| 52 shouldBe("toggleEventCountFromHTMLAttribute", "2"); | |
| 53 shouldBeFalse("details.open"); | |
| 54 finishJSTest(); | |
| 55 } | |
| 56 | |
| 57 function testEventsCoalesced() { | |
| 58 // When the open attribute is toggled several times in succession, | |
| 59 // these steps essentially get coalesced so that only one event is | |
| 60 // fired. | |
| 61 details.open = false; | |
| 62 details.open = true; | |
| 63 details.open = false; | |
| 64 setTimeout(checkEventsCoalesced, 0); | |
| 65 } | |
| 66 | |
| 67 var details = document.getElementById("details"); | |
| 68 shouldBe("details.ontoggle.__proto__", "Function.prototype"); | |
| 69 details.addEventListener("toggle", handleToggleEvent); | |
| 70 shouldBeFalse("details.open"); | |
| 71 testToogleEventFired(); | |
| 72 </script> | |
| 73 </body> | |
| 74 </html> | |
| OLD | NEW |