third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-change-alignment-from-stretch.html - Issue 2832783003: [css-grid] Clearing the override height before layout

Side by Side Diff: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-change-alignment-from-stretch.html

Issue 2832783003: [css-grid] Clearing the override height before layout (Closed)

Patch Set: Added test and some optimizations. Created 3 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:

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

	2 <link href="../css-intrinsic-dimensions/resources/width-keyword-classes.css" rel ="stylesheet">

	3 <link href="resources/grid.css" rel="stylesheet">

	4 <link href="resources/grid-alignment.css" rel="stylesheet">

	5 <script src="../../resources/testharness.js"></script>

	6 <script src="../../resources/testharnessreport.js"></script>

	7 <style>

	8 .grid {

	9 position: relative;

	10 grid-template-columns: 100px;

	11 grid-template-rows: 200px;

	12 font: 10px/1 ahem;

	13 }

	14 </style>

	15 <p>Test to verify that grid item's stretched size is reset when changing to a di fferent alignment value.</p>
	Manuel Rego 2017/04/21 10:45:46 Could you make this test under LayoutTests/externa Could you make this test under LayoutTests/external/wpt/css/css-grid-1/? And we'll test the auto-sync stuff with WPT. :-) You'll just need to add a <title> and <meta author> and use this paragraph as <meta assert>. Also the usual <meta utf-8> stuff. jfernandez 2017/04/21 11:15:33 Yes, I'll do it. Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > Could you make this test under LayoutTests/external/wpt/css/css-grid-1/? > And we'll test the auto-sync stuff with WPT. :-) > > You'll just need to add a <title> and <meta author> > and use this paragraph as <meta assert>. > Also the usual <meta utf-8> stuff. Yes, I'll do it.
	16 <div class="grid fit-content">

	17 <div id="item">XXXXX</div>

	18 </div>

	19 <script>

	20 var child = document.getElementById("item");

	21 values = ['self-start', 'self-end', 'start', 'end', 'center', 'right', 'left', ' baseline'];
	Manuel Rego 2017/04/21 10:45:46 Nit: Use "var" or even "const" to define "values". Nit: Use "var" or even "const" to define "values". Also in theory 'use strict'; is recommended too: https://chromium.googlesource.com/chromium/src/+/master/docs/testing/layout_t... jfernandez 2017/04/21 11:15:33 Acknowledged. Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > Nit: Use "var" or even "const" to define "values". > > Also in theory 'use strict'; is recommended too: > https://chromium.googlesource.com/chromium/src/+/master/docs/testing/layout_t... Acknowledged.
	22 values.forEach(function(value) {

	23 child.style.alignSelf = 'stretch';

	24 child.style.justifySelf = 'stretch';

	25 test(function() {

	26 assert_equals(child.offsetWidth, 100, "The width is not what it should.");
	Manuel Rego 2017/04/21 10:45:46 I'll change the string to something like: "Check i I'll change the string to something like: "Check item's width after setting 'stretch' alignment." jfernandez 2017/04/21 11:15:33 This assert message is only shown when it fails. T Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > I'll change the string to something like: > "Check item's width after setting 'stretch' alignment." This assert message is only shown when it fails. The test id is defined below, as "Checking stretched size before changing to " + value)"
	27 assert_equals(child.offsetHeight, 200, "The height is not what it should. " + value);
	Manuel Rego 2017/04/21 10:45:46 Ditto. Also remove the "+ value" at the end. Ditto. Also remove the "+ value" at the end. jfernandez 2017/04/21 11:15:33 This is a mistake, thanks for finding it. Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > > Also remove the "+ value" at the end. This is a mistake, thanks for finding it.
	28 }, "Checking stretched size before changing to " + value);

	29

	30 child.style.alignSelf = value;

	31 child.style.justifySelf = value;

	32 test(function() {

	33 assert_equals(child.offsetWidth, 50, "The width is not what it should.");
	Manuel Rego 2017/04/21 10:45:46 And here something like: "Check item's width after And here something like: "Check item's width after setting '" + value + "' alignment." jfernandez 2017/04/21 11:15:33 Already commented about it above. Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > And here something like: > "Check item's width after setting '" + value + "' alignment." Already commented about it above.
	34 assert_equals(child.offsetHeight, 10, "The height is not what it should. " + value);
	Manuel Rego 2017/04/21 10:45:46 Ditto. Ditto. jfernandez 2017/04/21 11:15:33 Already commented about it above. Show quoted text On 2017/04/21 10:45:46, Manuel Rego wrote: > Ditto. Already commented about it above.
	35 }, "Checking size after changing to " + value);

	36 });

	37 </script>

OLD	NEW

« no previous file with comments | « no previous file | third_party/WebKit/Source/core/layout/GridTrackSizingAlgorithm.cpp » ('j') | no next file with comments »