Automatic update from web-platform-tests [Reference Target] Use relatedTarget for event propagation Replace the reference target handling in GetShadowRootParent with an approach that uses Event's existing relatedTarget concept, per discussion at [1]. The way this will work is that for CommandEvent, ToggleEvent, SubmitEvent, and InterestEvent, instead of an internal source/submitter, the events will use relatedTarget. The getters for these no longer need individual retargeting since relatedTarget gets retargeted as part of event dispatch. When relatedTarget is non-null for one of these event types, we'll dispatch it as a composed event. The result is that when the source/submitter is in a parent shadow because of reference target, we'll bubble the event into that shadow (but no further, due to the way relatedTarget already affects event dispatch). [1] https://github.com/whatwg/html/pull/10995#issuecomment-4572681552 Bug: 346835896 Change-Id: I6cb5cde907a3db8492795adb13e971bbd92f5ca5 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7902895 Commit-Queue: Dan Clark <daniec@microsoft.com> Reviewed-by: Mason Freed <masonf@chromium.org> Cr-Commit-Position: refs/heads/main@{#1650570} -- wpt-commits: 9911aea5c6a42d47b89c88d43e91ce04d4f1099f wpt-pr: 60816
223 lines
6.9 KiB
HTML
223 lines
6.9 KiB
HTML
<!DOCTYPE html>
|
|
<meta charset="utf-8">
|
|
<link rel="author" href="mailto:masonf@chromium.org">
|
|
<link rel=help href="https://open-ui.org/components/popover.research.explainer">
|
|
<link rel=help href="https://html.spec.whatwg.org/multipage/popover.html">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
|
|
<script>
|
|
test(function() {
|
|
var event = new ToggleEvent("");
|
|
assert_true(event instanceof window.ToggleEvent);
|
|
}, "the event is an instance of ToggleEvent");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("");
|
|
assert_true(event instanceof window.Event);
|
|
}, "the event inherts from Event");
|
|
|
|
test(function() {
|
|
assert_throws_js(TypeError, function() {
|
|
new ToggleEvent();
|
|
}, 'First argument (type) is required, so was expecting a TypeError.');
|
|
}, 'Missing type argument');
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test");
|
|
assert_equals(event.type, "test");
|
|
}, "type argument is string");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent(null);
|
|
assert_equals(event.type, "null");
|
|
}, "type argument is null");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent(undefined);
|
|
assert_equals(event.type, "undefined");
|
|
}, "event type set to undefined");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test");
|
|
assert_equals(event.oldState, "");
|
|
}, "oldState has default value of empty string");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test");
|
|
assert_readonly(event, "oldState", "readonly attribute value");
|
|
}, "oldState is readonly");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test");
|
|
assert_equals(event.newState, "");
|
|
}, "newState has default value of empty string");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test");
|
|
assert_readonly(event, "newState", "readonly attribute value");
|
|
}, "newState is readonly");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", null);
|
|
assert_equals(event.oldState, "");
|
|
assert_equals(event.newState, "");
|
|
}, "ToggleEventInit argument is null");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", undefined);
|
|
assert_equals(event.oldState, "");
|
|
assert_equals(event.newState, "");
|
|
}, "ToggleEventInit argument is undefined");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {});
|
|
assert_equals(event.oldState, "");
|
|
assert_equals(event.newState, "");
|
|
}, "ToggleEventInit argument is empty dictionary");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: "sample"});
|
|
assert_equals(event.oldState, "sample");
|
|
}, "oldState set to 'sample'");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: undefined});
|
|
assert_equals(event.oldState, "");
|
|
}, "oldState set to undefined");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: null});
|
|
assert_equals(event.oldState, "null");
|
|
}, "oldState set to null");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: false});
|
|
assert_equals(event.oldState, "false");
|
|
}, "oldState set to false");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: true});
|
|
assert_equals(event.oldState, "true");
|
|
}, "oldState set to true");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: 0.5});
|
|
assert_equals(event.oldState, "0.5");
|
|
}, "oldState set to a number");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: []});
|
|
assert_equals(event.oldState, "");
|
|
}, "oldState set to []");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: [1, 2, 3]});
|
|
assert_equals(event.oldState, "1,2,3");
|
|
}, "oldState set to [1, 2, 3]");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {oldState: {sample: 0.5}});
|
|
assert_equals(event.oldState, "[object Object]");
|
|
}, "oldState set to an object");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test",
|
|
{oldState: {valueOf: function () { return 'sample'; }}});
|
|
assert_equals(event.oldState, "[object Object]");
|
|
}, "oldState set to an object with a valueOf function");
|
|
|
|
test(function() {
|
|
var eventInit = {oldState: "sample",newState: "sample2"};
|
|
var event = new ToggleEvent("test", eventInit);
|
|
assert_equals(event.oldState, "sample");
|
|
assert_equals(event.newState, "sample2");
|
|
}, "ToggleEventInit properties set value");
|
|
|
|
test(function() {
|
|
var eventInit = {oldState: "open",newState: "closed"};
|
|
var event = new ToggleEvent("beforetoggle", eventInit);
|
|
assert_equals(event.oldState, "open");
|
|
assert_equals(event.newState, "closed");
|
|
}, "ToggleEventInit properties set value 2");
|
|
|
|
test(function() {
|
|
var eventInit = {oldState: "closed",newState: "open"};
|
|
var event = new ToggleEvent("toggle", eventInit);
|
|
assert_equals(event.oldState, "closed");
|
|
assert_equals(event.newState, "open");
|
|
}, "ToggleEventInit properties set value 3");
|
|
|
|
test(function() {
|
|
var eventInit = {oldState: "open",newState: "open"};
|
|
var event = new ToggleEvent("beforetoggle", eventInit);
|
|
assert_equals(event.oldState, "open");
|
|
assert_equals(event.newState, "open");
|
|
}, "ToggleEventInit properties set value 4");
|
|
|
|
test(function() {
|
|
const div = document.createElement('div');
|
|
const eventInit = {source: div};
|
|
const event = new ToggleEvent('beforetoggle', eventInit);
|
|
assert_equals(event.source, div);
|
|
}, 'ToggleEventInit with source.');
|
|
|
|
test(function() {
|
|
const div = document.createElement('div');
|
|
const eventInit = {source: div};
|
|
const event = new ToggleEvent('beforetoggle', eventInit);
|
|
assert_equals(event.relatedTarget, undefined);
|
|
}, 'ToggleEvent doesn\'t expose relatedTarget property.');
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: "sample"});
|
|
assert_equals(event.newState, "sample");
|
|
}, "newState set to 'sample'");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: undefined});
|
|
assert_equals(event.newState, "");
|
|
}, "newState set to undefined");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: null});
|
|
assert_equals(event.newState, "null");
|
|
}, "newState set to null");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: false});
|
|
assert_equals(event.newState, "false");
|
|
}, "newState set to false");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: true});
|
|
assert_equals(event.newState, "true");
|
|
}, "newState set to true");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: 0.5});
|
|
assert_equals(event.newState, "0.5");
|
|
}, "newState set to a number");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: []});
|
|
assert_equals(event.newState, "");
|
|
}, "newState set to []");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: [1, 2, 3]});
|
|
assert_equals(event.newState, "1,2,3");
|
|
}, "newState set to [1, 2, 3]");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test", {newState: {sample: 0.5}});
|
|
assert_equals(event.newState, "[object Object]");
|
|
}, "newState set to an object");
|
|
|
|
test(function() {
|
|
var event = new ToggleEvent("test",
|
|
{newState: {valueOf: function () { return 'sample'; }}});
|
|
assert_equals(event.newState, "[object Object]");
|
|
}, "newState set to an object with a valueOf function");
|
|
</script>
|