-
Notifications
You must be signed in to change notification settings - Fork 30.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
events: reset event state after dispatch #54642
Merged
Merged
Changes from all commits
Commits
Show all changes
2 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
164 changes: 164 additions & 0 deletions
164
test/fixtures/wpt/dom/events/Event-dispatch-single-activation-behavior.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,164 @@ | ||
<!DOCTYPE html> | ||
<meta charset=utf-8> | ||
<title> Only one activation behavior is executed during dispatch</title> | ||
<link rel="author" title="Vincent Hilla" href="mailto:vhilla@mozilla.com"> | ||
<link rel="help" href="https://dom.spec.whatwg.org/#eventtarget-activation-behavior"> | ||
<link rel="help" href="https://dom.spec.whatwg.org/#concept-event-dispatch"> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<div id=log></div> | ||
|
||
<div id=test_container></div> | ||
|
||
<!-- | ||
Three classes: | ||
click | ||
Element to be clicked to cause activation behavior | ||
activates | ||
Element that registers the activation behavior | ||
container | ||
Element in which other elements with activation behavior are placed. | ||
We test that those won't be activated too. | ||
--> | ||
<template> | ||
<!--input, change event bubble, so have to check if checked is true--> | ||
<input class="click activates container" type="checkbox" oninput="this.checked ? activated(this) : null"> | ||
<input class="click activates container" type="radio" oninput="this.checked ? activated(this) : null"> | ||
<form onsubmit="activated(this); return false" class="activates"> | ||
<input class="click container" type="submit"> | ||
</form> | ||
<form onsubmit="activated(this); return false" class="activates"> | ||
<input class="click container" type="image"> | ||
</form> | ||
<form onreset="activated(this)" class="activates"> | ||
<input class="click container" type="reset"> | ||
</form> | ||
<form onsubmit="activated(this); return false" class="activates"> | ||
<button class="click container" type="submit"></button> | ||
</form> | ||
<form onreset="activated(this)" class="activates"> | ||
<button class="click container" type="reset"></button> | ||
</form> | ||
<a href="#link" class="click container activates"></a> | ||
<area href="#link" class="click container activates"> | ||
<details ontoggle="activated(this)" class="activates"> | ||
<summary class="click container"></summary> | ||
</details> | ||
<label> | ||
<input type=checkbox onclick="this.checked ? activated(this) : null" class="activates"> | ||
<span class="click container">label</span> | ||
</label> | ||
<!--activation behavior of label for event targeted at interactive content descendant is to do nothing--> | ||
<label class="container"> | ||
<button class="click" type="button"></button> | ||
</label> | ||
</template> | ||
|
||
<script> | ||
let activations = []; | ||
function activated(e) { | ||
activations.push(e); | ||
} | ||
|
||
function getActivations(testidx) { | ||
return activations.filter(a => | ||
(a.endsWith && a.endsWith("test"+testidx+"_link")) | ||
|| (a.classList && a.classList.contains("test"+testidx)) | ||
); | ||
} | ||
|
||
// for a and area elements | ||
window.onhashchange = function(e) { | ||
if (e.newURL.endsWith("link")) { | ||
activated(e.newURL); | ||
} | ||
window.location.hash = ""; | ||
}; | ||
|
||
function getElementsByClassNameInclusive(e, clsname) { | ||
let ls = Array.from(e.getElementsByClassName(clsname)); | ||
if (e.classList.contains(clsname)) ls.push(e); | ||
return ls; | ||
} | ||
|
||
function getClickTarget(e) { | ||
return getElementsByClassNameInclusive(e, "click")[0]; | ||
} | ||
|
||
function getContainer(e) { | ||
return getElementsByClassNameInclusive(e, "container")[0]; | ||
} | ||
|
||
function getExpectedActivations(e) { | ||
let ls = getElementsByClassNameInclusive(e, "activates"); | ||
|
||
// special case, for a and area the window registers the activation | ||
// have to use string, as testrunner cannot stringify the window object | ||
ls = ls.map(e => e.tagName === "A" || e.tagName === "AREA" ? e.href : e); | ||
|
||
return ls; | ||
} | ||
|
||
function toString(e) { | ||
const children = Array.from(e.children); | ||
const childstr = (children.map(toString)).join(""); | ||
const tag = e.tagName; | ||
const typestr = e.type ? " type="+e.type : ""; | ||
return `<${tag}${typestr}>${childstr}</${tag}>`; | ||
} | ||
|
||
// generate O(n^2) test combinations | ||
const template = document.querySelector("template"); | ||
const elements = Array.from(template.content.children); | ||
const tests = [] | ||
for (const target of elements) { | ||
for (const parent of elements) { | ||
if (target === parent) continue; | ||
tests.push([target.cloneNode(true), parent.cloneNode(true)]) | ||
} | ||
} | ||
|
||
const test_container = document.getElementById("test_container"); | ||
|
||
/** | ||
* Test that if two elements in an event target chain have activation behavior, | ||
* only one of them will be activated. | ||
* | ||
* Each child of <template> represents one case of activation behavior. | ||
* The behavior should be triggered by clicking the element of class click | ||
* and will manifest as a call to activated(). | ||
* | ||
* For each [target, parent] in tests, we make target a descendant of parent | ||
* and test that only target gets activated when dispatching a click. | ||
*/ | ||
for (let i = 0; i < tests.length; i++) { | ||
let [target, parent] = tests[i]; | ||
async_test(function(t) { | ||
let test = document.createElement("div"); | ||
test_container.appendChild(test); | ||
test.appendChild(parent); | ||
getContainer(parent).appendChild(target); | ||
|
||
// for later filtering out the activations belonging to this test | ||
for (let e of test.getElementsByClassName("activates")) { | ||
e.classList.add("test"+i); | ||
} | ||
for (let e of test.querySelectorAll("a, area")) { | ||
e.href = "#test"+i+"_link"; | ||
} | ||
|
||
getClickTarget(target).click(); | ||
|
||
// Need to spin event loop twice, as some clicks might dispatch another task | ||
t.step_timeout(() => { | ||
t.step_timeout(t.step_func_done(() => { | ||
assert_array_equals(getActivations(i), getExpectedActivations(target)); | ||
}), 0); | ||
}, 0); | ||
|
||
t.add_cleanup(function() { | ||
test_container.removeChild(test); | ||
}); | ||
}, `When clicking child ${toString(target)} of parent ${toString(parent)}, only child should be activated.`); | ||
} | ||
</script> |
69 changes: 69 additions & 0 deletions
69
test/fixtures/wpt/dom/events/Event-dispatch-throwing-multiple-globals.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,69 @@ | ||
<!DOCTYPE html> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<body> | ||
<script> | ||
function createIframe(t, srcdoc = '') { | ||
let iframe = document.createElement('iframe'); | ||
iframe.srcdoc = srcdoc; | ||
t.add_cleanup(() => iframe.remove()); | ||
return new Promise((resolve, reject) => { | ||
iframe.addEventListener('load', () => resolve(iframe.contentWindow)); | ||
document.body.appendChild(iframe); | ||
}); | ||
} | ||
|
||
// Returns a promise which will resolve with the next error event fired at any | ||
// of `windows`, after the invocation of this function. Once one does, this | ||
// function removes its listeners and produces that error event so that it can | ||
// be examined (most notably for which global proxy it was targeted at). | ||
async function nextErrorEvent(windows) { | ||
let listener; | ||
let p = new Promise((resolve, reject) => { | ||
listener = (event) => { resolve(event); event.preventDefault(); }; | ||
}); | ||
for (let w of windows) { | ||
w.addEventListener('error', listener); | ||
} | ||
try { | ||
return await p; | ||
} finally { | ||
for (let w of windows) { | ||
w.removeEventListener('error', listener); | ||
} | ||
} | ||
} | ||
|
||
promise_test(async t => { | ||
let w = await createIframe(t, `<script>function listener() { throw new Error(); }<`+`/script>`); | ||
let w2 = await createIframe(t); | ||
|
||
let target = new w2.EventTarget(); | ||
target.addEventListener('party', w.listener); | ||
let nextErrorPromise = nextErrorEvent([self, w, w2]); | ||
target.dispatchEvent(new Event('party')); | ||
let errorEvent = await nextErrorPromise; | ||
if (errorEvent.error) { | ||
assert_true(errorEvent.error instanceof w.Error, 'error should be an instance created inside the listener function'); | ||
} | ||
assert_equals(errorEvent.target, w, `error event should target listener's global but instead targets ${event.currentTarget === w2 ? 'target\'s global' : 'test harness global'}`); | ||
}, 'exception thrown in event listener function should result in error event on listener\'s global'); | ||
|
||
promise_test(async t => { | ||
let w = await createIframe(t, `<script>listener = {};<`+`/script>`); | ||
let w2 = await createIframe(t, `<script>handleEvent = () => { throw new Error; };<`+`/script>`); | ||
let w3 = await createIframe(t); | ||
w.listener.handleEvent = w2.handleEvent; | ||
|
||
let target = new w3.EventTarget(); | ||
target.addEventListener('party', w.listener); | ||
let nextErrorPromise = nextErrorEvent([self, w, w2, w3]); | ||
target.dispatchEvent(new Event('party')); | ||
let errorEvent = await nextErrorPromise; | ||
if (errorEvent.error) { | ||
assert_true(errorEvent.error instanceof w2.Error, 'error should be an instance created inside the listener function'); | ||
} | ||
assert_equals(errorEvent.target, w, `error event should target listener's global but instead targets ${event.currentTarget === w2 ? 'target\'s global' : event.currentTarget === w3 ? 'function\'s global' : 'test harness global'}`); | ||
}, 'exception thrown in event listener interface object should result in error event on listener\'s global'); | ||
</script> | ||
</body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the test that checks the behavior. Afaict
event.target
-> not reset after dispatch;event.currentTarget
-> reset after dispatch.