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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html

Issue 1160273004: [CSS Grid Layout] Support dots sequences in grid-template-areas (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Rebased patch Created 5 years, 6 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-template-areas-get-set-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html
diff --git a/LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html b/LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html
index ab89756add5118fb62e4ad91ce0600d49d0ee4e1..d2ca1da704b6daf5dd3489a48a14755e8ce9ddc6 100644
--- a/LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html
+++ b/LayoutTests/fast/css-grid-layout/grid-template-areas-get-set.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<!DOCTYPE html>
<html>
<head>
<link href="resources/grid.css" rel="stylesheet">
@@ -25,11 +25,56 @@
".";
}
+#gridWithSpanningRowsDotsTemplate {
+ grid-template-areas: "span"
+ "....";
+}
+
#gridWithDotColumn {
grid-template-areas: "header ."
"footer .";
}
+#gridWithDotsColumn {
+ grid-template-areas: "header ......"
+ "footer ......";
+}
+
+#gridWithDotCells {
+ grid-template-areas: "first ."
+ ". second";
+}
+
+#gridWithDotsCells {
+ grid-template-areas: "first ......"
+ "..... second";
+}
+
+#gridWithComplexDotAreas {
+ grid-template-areas: ". header header ."
+ ". . . ."
+ "nav main main aside"
+ "nav main main aside"
+ ". . . aside"
+ ". footer footer aside";
+}
+
+#gridWithComplexDotsAreas {
+ grid-template-areas: "... header header ....."
+ "... ...... ...... ....."
+ "nav main main aside"
+ "nav main main aside"
+ "... ...... ...... aside"
+ "... footer footer aside";
+}
+
+#gridWithMixedDotAndDotsAreas {
+ grid-template-areas: "... title ."
+ ".. main main"
+ "nav ................... aside"
+ ". footer ......";
+}
+
#gridWithHorizontalRectangle {
grid-template-areas: "a a a"
"a a a";
@@ -51,7 +96,14 @@
<div class="grid" id="gridWithTwoRowsTemplate"></div>
<div class="grid" id="gridWithSpanningColumnsTemplate"></div>
<div class="grid" id="gridWithSpanningRowsDotTemplate"></div>
+<div class="grid" id="gridWithSpanningRowsDotsTemplate"></div>
<div class="grid" id="gridWithDotColumn"></div>
+<div class="grid" id="gridWithDotsColumn"></div>
+<div class="grid" id="gridWithDotCells"></div>
+<div class="grid" id="gridWithDotsCells"></div>
+<div class="grid" id="gridWithComplexDotAreas"></div>
+<div class="grid" id="gridWithComplexDotsAreas"></div>
+<div class="grid" id="gridWithMixedDotAndDotsAreas"></div>
<div class="grid" id="gridWithHorizontalRectangle"></div>
<div class="grid" id="gridWithVerticalRectangle"></div>
<script>
@@ -76,9 +128,30 @@
var gridWithSpanningRowsDotTemplate = document.getElementById("gridWithSpanningRowsDotTemplate");
shouldBeEqualToString("window.getComputedStyle(gridWithSpanningRowsDotTemplate).getPropertyValue('grid-template-areas')", '"span" "."')
+ var gridWithSpanningRowsDotsTemplate = document.getElementById("gridWithSpanningRowsDotsTemplate");
+ shouldBeEqualToString("window.getComputedStyle(gridWithSpanningRowsDotsTemplate).getPropertyValue('grid-template-areas')", '"span" "."')
+
var gridWithDotColumn = document.getElementById("gridWithDotColumn");
shouldBeEqualToString("window.getComputedStyle(gridWithDotColumn).getPropertyValue('grid-template-areas')", '"header ." "footer ."')
+ var gridWithDotsColumn = document.getElementById("gridWithDotsColumn");
+ shouldBeEqualToString("window.getComputedStyle(gridWithDotsColumn).getPropertyValue('grid-template-areas')", '"header ." "footer ."')
+
+ var gridWithDotCells = document.getElementById("gridWithDotCells");
+ shouldBeEqualToString("window.getComputedStyle(gridWithDotCells).getPropertyValue('grid-template-areas')", '"first ." ". second"')
+
+ var gridWithDotsCells = document.getElementById("gridWithDotsCells");
+ shouldBeEqualToString("window.getComputedStyle(gridWithDotsCells).getPropertyValue('grid-template-areas')", '"first ." ". second"')
+
+ var gridWithComplexDotAreas = document.getElementById("gridWithComplexDotAreas");
+ shouldBeEqualToString("window.getComputedStyle(gridWithComplexDotAreas).getPropertyValue('grid-template-areas')", '". header header ." ". . . ." "nav main main aside" "nav main main aside" ". . . aside" ". footer footer aside"')
+
+ var gridWithComplexDotsAreas = document.getElementById("gridWithComplexDotsAreas");
+ shouldBeEqualToString("window.getComputedStyle(gridWithComplexDotsAreas).getPropertyValue('grid-template-areas')", '". header header ." ". . . ." "nav main main aside" "nav main main aside" ". . . aside" ". footer footer aside"')
+
+ var gridWithMixedDotAndDotsAreas = document.getElementById("gridWithMixedDotAndDotsAreas");
+ shouldBeEqualToString("window.getComputedStyle(gridWithMixedDotAndDotsAreas).getPropertyValue('grid-template-areas')", '". title ." ". main main" "nav . aside" ". footer ."')
+
var gridWithHorizontalRectangle = document.getElementById("gridWithHorizontalRectangle");
shouldBeEqualToString("window.getComputedStyle(gridWithHorizontalRectangle).getPropertyValue('grid-template-areas')", '"a a a" "a a a"');
« no previous file with comments | « no previous file | LayoutTests/fast/css-grid-layout/grid-template-areas-get-set-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698