Index: LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-scrolled-viewport.html |
diff --git a/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-scrolled-viewport.html b/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-scrolled-viewport.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..69200afccb65440c306e0a931f60730a8901ad76 |
--- /dev/null |
+++ b/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-scrolled-viewport.html |
@@ -0,0 +1,28 @@ |
+<!DOCTYPE html> |
+<html> |
+<head> |
+<script> |
+if (window.internals) |
+ internals.settings.setDialogElementEnabled(true); |
+</script> |
+</head> |
+<body style="height: 10000px; width: 10000px"> |
+<p style="position: fixed"> |
+This tests that a top layer element's containing block is the initial containing |
+block. The dialog is positioned at (1200, 1200) and the window is scrolled to |
+(1000, 1000) so the dialog should be positioned at (200, 200) relative to the |
+viewport. |
+</p> |
+<div style="position: absolute; top: 5000px; left: 5000px; width: 20px;"> |
+ <dialog id="dialog" style="top: 1200px; left: 1200px; right: auto; height: 250px; width: 50%; background-color: yellow"> |
+ This dialog should be onscreen with a width of 50% of the viewport. It is the child of an narrow element |
+ positioned off screen, but its containing block is the initial containing block, so its |
+ position and percent lengths are relative to that. |
+ </dialog> |
+</div> |
+<script> |
+window.scroll(1000, 1000); |
+document.getElementById('dialog').showModal(); |
+</script> |
+</body> |
+</html> |