Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(48)

Unified Diff: LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-containing-block.html

Issue 14373010: Make abspos <dialog>'s containing block be the ICB. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: review comments Created 7 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-containing-block.html
diff --git a/LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-containing-block.html b/LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-containing-block.html
new file mode 100644
index 0000000000000000000000000000000000000000..d675fad7d49836193e3ee3e702c2dc9222865718
--- /dev/null
+++ b/LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-containing-block.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script>
+if (window.internals)
+ internals.settings.setDialogElementEnabled(true);
+</script>
+</head>
+<body>
+<p>
+This tests that a dialog's containing block is in the initial containing block and that it is unaffected by
+ancestor elements with overflow or opacity.
+<div style="position: absolute; top: 400px; opacity: 0.3">
+ <dialog id="opaqueDialog" style="position: absolute; top: 250px; left: 0px; background-color: magenta">
+ This dialog should be unaffected by its ancestor with opacity.
+ </dialog>
+</div>
+<div style="position: absolute; overflow: hidden; width: 500px; height: 150px; top: 400px; left: 300px">
+ <dialog id="unclippedDialog" style="position: absolute; top: 200px; left: 0px; height: 100px; background-color: cyan">
+ This dialog should be unaffected by its ancestor with overflow. It should not be clipped.
+ </dialog>
+</div>
+<div style="position: absolute; top: 1000px; left: 1000px; width: 20px;">
+ <dialog id="bottomDialog" style="position: absolute; top: 100px; height: 250px; width: 90%; background-color: yellow">
+ This dialog should be onscreen with a width of 90% of the page. It is the child of an narrow element
+ positioned off screen, but the containing block of a dialog is the initial containing block, so its
+ position and percent lengths are relative to that.
+ </dialog>
+</div>
+<script>
+document.getElementById('bottomDialog').show();
+document.getElementById('unclippedDialog').show();
+document.getElementById('opaqueDialog').show();
+</script>
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698