third_party/WebKit/LayoutTests/fast/dom/HTMLDialogElement/abspos-dialog-layout.html - Issue 1826423003: fix getComputedStyle positioned element values

Side by Side Diff: third_party/WebKit/LayoutTests/fast/dom/HTMLDialogElement/abspos-dialog-layout.html

Issue 1826423003: fix getComputedStyle positioned element values (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@lkgr

Patch Set: Incorporated review comments Created 4 years, 8 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

« third_party/WebKit/LayoutTests/animations/change-keyframes.html ('K') | « third_party/WebKit/LayoutTests/fast/css/hover-affects-child.html ('k') | third_party/WebKit/LayoutTests/fast/dom/HTMLDialogElement/abspos-dialog-layout-expected.txt » ('j') | third_party/WebKit/Source/core/css/ComputedStyleCSSValueMapping.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE html>	1 <!DOCTYPE html>

2 <link href="resources/dialog-layout.css" rel="stylesheet">	2 <link href="resources/dialog-layout.css" rel="stylesheet">

3 <script src="../../../resources/js-test.js"></script>	3 <script src="../../../resources/js-test.js"></script>

4 <dialog id="dialog">It is my dialog.</dialog>	4 <dialog id="dialog">It is my dialog.</dialog>

5 <div id="absolute-div">	5 <div id="absolute-div">

6 <div id="relative-div"></div>	6 <div id="relative-div"></div>

7 </div>	7 </div>

8 <script>	8 <script>

9 description('Tests layout of absolutely positioned modal dialogs.');	9 description('Tests layout of absolutely positioned modal dialogs.');

10	10

(...skipping 17 matching lines...) Expand all Loading...
28	28

29 (function() {	29 (function() {

30 debug('<br>showModal() should center in the viewport.');	30 debug('<br>showModal() should center in the viewport.');

31	31

32 dialog.showModal();	32 dialog.showModal();

33 checkCentered(dialog);	33 checkCentered(dialog);

34 reset();	34 reset();

35 }());	35 }());

36	36

37 (function() {	37 (function() {

38 debug('<br>The computed top and bottom of a centered dialog should still hav e position auto.');	38 debug('<br>The dialog is a positioned element, so the top and bottom should not have style auto.');

39	39

40 dialog.showModal();	40 dialog.showModal();

41 shouldBeEqualToString('window.getComputedStyle(dialog).top', 'auto');	41 shouldBeEqualToString('window.getComputedStyle(dialog).top', '790px');
	mstensho (USE GERRIT) 2016/04/04 09:13:26 Yes, I think this is reasonable and correct behavi Yes, I think this is reasonable and correct behavior. The dialog is centered. If the viewport (and initial containing block) height is 600px, and line height is 20px, we end up with a dialog whose top is 290px below the top of the initial containing block and whose bottom is 290px above the bottom of the ICB. However, we are scrolled by 0,500, so when the dialog is opened, its position is adjusted accordingly. The ICB is always at scroll position 0,0, no matter what the actual scroll position is. Since Blink is the only engine that supports DIALOG, we have nobody to compare against, though. Mr. Kevin 2016/04/04 17:35:22 Acknowledged. Show quoted text On 2016/04/04 09:13:26, mstensho wrote: > Yes, I think this is reasonable and correct behavior. The dialog is centered. If > the viewport (and initial containing block) height is 600px, and line height is > 20px, we end up with a dialog whose top is 290px below the top of the initial > containing block and whose bottom is 290px above the bottom of the ICB. However, > we are scrolled by 0,500, so when the dialog is opened, its position is adjusted > accordingly. The ICB is always at scroll position 0,0, no matter what the actual > scroll position is. > > Since Blink is the only engine that supports DIALOG, we have nobody to compare > against, though. Acknowledged.
42 shouldBeEqualToString('window.getComputedStyle(dialog).bottom', 'auto');	42 shouldBeEqualToString('window.getComputedStyle(dialog).bottom', '-210px');

43 reset();	43 reset();

44 }());	44 }());

45	45

46 (function() {	46 (function() {

47 debug('<br>Dialog should be recentered if showModal() is called after close( ).'),	47 debug('<br>Dialog should be recentered if showModal() is called after close( ).'),

48	48

49 dialog.showModal();	49 dialog.showModal();

50 dialog.close();	50 dialog.close();

51 window.scroll(0, 2 * window.scrollY);	51 window.scroll(0, 2 * window.scrollY);

52 dialog.showModal();	52 dialog.showModal();

(...skipping 127 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
180 (function() {	180 (function() {

181 debug('<br>A dialog with specified \'bottom\' should be positioned as usual' );	181 debug('<br>A dialog with specified \'bottom\' should be positioned as usual' );

182 offset = 50;	182 offset = 50;

183 dialog.style.bottom = offset + 'px';	183 dialog.style.bottom = offset + 'px';

184 dialog.showModal();	184 dialog.showModal();

185 shouldBe('dialog.getBoundingClientRect().bottom + window.scrollY', 'window.i nnerHeight - offset');	185 shouldBe('dialog.getBoundingClientRect().bottom + window.scrollY', 'window.i nnerHeight - offset');

186 dialog.style.bottom = 'auto';	186 dialog.style.bottom = 'auto';

187 reset();	187 reset();

188 }());	188 }());

189 </script>	189 </script>

OLD	NEW