зеркало из https://github.com/mozilla/gecko-dev.git
44 строки
1.5 KiB
HTML
44 строки
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>inert inside ShadowRoot affects slotted content</title>
|
|
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
</head>
|
|
<body>
|
|
<div>Button 1 should be inert, and Button 2 should not be inert.</div>
|
|
<div id="shadow-host">
|
|
<button slot="slot-1" id="button-1">Button 1 (inert)</button>
|
|
<button slot="slot-2" id="button-2">Button 2 (not inert)</button>
|
|
</div>
|
|
<script>
|
|
const shadowHost = document.getElementById("shadow-host");
|
|
const shadowRoot = shadowHost.attachShadow({ mode: "open" });
|
|
const inertDiv = document.createElement("div");
|
|
inertDiv.inert = true;
|
|
shadowRoot.appendChild(inertDiv);
|
|
const slot1 = document.createElement("slot");
|
|
slot1.name = "slot-1";
|
|
inertDiv.appendChild(slot1);
|
|
const slot2 = document.createElement("slot");
|
|
slot2.name = "slot-2";
|
|
shadowRoot.appendChild(slot2);
|
|
|
|
function testCanFocus(selector, canFocus) {
|
|
const element = document.querySelector(selector);
|
|
let focusedElement = null;
|
|
element.addEventListener("focus", function() { focusedElement = element; }, false);
|
|
element.focus();
|
|
assert_equals((focusedElement === element), canFocus);
|
|
}
|
|
|
|
test(() => {
|
|
testCanFocus("#button-1", false);
|
|
testCanFocus("#button-2", true);
|
|
}, "inert inside ShadowRoot affects slotted content");
|
|
</script>
|
|
</body>
|
|
</html>
|