Bug 1215182 - Reftests.
authorMats Palmgren <mats@mozilla.com>
Tue, 03 Nov 2015 21:45:32 +0100
changeset 271054 dc90c209ea61a36257b508e0b90d95ed109ed894
parent 271053 7b8f601030db44c1f6d8c16889a6ec599efeb97a
child 271055 bb0e04a7ab198ecc69b03251f2261cc12767aada
push id29631
push usercbook@mozilla.com
push dateWed, 04 Nov 2015 11:00:16 +0000
treeherdermozilla-central@6077f51254c6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
bugs1215182
milestone45.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1215182 - Reftests.
layout/reftests/css-grid/grid-placement-implicit-named-areas-001-ref.html
layout/reftests/css-grid/grid-placement-implicit-named-areas-001.html
layout/reftests/css-grid/reftest.list
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-grid/grid-placement-implicit-named-areas-001-ref.html
@@ -0,0 +1,157 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>Reference: implicit named areas</title>
+  <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1215182">
+  <style type="text/css">
+div {
+  display: grid;
+  grid-auto-columns: 3px;
+  grid-auto-rows: 3px;
+  border: 1px solid;
+  float: left;
+  width: 100px;
+  margin: 2px;
+  align-items: stretch;
+  justify-items: stretch;
+  align-content: start;
+  justify-content: start;
+}
+.row-tests div {
+  height: 100px;
+}
+span { background:lime; grid-column:A/B; grid-row:A/B; }
+
+.col-valid { grid-template-columns:[A] 40px [] 40px [B]; }
+.row-valid { grid-template-rows:   [A] 40px [] 40px [B]; }
+
+.col-start-1 { grid-template-columns:[A] 40px [] 40px; }
+.row-start-1 { grid-template-rows:   [A] 40px [] 40px; }
+
+.col-end-1 { grid-template-columns:[B] 40px [] 40px; }
+.row-end-1 { grid-template-rows:   [B] 40px [] 40px; }
+
+.col-start { grid-template-columns: 40px [A] 40px []; }
+.row-start { grid-template-rows:    40px [A] 40px []; }
+
+.col-end { grid-template-columns:40px [B] 40px; }
+.row-end { grid-template-rows:   40px [B] 40px; }
+
+.col-end-start { grid-template-columns:[B] 40px [A] 40px; }
+.row-end-start { grid-template-rows:   [B] 40px [A] 40px; }
+
+.col-start-end-start { grid-template-columns:[A] 40px [B] 40px [A] 40px; }
+.row-start-end-start { grid-template-rows:   [A] 40px [B] 40px [A] 40px; }
+
+.col-start-start-end { grid-template-columns:[A] 40px [A] 40px [B] 40px; }
+.row-start-start-end { grid-template-rows:   [A] 40px [A] 40px [B] 40px; }
+
+.col-start-end-end { grid-template-columns:[A] 40px [B] 40px [B]; }
+.row-start-end-end { grid-template-rows:   [A] 40px [B] 40px [B]; }
+
+.col-start-last { grid-template-columns: 40px [] 40px [A]; }
+.row-start-last { grid-template-rows:    40px [] 40px [A]; }
+
+.col-same-1 { grid-template-columns:[B A] 40px [] 40px; }
+.row-same-1 { grid-template-rows:   [B A] 40px [] 40px; }
+
+.col-same-2 { grid-template-columns:40px [B A] 40px; }
+.row-same-2 { grid-template-rows:   40px [B A] 40px; }
+
+.col-same-2b { grid-template-columns:40px [A B] 40px; }
+.row-same-2b { grid-template-rows:   40px [A B] 40px; }
+
+.col-same-3 { grid-template-columns:40px [] 40px [B A]; }
+.row-same-3 { grid-template-rows:   40px [] 40px [B A]; }
+    </style>
+</head>
+<body>
+
+<div class="col-valid"><span></span></div>
+<div class="col-start-1"><span></span></div>
+<div class="col-end-1"><span></span></div>
+<div class="col-start"><span></span></div>
+<div class="col-end"><span></span></div>
+<div class="col-end-start"><span></span></div>
+<div class="col-start-end-start"><span></span></div>
+
+<br clear="all">
+
+<div class="col-valid row-valid"><span></span></div>
+<div class="col-start-1 row-valid"><span></span></div>
+<div class="col-end-1 row-valid"><span></span></div>
+<div class="col-start row-valid"><span></span></div>
+<div class="col-end row-valid"><span></span></div>
+<div class="col-end-start row-valid"><span></span></div>
+<div class="col-start-end-start row-valid"><span></span></div>
+
+<br clear="all">
+
+<div class="col-start-start-end"><span></span></div>
+<div class="col-start-end-end"><span></span></div>
+<div class="col-start-last"><span></span></div>
+<div class="col-same-1"><span></span></div>
+<div class="col-same-2"><span></span></div>
+<div class="col-same-2b"><span></span></div>
+<div class="col-same-3"><span></span></div>
+
+<br clear="all">
+
+<div class="col-start-start-end row-valid"><span></span></div>
+<div class="col-start-end-end row-valid"><span></span></div>
+<div class="col-start-last row-valid"><span></span></div>
+<div class="col-same-1 row-valid"><span></span></div>
+<div class="col-same-2 row-valid"><span></span></div>
+<div class="col-same-2b row-valid"><span></span></div>
+<div class="col-same-3 row-valid"><span></span></div>
+
+<br clear="all">
+
+<x class="row-tests">
+
+<div class="row-valid"><span></span></div>
+<div class="row-start-1"><span></span></div>
+<div class="row-end-1"><span></span></div>
+<div class="row-start"><span></span></div>
+<div class="row-end"><span></span></div>
+<div class="row-end-start"><span></span></div>
+<div class="row-start-end-start"><span></span></div>
+
+<br clear="all">
+
+<div class="row-valid col-valid"><span></span></div>
+<div class="row-start-1 col-valid"><span></span></div>
+<div class="row-end-1 col-valid"><span></span></div>
+<div class="row-start col-valid"><span></span></div>
+<div class="row-end col-valid"><span></span></div>
+<div class="row-end-start col-valid"><span></span></div>
+<div class="row-start-end-start col-valid"><span></span></div>
+
+<br clear="all">
+
+<div class="row-start-start-end"><span></span></div>
+<div class="row-start-end-end"><span></span></div>
+<div class="row-start-last"><span></span></div>
+<div class="row-same-1"><span></span></div>
+<div class="row-same-2"><span></span></div>
+<div class="row-same-2b"><span></span></div>
+<div class="row-same-3"><span></span></div>
+
+<br clear="all">
+
+<div class="row-start-start-end col-valid"><span></span></div>
+<div class="row-start-end-end col-valid"><span></span></div>
+<div class="row-start-last col-valid"><span></span></div>
+<div class="row-same-1 col-valid"><span></span></div>
+<div class="row-same-2 col-valid"><span></span></div>
+<div class="row-same-2b col-valid"><span></span></div>
+<div class="row-same-3 col-valid"><span></span></div>
+
+</x>
+
+</body>
+</html>
new file mode 100644
--- /dev/null
+++ b/layout/reftests/css-grid/grid-placement-implicit-named-areas-001.html
@@ -0,0 +1,159 @@
+<!DOCTYPE HTML>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html><head>
+  <meta charset="utf-8">
+  <title>CSS Grid Test: implicit named areas</title>
+  <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1215182">
+  <link rel="help" href="http://dev.w3.org/csswg/css-grid/#grid-placement-slot">
+  <link rel="match" href="grid-placement-implicit-named-areas-001-ref.html">
+  <style type="text/css">
+div {
+  display: grid;
+  grid-auto-columns: 3px;
+  grid-auto-rows: 3px;
+  border: 1px solid;
+  float: left;
+  width: 100px;
+  margin: 2px;
+  align-items: stretch;
+  justify-items: stretch;
+  align-content: start;
+  justify-content: start;
+}
+.row-tests div {
+  height: 100px;
+}
+span { background:lime; grid-column:A; grid-row:A; }
+
+.col-valid { grid-template-columns:[A-start] 40px [] 40px [A-end]; }
+.row-valid { grid-template-rows:   [A-start] 40px [] 40px [A-end]; }
+
+.col-start-1 { grid-template-columns:[A-start] 40px [] 40px; }
+.row-start-1 { grid-template-rows:   [A-start] 40px [] 40px; }
+
+.col-end-1 { grid-template-columns:[A-end] 40px [] 40px; }
+.row-end-1 { grid-template-rows:   [A-end] 40px [] 40px; }
+
+.col-start { grid-template-columns: 40px [A-start] 40px []; }
+.row-start { grid-template-rows:    40px [A-start] 40px []; }
+
+.col-end { grid-template-columns:40px [A-end] 40px; }
+.row-end { grid-template-rows:   40px [A-end] 40px; }
+
+.col-end-start { grid-template-columns:[A-end] 40px [A-start] 40px; }
+.row-end-start { grid-template-rows:   [A-end] 40px [A-start] 40px; }
+
+.col-start-end-start { grid-template-columns:[A-start] 40px [A-end] 40px [A-start] 40px; }
+.row-start-end-start { grid-template-rows:   [A-start] 40px [A-end] 40px [A-start] 40px; }
+
+.col-start-start-end { grid-template-columns:[A-start] 40px [A-start] 40px [A-end] 40px; }
+.row-start-start-end { grid-template-rows:   [A-start] 40px [A-start] 40px [A-end] 40px; }
+
+.col-start-end-end { grid-template-columns:[A-start] 40px [A-end] 40px [A-end]; }
+.row-start-end-end { grid-template-rows:   [A-start] 40px [A-end] 40px [A-end]; }
+
+.col-start-last { grid-template-columns: 40px [] 40px [A-start]; }
+.row-start-last { grid-template-rows:    40px [] 40px [A-start]; }
+
+.col-same-1 { grid-template-columns:[A-end A-start] 40px [] 40px; }
+.row-same-1 { grid-template-rows:   [A-end A-start] 40px [] 40px; }
+
+.col-same-2 { grid-template-columns:40px [A-end A-start] 40px; }
+.row-same-2 { grid-template-rows:   40px [A-end A-start] 40px; }
+
+.col-same-2b { grid-template-columns:40px [A-start A-end] 40px; }
+.row-same-2b { grid-template-rows:   40px [A-start A-end] 40px; }
+
+.col-same-3 { grid-template-columns:40px [] 40px [A-end A-start]; }
+.row-same-3 { grid-template-rows:   40px [] 40px [A-end A-start]; }
+    </style>
+</head>
+<body>
+
+<div class="col-valid"><span></span></div>
+<div class="col-start-1"><span></span></div>
+<div class="col-end-1"><span></span></div>
+<div class="col-start"><span></span></div>
+<div class="col-end"><span></span></div>
+<div class="col-end-start"><span></span></div>
+<div class="col-start-end-start"><span></span></div>
+
+<br clear="all">
+
+<div class="col-valid row-valid"><span></span></div>
+<div class="col-start-1 row-valid"><span></span></div>
+<div class="col-end-1 row-valid"><span></span></div>
+<div class="col-start row-valid"><span></span></div>
+<div class="col-end row-valid"><span></span></div>
+<div class="col-end-start row-valid"><span></span></div>
+<div class="col-start-end-start row-valid"><span></span></div>
+
+<br clear="all">
+
+<div class="col-start-start-end"><span></span></div>
+<div class="col-start-end-end"><span></span></div>
+<div class="col-start-last"><span></span></div>
+<div class="col-same-1"><span></span></div>
+<div class="col-same-2"><span></span></div>
+<div class="col-same-2b"><span></span></div>
+<div class="col-same-3"><span></span></div>
+
+<br clear="all">
+
+<div class="col-start-start-end row-valid"><span></span></div>
+<div class="col-start-end-end row-valid"><span></span></div>
+<div class="col-start-last row-valid"><span></span></div>
+<div class="col-same-1 row-valid"><span></span></div>
+<div class="col-same-2 row-valid"><span></span></div>
+<div class="col-same-2b row-valid"><span></span></div>
+<div class="col-same-3 row-valid"><span></span></div>
+
+<br clear="all">
+
+<x class="row-tests">
+
+<div class="row-valid"><span></span></div>
+<div class="row-start-1"><span></span></div>
+<div class="row-end-1"><span></span></div>
+<div class="row-start"><span></span></div>
+<div class="row-end"><span></span></div>
+<div class="row-end-start"><span></span></div>
+<div class="row-start-end-start"><span></span></div>
+
+<br clear="all">
+
+<div class="row-valid col-valid"><span></span></div>
+<div class="row-start-1 col-valid"><span></span></div>
+<div class="row-end-1 col-valid"><span></span></div>
+<div class="row-start col-valid"><span></span></div>
+<div class="row-end col-valid"><span></span></div>
+<div class="row-end-start col-valid"><span></span></div>
+<div class="row-start-end-start col-valid"><span></span></div>
+
+<br clear="all">
+
+<div class="row-start-start-end"><span></span></div>
+<div class="row-start-end-end"><span></span></div>
+<div class="row-start-last"><span></span></div>
+<div class="row-same-1"><span></span></div>
+<div class="row-same-2"><span></span></div>
+<div class="row-same-2b"><span></span></div>
+<div class="row-same-3"><span></span></div>
+
+<br clear="all">
+
+<div class="row-start-start-end col-valid"><span></span></div>
+<div class="row-start-end-end col-valid"><span></span></div>
+<div class="row-start-last col-valid"><span></span></div>
+<div class="row-same-1 col-valid"><span></span></div>
+<div class="row-same-2 col-valid"><span></span></div>
+<div class="row-same-2b col-valid"><span></span></div>
+<div class="row-same-3 col-valid"><span></span></div>
+
+</x>
+
+</body>
+</html>
--- a/layout/reftests/css-grid/reftest.list
+++ b/layout/reftests/css-grid/reftest.list
@@ -5,16 +5,17 @@ fails == grid-whitespace-handling-1b.xht
 == grid-whitespace-handling-2.xhtml  grid-whitespace-handling-2-ref.xhtml
 == grid-placement-definite-001.html grid-placement-definite-001-ref.html
 == grid-placement-definite-002.html grid-placement-definite-002-ref.html
 == grid-placement-definite-003.html grid-placement-definite-003-ref.html
 == grid-placement-auto-row-sparse-001.html grid-placement-auto-row-sparse-001-ref.html
 == grid-placement-auto-row-dense-001.html grid-placement-auto-row-dense-001-ref.html
 == grid-placement-auto-col-sparse-001.html grid-placement-auto-col-sparse-001-ref.html
 == grid-placement-auto-col-dense-001.html grid-placement-auto-col-dense-001-ref.html
+== grid-placement-implicit-named-areas-001.html grid-placement-implicit-named-areas-001-ref.html
 == grid-track-sizing-001.html grid-track-sizing-001-ref.html
 == grid-abspos-items-001.html grid-abspos-items-001-ref.html
 == grid-abspos-items-002.html grid-abspos-items-002-ref.html
 == grid-abspos-items-003.html grid-abspos-items-003-ref.html
 == grid-abspos-items-004.html grid-abspos-items-004-ref.html
 == grid-abspos-items-005.html grid-abspos-items-005-ref.html
 == grid-abspos-items-006.html grid-abspos-items-006-ref.html
 == grid-abspos-items-007.html grid-abspos-items-007-ref.html