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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/dom/HTMLDialogElement/top-layer-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 unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-scrolled-viewport-expected.html ('k') | LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-expected.html » ('j') | Source/core/html/HTMLDialogElement.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <script> 4 <script>
5 if (window.internals) 5 if (window.internals)
6 internals.settings.setDialogElementEnabled(true); 6 internals.settings.setDialogElementEnabled(true);
7 </script> 7 </script>
8 </head> 8 </head>
9 <body> 9 <body>
10 <p> 10 <p>
11 This tests that a top layer element's containing block is in the initial contain ing block and that it is unaffected by 11 This tests that a modal dialog's containing block is in the initial containing b lock and that it is unaffected by
12 ancestor elements with overflow or opacity. Dialog elements are used to demonst rate these properties. A dialog opened 12 ancestor elements with overflow or opacity.
13 with showModal() is in the top layer; one opened with dialog.show() is not.
14
15 <div style="position: absolute; top: 400px; opacity: 0.3"> 13 <div style="position: absolute; top: 400px; opacity: 0.3">
16 <dialog id="opaqueDialog" style="position: absolute; top: 250px; left: 0px; background-color: magenta"> 14 <dialog id="opaqueDialog" style="position: absolute; top: 250px; left: 0px; background-color: magenta">
17 This modal dialog should be unaffected by its ancestor with opacity. 15 This dialog should be unaffected by its ancestor with opacity.
18 </dialog>
19 <dialog id="translucentDialog" style="position: absolute; top: 0px; height: 150px; width: 150px; background-color: magenta">
20 This non-modal dialog should be affected by its ancestor with opacity.
21 </dialog> 16 </dialog>
22 </div> 17 </div>
23 <div style="position: absolute; overflow: hidden; width: 500px; height: 150px; t op: 400px; left: 300px"> 18 <div style="position: absolute; overflow: hidden; width: 500px; height: 150px; t op: 400px; left: 300px">
24 <dialog id="unclippedDialog" style="position: absolute; top: 200px; left: 0p x; height: 100px; background-color: cyan"> 19 <dialog id="unclippedDialog" style="position: absolute; top: 200px; left: 0p x; height: 100px; background-color: cyan">
25 This modal dialog should be unaffected by its ancestor with overflow. It should not be clipped. 20 This dialog should be unaffected by its ancestor with overflow. It shoul d not be clipped.
26 </dialog>
27 <dialog id="clippedDialog" style="position: absolute; top: 0px; height: 150p x; width: 150px; background-color: cyan">
28 This non-modal dialog should be affected by its ancestor with overflow. It should be clipped.
29 </dialog> 21 </dialog>
30 </div> 22 </div>
31 <div style="position: absolute; top: 1000px; left: 1000px; width: 20px;"> 23 <div style="position: absolute; top: 1000px; left: 1000px; width: 20px;">
32 <dialog id="bottomDialog" style="position: absolute; top: 100px; height: 250 px; width: 90%; background-color: yellow"> 24 <dialog id="bottomDialog" style="position: absolute; top: 100px; height: 250 px; width: 90%; background-color: yellow">
33 This modal dialog should be onscreen with a width of 90% of the page. It is the child of an narrow element 25 This dialog should be onscreen with a width of 90% of the page. It is th e child of an narrow element
34 positioned off screen, but the containing block of a top layer element i s the initial containing block, so its 26 positioned off screen, but the containing block of a top layer element i s the initial containing block, so its
35 position and percent lengths are relative to that. 27 position and percent lengths are relative to that.
36 </dialog> 28 </dialog>
37 </div> 29 </div>
38 <script> 30 <script>
39 document.getElementById('bottomDialog').showModal(); 31 document.getElementById('bottomDialog').showModal();
40 document.getElementById('unclippedDialog').showModal(); 32 document.getElementById('unclippedDialog').showModal();
41 document.getElementById('opaqueDialog').showModal(); 33 document.getElementById('opaqueDialog').showModal();
42 document.getElementById('clippedDialog').show();
43 document.getElementById('translucentDialog').show();
44 </script> 34 </script>
45 </body> 35 </body>
46 </html> 36 </html>
OLDNEW
« no previous file with comments | « LayoutTests/fast/dom/HTMLDialogElement/non-modal-dialog-scrolled-viewport-expected.html ('k') | LayoutTests/fast/dom/HTMLDialogElement/top-layer-containing-block-expected.html » ('j') | Source/core/html/HTMLDialogElement.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698