Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /html/semantics/interactive-elements/the-dialog-element/dialog-popover-overlay.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<link rel=author href="mailto:masonf@chromium.org">
<link rel=match href="dialog-popover-overlay-ref.html">
<dialog open popover></dialog>
<div class=blocker></div>
<style>
* {
margin: 0;
padding: 0;
}
dialog,div {
left: 0;
top: 0;
border: 0;
width: 300px;
height: 300px;
background: green;
}
.blocker {
contain: layout;
background: red;
}
</style>
<script>
const dialog = document.querySelector('dialog');
dialog.showPopover();
dialog.blur();
</script>