1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145
|
<!doctype html>
<meta charset="utf-8">
<meta name="timeout" content="long">
<link rel=help href="https://html.spec.whatwg.org/multipage/interactive-elements.html#dialog-light-dismiss">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script src="../../popovers/resources/popover-utils.js"></script>
<button id="outside">Outside</button>
<!-- test cases: -->
<!-- normal cases: -->
<dialog closedby="any" data-behavior="any"></dialog>
<dialog closedby="closerequest" data-behavior="closerequest"></dialog>
<dialog closedby="none" data-behavior="none"></dialog>
<!-- case sensitivity: -->
<dialog closedby="AnY" data-behavior="any"></dialog>
<dialog closedby="ClOsErEqUeSt" data-behavior="closerequest"></dialog>
<dialog closedby="NoNe" data-behavior="none"></dialog>
<!-- invalid value, no value, missing attribute: -->
<dialog closedby="invalid" data-behavior="auto"></dialog>
<dialog closedby data-behavior="auto"></dialog>
<dialog data-behavior="auto"></dialog>
<script>
function openDialog(dialog,openMethod) {
assert_false(dialog.open,'Should be closed to start');
assert_equals(dialog.matches(':open'),dialog.open,':open should match .open');
switch (openMethod) {
case 'modeless' :
dialog.show();
break;
case 'modal' :
dialog.showModal();
break;
case 'open' :
dialog.open = true;
break;
default:
assert_unreached('Invalid open method');
}
assert_true(dialog.open,'Should be open now');
assert_equals(dialog.matches(':open'),dialog.open,':open should match .open');
}
function getDefaultExpectations(behavior, openMethod) {
switch (behavior) {
case 'any':
return {
respondsToEsc: true,
respondsToLightDismiss: true,
expectedReflectionWhileOpen: behavior,
expectedReflectionWhileClosed: behavior,
};
case 'closerequest':
return {
respondsToEsc: true,
respondsToLightDismiss: false,
expectedReflectionWhileOpen: behavior,
expectedReflectionWhileClosed: behavior,
};
case 'none':
return {
respondsToEsc: false,
respondsToLightDismiss: false,
expectedReflectionWhileOpen: behavior,
expectedReflectionWhileClosed: behavior,
};
case 'auto':
if (openMethod === 'modal') {
return {
respondsToEsc: true,
respondsToLightDismiss: false,
expectedReflectionWhileOpen: 'closerequest',
expectedReflectionWhileClosed: 'none',
};
} else {
return {
respondsToEsc: false,
respondsToLightDismiss: false,
expectedReflectionWhileOpen: 'none',
expectedReflectionWhileClosed: 'none',
};
}
default:
assert_unreached('Invalid expectation');
}
}
function runTest(dialog, openMethod) {
promise_test(async (t) => {
assert_false(dialog.open,'setup');
assert_false(dialog.matches(':open'));
t.add_cleanup(() => dialog.close());
let expectations = getDefaultExpectations(dialog.dataset.behavior, openMethod);
// Open the dialog
openDialog(dialog,openMethod);
assert_equals(dialog.matches(':modal'),openMethod === 'modal',':modal incorrect');
const closedByReflectionWhileOpen = dialog.closedBy;
// Try hitting ESC
const ESC = '\uE00C';
const close_fired = new Promise(resolve => {
dialog.addEventListener('close', resolve, { once: true })
});
await test_driver.send_keys(document.documentElement,ESC);
if (expectations.respondsToEsc) {
await close_fired;
} else {
await waitForRender();
}
const respondsToEsc = !dialog.open;
assert_equals(!dialog.matches(':open'),respondsToEsc,':open should match dialog.open');
dialog.close();
// Try clicking outside
openDialog(dialog,openMethod);
assert_equals(dialog.matches(':modal'),openMethod === 'modal',':modal incorrect');
await clickOn(outside);
const respondsToLightDismiss = !dialog.open;
assert_equals(!dialog.matches(':open'),respondsToLightDismiss,':open should match dialog.open');
dialog.close();
// See if expectations match
assert_equals(respondsToEsc,expectations.respondsToEsc,`Dialog ${expectations.respondsToEsc ? "should" : "should NOT"} respond to ESC`);
assert_equals(respondsToLightDismiss,expectations.respondsToLightDismiss,`Dialog ${expectations.respondsToLightDismiss ? "should" : "should NOT"} respond to light dismiss`);
assert_equals(closedByReflectionWhileOpen,expectations.expectedReflectionWhileOpen,'Reflection should be limited to known values (open)');
assert_equals(dialog.closedBy,expectations.expectedReflectionWhileClosed,'Reflection should be limited to known values (closed)');
}, `closedby=${dialog.getAttribute('closedby')}, ${openMethod}`);
}
// Run tests
document.querySelectorAll('dialog').forEach((dialog) => {
for(openMethod of ['modeless','modal','open']) {
runTest(dialog, openMethod);
}
});
</script>
|