| Index: LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block.html
|
| diff --git a/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block.html b/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block.html
|
| index 5e8e9d619d088a83cc3cb1d6c20978df2b7ee089..87f064952965a5e01619bee4af99a22b14fc9138 100644
|
| --- a/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block.html
|
| +++ b/LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block.html
|
| @@ -8,29 +8,21 @@ if (window.internals)
|
| </head>
|
| <body>
|
| <p>
|
| -This tests that a top layer element's containing block is in the initial containing block and that it is unaffected by
|
| -ancestor elements with overflow or opacity. Dialog elements are used to demonstrate these properties. A dialog opened
|
| -with showModal() is in the top layer; one opened with dialog.show() is not.
|
| -
|
| +This tests that a modal 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 modal dialog should be unaffected by its ancestor with opacity.
|
| - </dialog>
|
| - <dialog id="translucentDialog" style="position: absolute; top: 0px; height: 150px; width: 150px; background-color: magenta">
|
| - This non-modal dialog should be affected by its ancestor with opacity.
|
| + 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 modal dialog should be unaffected by its ancestor with overflow. It should not be clipped.
|
| - </dialog>
|
| - <dialog id="clippedDialog" style="position: absolute; top: 0px; height: 150px; width: 150px; background-color: cyan">
|
| - This non-modal dialog should be affected by its ancestor with overflow. It should be clipped.
|
| + 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 modal dialog should be onscreen with a width of 90% of the page. It is the child of an narrow element
|
| + 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 top layer element is the initial containing block, so its
|
| position and percent lengths are relative to that.
|
| </dialog>
|
| @@ -39,8 +31,6 @@ with showModal() is in the top layer; one opened with dialog.show() is not.
|
| document.getElementById('bottomDialog').showModal();
|
| document.getElementById('unclippedDialog').showModal();
|
| document.getElementById('opaqueDialog').showModal();
|
| -document.getElementById('clippedDialog').show();
|
| -document.getElementById('translucentDialog').show();
|
| </script>
|
| </body>
|
| </html>
|
|
|