[css-grid] Update grid when changing auto repeat type
authorobrufau@igalia.com <obrufau@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 14 May 2019 19:06:23 +0000 (19:06 +0000)
committerobrufau@igalia.com <obrufau@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 14 May 2019 19:06:23 +0000 (19:06 +0000)
https://bugs.webkit.org/show_bug.cgi?id=197849

Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Import WPT test.

* web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks-expected.txt: Added.
* web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html: Added.
* web-platform-tests/css/css-grid/grid-definition/w3c-import.log:

Source/WebCore:

Test: imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html

This patch makes two 'repeat()' values for 'grid-template' be considered
to be different if one uses 'auto-fill' and the other 'auto-fit'.

Previously, they were considered to be equal if the repeated values
were the same, without comparing the repeat type. Therefore, the grid
was not updated when setting both values one after the other.

* css/CSSGridAutoRepeatValue.cpp:
(WebCore::CSSGridAutoRepeatValue::equals const):
* css/CSSGridAutoRepeatValue.h:

LayoutTests:

Remove the test which has been upstreamed to WPT.

* fast/css-grid-layout/grid-change-auto-repeat-tracks-expected.txt: Removed.
* fast/css-grid-layout/grid-change-auto-repeat-tracks.html: Removed.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@245295 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks-expected.txt [deleted file]
LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks.html [deleted file]
LayoutTests/imported/w3c/ChangeLog
LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks-expected.txt [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html [new file with mode: 0644]
LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/w3c-import.log
Source/WebCore/ChangeLog
Source/WebCore/css/CSSGridAutoRepeatValue.cpp
Source/WebCore/css/CSSGridAutoRepeatValue.h

index a4d3b90..be72471 100644 (file)
@@ -1,3 +1,15 @@
+2019-05-14  Oriol Brufau  <obrufau@igalia.com>
+
+        [css-grid] Update grid when changing auto repeat type
+        https://bugs.webkit.org/show_bug.cgi?id=197849
+
+        Reviewed by Javier Fernandez.
+
+        Remove the test which has been upstreamed to WPT.
+
+        * fast/css-grid-layout/grid-change-auto-repeat-tracks-expected.txt: Removed.
+        * fast/css-grid-layout/grid-change-auto-repeat-tracks.html: Removed.
+
 2019-05-14  Antti Koivisto  <antti@apple.com>
 
         Event region computation should respect transforms
diff --git a/LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks-expected.txt b/LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks-expected.txt
deleted file mode 100644 (file)
index 9faf22e..0000000
+++ /dev/null
@@ -1,25 +0,0 @@
-This test checks that grid-template-{rows|columns} with auto-repeat tracks recomputes the positions of automatically placed grid items.
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
-PASS
diff --git a/LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks.html b/LayoutTests/fast/css-grid-layout/grid-change-auto-repeat-tracks.html
deleted file mode 100644 (file)
index 12ec660..0000000
+++ /dev/null
@@ -1,136 +0,0 @@
-<!DOCTYPE html>
-<link href="resources/grid.css" rel="stylesheet">
-<style>
-.grid {
-    grid-auto-rows: 25px;
-    grid-auto-columns: 25px;
-    margin-bottom: 10px;
-}
-
-.fixedWidth {
-    width: 50px;
-    grid-auto-flow: row;
-    grid-template-columns: repeat(auto-fill, 25px);
-}
-
-.fixedHeight {
-    width: 100px;
-    height: 50px;
-    grid-auto-flow: column;
-    grid-template-rows: repeat(auto-fill, 25px);
-}
-
-#i1, #i21 {
-    grid-row: auto;
-    grid-column: 1;
-    background-color: orange;
-}
-
-#i2, #i22 {
-    grid-row: 1;
-    grid-column: auto;
-    background-color: green;
-}
-
-#i3, #i23 {
-    grid-row: auto;
-    grid-column: auto;
-    background-color: blue;
-}
-</style>
-<!-- Explicitly not using layout-th because it does not allow multiple checkLayout(). -->
-<script src="../../resources/check-layout.js"></script>
-<script>
-function setGridTemplate(id, gridTemplateRows, gridTemplateColumns)
-{
-     var gridElement = document.getElementById(id);
-     gridElement.style.gridTemplateRows = gridTemplateRows;
-     gridElement.style.gridTemplateColumns = gridTemplateColumns;
-}
-
-function setGridSize(id, width, height)
-{
-     var gridElement = document.getElementById(id);
-     gridElement.style.width = width;
-     gridElement.style.height = height;
-}
-
-function testGridTemplates(firstGridItemData, secondGridItemData, thirdGridItemData)
-{
-    var i1 = document.getElementById(firstGridItemData.id);
-    i1.setAttribute("data-expected-width", firstGridItemData.width);
-    i1.setAttribute("data-expected-height", firstGridItemData.height);
-    i1.setAttribute("data-offset-x", firstGridItemData.x);
-    i1.setAttribute("data-offset-y", firstGridItemData.y);
-
-    var i2 = document.getElementById(secondGridItemData.id);
-    i2.setAttribute("data-expected-width", secondGridItemData.width);
-    i2.setAttribute("data-expected-height", secondGridItemData.height);
-    i2.setAttribute("data-offset-x", secondGridItemData.x);
-    i2.setAttribute("data-offset-y", secondGridItemData.y);
-
-    var i3 = document.getElementById(thirdGridItemData.id);
-    i3.setAttribute("data-expected-width", thirdGridItemData.width);
-    i3.setAttribute("data-expected-height", thirdGridItemData.height);
-    i3.setAttribute("data-offset-x", thirdGridItemData.x);
-    i3.setAttribute("data-offset-y", thirdGridItemData.y);
-
-    checkLayout(".grid");
-}
-
-function testChangingGridDefinitions()
-{
-     // Test changing the number of auto-repeat tracks.
-     setGridTemplate('grid1', 'none', 'repeat(auto-fill, 25px)');
-     testGridTemplates({ 'id': 'i1', 'width': '25', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '25', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '25', 'height': '25', 'x': '25', 'y': '25' });
-     setGridTemplate('grid2', 'repeat(auto-fill, 25px)', 'none');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '25', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '25', 'x': '25', 'y': '25' });
-
-     setGridTemplate('grid1', 'none', 'none');
-     testGridTemplates({ 'id': 'i1', 'width': '25', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '25', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '25', 'height': '25', 'x': '0', 'y': '50' });
-     setGridTemplate('grid2', 'none', 'none');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '25', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '25', 'x': '50', 'y': '0' });
-
-     setGridTemplate('grid1', 'none', '5px repeat(auto-fill, 20px)');
-     testGridTemplates({ 'id': 'i1', 'width': '5', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '5', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '20', 'height': '25', 'x': '5', 'y': '25' });
-     setGridTemplate('grid2', 'repeat(auto-fill, 20px) 3px', 'none');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '20', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '20', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '20', 'x': '25', 'y': '20' });
-
-     setGridTemplate('grid1', 'none', '5px repeat(auto-fill, 22px)');
-     testGridTemplates({ 'id': 'i1', 'width': '5', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '5', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '22', 'height': '25', 'x': '5', 'y': '25' });
-     setGridTemplate('grid2', 'repeat(auto-fill, 18px) 3px', 'none');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '18', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '18', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '18', 'x': '25', 'y': '18' });
-
-     setGridTemplate('grid1', 'none', 'repeat(auto-fill, 45px)');
-     testGridTemplates({ 'id': 'i1', 'width': '45', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '45', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '45', 'height': '25', 'x': '0', 'y': '50' });
-     setGridTemplate('grid2', 'repeat(auto-fill, 45px)', 'none');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '45', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '45', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '45', 'x': '50', 'y': '0' });
-
-     // Test changing the size of the grid.
-     setGridSize('grid1', '100px', 'auto');
-     testGridTemplates({ 'id': 'i1', 'width': '45', 'height': '25', 'x': '0', 'y': '25' }, { 'id': 'i2', 'width': '45', 'height': '25', 'x': '0', 'y': '0' }, { 'id': 'i3', 'width': '45', 'height': '25', 'x': '45', 'y': '25' });
-     setGridSize('grid2', '100px', '100px');
-     testGridTemplates({ 'id': 'i21', 'width': '25', 'height': '45', 'x': '0', 'y': '0' }, { 'id': 'i22', 'width': '25', 'height': '45', 'x': '25', 'y': '0' }, { 'id': 'i23', 'width': '25', 'height': '45', 'x': '25', 'y': '45' });
-}
-
-window.addEventListener("load", testChangingGridDefinitions, false);
-</script>
-
-<div>This test checks that grid-template-{rows|columns} with auto-repeat tracks recomputes the positions of automatically placed grid items.</div>
-<div id="log"></div>
-
-<div style="position: relative">
-    <div id="grid1" class="grid fixedWidth">
-        <div id="i1"></div>
-        <div id="i2"></div>
-        <div id="i3"></div>
-    </div>
-</div>
-
-<div style="position: relative">
-    <div id="grid2" class="grid fixedHeight">
-        <div id="i21"></div>
-        <div id="i22"></div>
-        <div id="i23"></div>
-    </div>
-</div>
index 06b7495..7e0e47b 100644 (file)
@@ -1,3 +1,16 @@
+2019-05-14  Oriol Brufau  <obrufau@igalia.com>
+
+        [css-grid] Update grid when changing auto repeat type
+        https://bugs.webkit.org/show_bug.cgi?id=197849
+
+        Reviewed by Javier Fernandez.
+
+        Import WPT test.
+
+        * web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks-expected.txt: Added.
+        * web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html: Added.
+        * web-platform-tests/css/css-grid/grid-definition/w3c-import.log:
+
 2019-05-14  Manuel Rego Casasnovas  <rego@igalia.com>
 
         [css-grid] Use max size to compute auto repeat tracks
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks-expected.txt
new file mode 100644 (file)
index 0000000..5854bec
--- /dev/null
@@ -0,0 +1,20 @@
+
+Harness Error (FAIL), message = 2 duplicate test names: ".grid 1", ".grid 2"
+
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+PASS .grid 1 
+PASS .grid 2 
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html
new file mode 100644 (file)
index 0000000..33fcb24
--- /dev/null
@@ -0,0 +1,178 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Support 'repeat()' notation for 'grid-template-columns' and 'grid-template-rows' properties</title>
+<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
+<link rel="help" href="http://www.w3.org/TR/css-grid-1/#repeat-notation" title="5.1.2 Repeating Rows and Columns: the 'repeat()' notation">
+<meta name="assert" content="This test checks that grid-template-{rows|columns} with auto-repeat tracks recomputes the positions of automatically placed grid items.">
+
+<link href="support/grid.css" rel="stylesheet">
+<style>
+.grid {
+  grid-auto-rows: 25px;
+  grid-auto-columns: 25px;
+  margin-bottom: 10px;
+}
+.fixedWidth {
+  width: 50px;
+  grid-auto-flow: row;
+  grid-template-columns: repeat(auto-fill, 25px);
+}
+.fixedHeight {
+  width: 100px;
+  height: 50px;
+  grid-auto-flow: column;
+  grid-template-rows: repeat(auto-fill, 25px);
+}
+#i1-1, #i2-1 {
+  grid-row: auto;
+  grid-column: 1;
+  background-color: orange;
+}
+#i1-2, #i2-2 {
+  grid-row: 1;
+  grid-column: auto;
+  background-color: green;
+}
+#i1-3, #i2-3 {
+  grid-row: auto;
+  grid-column: auto;
+  background-color: blue;
+}
+</style>
+
+<div id="log"></div>
+
+<div style="position: relative">
+  <div id="grid1" class="grid fixedWidth">
+    <div id="i1-1"></div>
+    <div id="i1-2"></div>
+    <div id="i1-3"></div>
+  </div>
+</div>
+<div style="position: relative">
+  <div id="grid2" class="grid fixedHeight">
+    <div id="i2-1"></div>
+    <div id="i2-2"></div>
+    <div id="i2-3"></div>
+  </div>
+</div>
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<script>
+function setGridTemplate(id, gridTemplateRows, gridTemplateColumns) {
+  let gridElement = document.getElementById(id);
+  gridElement.style.gridTemplateRows = gridTemplateRows;
+  gridElement.style.gridTemplateColumns = gridTemplateColumns;
+}
+
+function setGridSize(id, width, height) {
+  let gridElement = document.getElementById(id);
+  gridElement.style.width = width;
+  gridElement.style.height = height;
+}
+
+function setGridItemPlacement(id, gridRow, gridColumn) {
+  let gridItem = document.getElementById(id);
+  gridItem.style.gridRow = gridRow;
+  gridItem.style.gridColumn = gridColumn;
+}
+
+function testGridDefinitions(...gridItemDataList) {
+  for (let gridItemData of gridItemDataList) {
+    let gridItem = document.getElementById(gridItemData.id);
+    gridItem.setAttribute("data-expected-width", gridItemData.width);
+    gridItem.setAttribute("data-expected-height", gridItemData.height);
+    gridItem.setAttribute("data-offset-x", gridItemData.x);
+    gridItem.setAttribute("data-offset-y", gridItemData.y);
+  }
+  checkLayout(".grid", false);
+}
+
+// Test changing the number of auto-repeat tracks.
+setGridTemplate('grid1', 'none', 'repeat(auto-fill, 25px)');
+setGridTemplate('grid2', 'repeat(auto-fill, 25px)', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '25', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '25', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '25', height: '25', x: '25', y: '25' },
+  { id: 'i2-1', width: '25', height: '25', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '25', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '25', x: '25', y: '25' });
+
+setGridTemplate('grid1', 'none', 'none');
+setGridTemplate('grid2', 'none', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '25', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '25', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '25', height: '25', x: '0', y: '50' },
+  { id: 'i2-1', width: '25', height: '25', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '25', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '25', x: '50', y: '0' });
+
+setGridTemplate('grid1', 'none', '5px repeat(auto-fill, 20px)');
+setGridTemplate('grid2', 'repeat(auto-fill, 20px) 3px', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '5', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '5', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '20', height: '25', x: '5', y: '25' },
+  { id: 'i2-1', width: '25', height: '20', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '20', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '20', x: '25', y: '20' });
+
+setGridTemplate('grid1', 'none', '5px repeat(auto-fill, 22px)');
+setGridTemplate('grid2', 'repeat(auto-fill, 18px) 3px', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '5', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '5', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '22', height: '25', x: '5', y: '25' },
+  { id: 'i2-1', width: '25', height: '18', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '18', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '18', x: '25', y: '18' });
+
+setGridTemplate('grid1', 'none', 'repeat(auto-fill, 45px)');
+setGridTemplate('grid2', 'repeat(auto-fill, 45px)', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '45', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '45', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '45', height: '25', x: '0', y: '50' },
+  { id: 'i2-1', width: '25', height: '45', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '45', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '45', x: '50', y: '0' });
+
+// Test changing the size of the grid.
+setGridSize('grid1', '100px', 'auto');
+setGridSize('grid2', '100px', '100px');
+testGridDefinitions(
+  { id: 'i1-1', width: '45', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '45', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '45', height: '25', x: '45', y: '25' },
+  { id: 'i2-1', width: '25', height: '45', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '45', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '45', x: '25', y: '45' });
+
+// Move the third item so that there is an empty track between it and the others.
+setGridItemPlacement('i1-3', 'auto', '3');
+setGridItemPlacement('i2-3', '3', 'auto');
+testGridDefinitions(
+  { id: 'i1-1', width: '45', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '45', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '25', height: '25', x: '90', y: '25' },
+  { id: 'i2-1', width: '25', height: '45', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '45', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '25', x: '25', y: '90' });
+
+// Set the same templates, but using auto-fit instead of auto-fill. The empty track should collapse.
+setGridTemplate('grid1', 'none', 'repeat(auto-fit, 45px)');
+setGridTemplate('grid2', 'repeat(auto-fit, 45px)', 'none');
+testGridDefinitions(
+  { id: 'i1-1', width: '45', height: '25', x: '0', y: '25' },
+  { id: 'i1-2', width: '45', height: '25', x: '0', y: '0' },
+  { id: 'i1-3', width: '25', height: '25', x: '45', y: '25' },
+  { id: 'i2-1', width: '25', height: '45', x: '0', y: '0' },
+  { id: 'i2-2', width: '25', height: '45', x: '25', y: '0' },
+  { id: 'i2-3', width: '25', height: '25', x: '25', y: '45' });
+
+done();
+</script>
index 7e0710a..3716d9d 100644 (file)
@@ -23,6 +23,7 @@ List of files:
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-max-size-001.html
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-size-001.html
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-auto-repeat-min-size-002.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-fit-content-argument-001.html
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-inline-auto-repeat-001.html
 /LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-inline-support-flexible-lengths-001.html
index 7e2f5e6..b244766 100644 (file)
@@ -1,3 +1,23 @@
+2019-05-14  Oriol Brufau  <obrufau@igalia.com>
+
+        [css-grid] Update grid when changing auto repeat type
+        https://bugs.webkit.org/show_bug.cgi?id=197849
+
+        Reviewed by Javier Fernandez.
+
+        Test: imported/w3c/web-platform-tests/css/css-grid/grid-definition/grid-change-auto-repeat-tracks.html
+
+        This patch makes two 'repeat()' values for 'grid-template' be considered
+        to be different if one uses 'auto-fill' and the other 'auto-fit'.
+
+        Previously, they were considered to be equal if the repeated values
+        were the same, without comparing the repeat type. Therefore, the grid
+        was not updated when setting both values one after the other.
+
+        * css/CSSGridAutoRepeatValue.cpp:
+        (WebCore::CSSGridAutoRepeatValue::equals const):
+        * css/CSSGridAutoRepeatValue.h:
+
 2019-05-14  Antti Koivisto  <antti@apple.com>
 
         Event region computation should respect transforms
index d5bc449..773177f 100644 (file)
@@ -46,4 +46,9 @@ String CSSGridAutoRepeatValue::customCSSText() const
     return result.toString();
 }
 
+bool CSSGridAutoRepeatValue::equals(const CSSGridAutoRepeatValue& other) const
+{
+    return m_autoRepeatID == other.m_autoRepeatID && CSSValueList::equals(other);
+}
+
 } // namespace WebCore
index 774c81f..20780f4 100644 (file)
@@ -54,6 +54,8 @@ public:
     }
 
     String customCSSText() const;
+    bool equals(const CSSGridAutoRepeatValue&) const;
+
     CSSValueID autoRepeatID() const { return m_autoRepeatID; }
 
 private: