Update CSS tests to revision 2baa72daab8bf37e3e910a9fd311a1eaa5b0f4a8

author: James Graham <james@hoppipolla.co.uk> 2015-07-27 17:47:31 +0100
committer: James Graham <james@hoppipolla.co.uk> 2015-07-27 17:47:31 +0100
commit: df03062d626f485dd896ce9c4374dfce447dc657 (patch)
tree: a96bdde06c6cd88dd68bc5ef4de8277fc6250a60 /tests/wpt/css-tests/css-flexbox-1_dev/html/reference
parent: 662c00a8109c49d4c57343156b774441f4f48640 (diff)
download: servo-df03062d626f485dd896ce9c4374dfce447dc657.tar.gz
servo-df03062d626f485dd896ce9c4374dfce447dc657.zip
17 files changed, 744 insertions, 45 deletions
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flex-container-margin-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flex-container-margin-ref.htm
deleted file mode 100644
index 56a313ef692..00000000000
--- a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flex-container-margin-ref.htm
+++ /dev/null
@@ -1,33 +0,0 @@
-<!DOCTYPE html>
-<html><head>
-<title>CSS Test: flex-container-margin-not-collapse-with-content-margin</title>
-<link href="http://www.github.com/sskyy" rel="author" title="houzhenyu">
-<style>
-    .flex-container{
-        display:block;
-        margin:20px;
-        background: #333;
-        line-height: 0px;
-    }
-    .flex-item{
-        display: inline-block;
-        width:50px;
-        height:50px;
-        margin:20px 20px;
-        background: #eee;
-    }
-    .flex-item.first{
-        margin-left:20px;
-    }
-    .flex-item.last{
-        margin-right: 20px;
-    }
-</style>
-</head>
-<body>
-    <div class="flex-container">
-        <div class="flex-item first"></div><div class="flex-item"></div><div class="flex-item last"></div>
-    </div>
-
-
-</body></html>
-\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-001-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-001-ref.htm
new file mode 100644
index 00000000000..6876c011344
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-001-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: ltr; */
+      /* Testcase has writing-mode: horizontal-tb; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-002-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-002-ref.htm
new file mode 100644
index 00000000000..840c6d12635
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-002-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: ltr; */
+      /* Testcase has writing-mode: vertical-rl; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-003-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-003-ref.htm
new file mode 100644
index 00000000000..a5bbe7f835a
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-003-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: ltr; */
+      /* Testcase has writing-mode: vertical-lr; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-004-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-004-ref.htm
new file mode 100644
index 00000000000..b4e0bce88fc
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-004-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: rtl; */
+      /* Testcase has writing-mode: horizontal-tb; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-005-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-005-ref.htm
new file mode 100644
index 00000000000..c47859bc125
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-005-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: rtl; */
+      /* Testcase has writing-mode: vertical-rl; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-006-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-006-ref.htm
new file mode 100644
index 00000000000..1980326188a
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-006-ref.htm
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+      /* Testcase has direction: rtl; */
+      /* Testcase has writing-mode: vertical-lr; */
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer"><!-- row wrap -->
+    <div class="item2"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item3"></div>
+  </div>
+  <div class="flexContainer"><!-- row wrap-reverse -->
+    <div class="item4"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap -->
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- row-reverse wrap-reverse -->
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+
+  <div class="flexContainer"><!-- column wrap -->
+    <div class="item3"></div><div class="item4"></div>
+    <div class="item1"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer"><!-- column wrap-reverse -->
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap -->
+    <div class="item4"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item1"></div>
+  </div>
+  <div class="flexContainer"><!-- column-reverse wrap-reverse -->
+    <div class="item2"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item3"></div>
+  </div>
+
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-007-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-007-ref.htm
new file mode 100644
index 00000000000..328f6053937
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-007-ref.htm
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item2"></div>
+    <div class="item3"></div><div class="item4"></div>
+  </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-008-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-008-ref.htm
new file mode 100644
index 00000000000..d6ea2201750
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-008-ref.htm
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item1"></div><div class="item3"></div>
+    <div class="item2"></div><div class="item4"></div>
+  </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-009-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-009-ref.htm
new file mode 100644
index 00000000000..fd53f223283
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/flexbox-writing-mode-009-ref.htm
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+--><html><head>
+  <title>CSS Reftest Reference</title>
+  <link href="mailto:dholbert@mozilla.com" rel="author" title="Daniel Holbert">
+  <meta charset="utf-8">
+  <style>
+    .flexContainer {
+      width: 40px;
+      height: 30px;
+      border: 1px solid gray;
+      margin-bottom: 5px;
+    }
+    .flexContainer > * {
+      width: 20px;
+      height: 15px;
+      float: left;
+    }
+    .item1 {
+      /* Note: flex items are ordered as "CMYK": cyan, magenta, yellow, black */
+      background: cyan;
+    }
+    .item2 {
+      background: magenta;
+    }
+    .item3 {
+      background: yellow;
+    }
+    .item4 {
+      background: black;
+    }
+  </style>
+</head>
+<body>
+  <div class="flexContainer">
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+  <div class="flexContainer">
+    <div class="item3"></div><div class="item1"></div>
+    <div class="item4"></div><div class="item2"></div>
+  </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-center-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-center-ref.htm
index 7be0d724035..e1ba92af993 100644
--- a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-center-ref.htm
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-center-ref.htm
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html><head>
-    <title>CSS Flexible Box Test: align-content proprety - center</title>
+    <title>CSS Flexible Box Test: align-content property - center</title>
     <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
     <style type="text/css">
         .container {
@@ -26,7 +26,7 @@
     </style>
 </head>
 <body>
-    <p>The test passed if you see a 2*2 table.</p>
+    <p>The test passed if you see a centered 2*2 table.</p>
     <div class="container">
       <span>first</span>
       <span>second</span>
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-end-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-end-ref.htm
index 065be45c30a..3ac12caf6b9 100644
--- a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-end-ref.htm
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-end-ref.htm
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html><head>
-    <title>CSS Flexible Box Test: align-content proprety - flex-end</title>
+    <title>CSS Flexible Box Test: align-content property - flex-end</title>
     <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
     <style type="text/css">
         .container {
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-space-between-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-space-between-ref.htm
new file mode 100644
index 00000000000..575e4e66ed2
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-space-between-ref.htm
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html><head>
+    <title>CSS Flexible Box Test: align-content property - space-between</title>
+    <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
+    <style type="text/css">
+        .container {
+        position: relative;
+        height: 14em;
+        width: 20em;
+        background: red;
+        margin: 1em;
+        border: 1px solid black;
+        }
+	.first, .second {
+	margin-bottom: 112px;
+	}
+        span {
+        height: 2em;
+        display: inline-block;
+        background: green;
+        color: white;
+        margin: 1em;
+        width: 8em;
+        float: left;
+        }
+    </style>
+</head>
+<body>
+    <p>The test passed if you see a 2*2 table and all the cells are spaced equally apart.</p>
+    <div class="container">
+      <span class="first">first</span>
+      <span class="second">second</span>
+      <span>third</span>
+      <span>forth</span>
+    </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-start-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-start-ref.htm
new file mode 100644
index 00000000000..e8434c65d8a
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-align-content-start-ref.htm
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html><head>
+    <title>CSS Flexible Box Test: align-content property - flex-start</title>
+    <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
+    <style type="text/css">
+        .container {
+	position: relative;
+	height: 14em;
+	width: 20em;
+	background: red;
+	margin: 1em;
+	border: 1px solid black;
+        }
+	span {
+	height: 2em;
+	display: inline-block;
+	background: green;
+	color: white;
+	margin: 1em;
+	width: 8em;
+	float: left;
+	}
+    </style>
+</head>
+<body>
+    <p>The test passed if you see a 2*2 table and all the cells are at the top of the container.</p>
+    <div class="container">
+      <span>first</span>
+      <span>second</span>
+      <span>third</span>
+      <span>forth</span>
+    </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-column-reverse-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-column-reverse-ref.htm
new file mode 100644
index 00000000000..1d807baa768
--- /dev/null
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-column-reverse-ref.htm
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<html><head>
+    <title>CSS Flexible Box Test: flex-direction proprety - column-reverse</title>
+    <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
+    <style type="text/css">
+        /* Positioned container allows for the self-describing statement to still 
+           be visible in the case of failure */
+        .container {
+	position: relative;
+	background: red;
+	margin: 1em 0;
+	border: 1px solid black;
+        }
+	span ~ span {
+	margin: 2em 1em 1em;
+	}
+	span {
+	display: block;
+	background: green;
+	color: white;
+	margin: 1em;
+	width: 8em;
+	}
+    </style>
+</head>
+<body>
+    <p>The test passed if you see all the cells are arraged vertically and reversed.</p>
+    <div class="container">
+      <span>forth</span>
+      <span>third</span>
+      <span>second</span>
+      <span>first</span>
+    </div>
+
+
+</body></html>
+\ No newline at end of file
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-row-reverse-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-row-reverse-ref.htm
index f77e64aa25a..d5c70cccceb 100644
--- a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-row-reverse-ref.htm
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-direction-row-reverse-ref.htm
@@ -6,7 +6,6 @@
         .container {
 	position: relative;
 	display: flex;
-	flex-direction: row-reverse;
 	background: red;
 	margin: 1em 0;
 	border: 1px solid black;
diff --git a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-inline-ref.htm b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-wrap-ref.htm
index 486357b487e..b43f36234a2 100644
--- a/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-inline-ref.htm
+++ b/tests/wpt/css-tests/css-flexbox-1_dev/html/reference/ttwf-reftest-flex-wrap-ref.htm
@@ -1,26 +1,35 @@
 <!DOCTYPE html>
 <html><head>
-    <title>CSS Flexible Box Test: display proprety - inline-flex</title>
+    <title>CSS Flexible Box Test: flex-wrap proprety - wrap</title>
     <link href="mailto:haosdent@gmail.com" rel="author" title="haosdent">
     <style type="text/css">
         /* Positioned container allows for the self-describing statement to still 
            be visible in the case of failure */
         .container {
 	position: relative;
+	background: red;
+	margin: 1em 0;
+	border: 1px solid black;
+	width: 20em;
+	height: 6.5em;
         }
-	.greenSquare {
+	span {
 	display: inline-block;
-	margin-top: -200px;
 	background: green;
-        }
+	color: white;
+	margin: 1em;
+	width: 8em;
+	float: left;
+	}
     </style>
 </head>
 <body>
-    <p>The test passed if you see a green block which its text is 'Success!
-'.</p>
+    <p>The test passed if you see a 2 * 2 table on the page.</p>
     <div class="container">
-      <!-- This is the square that should not be visible if the test passes -->
-      <div class="greenSquare">Success!</div>
+      <span>first</span>
+      <span>second</span>
+      <span>third</span>
+      <span>forth</span>
     </div>
author	James Graham <james@hoppipolla.co.uk>	2015-07-27 17:47:31 +0100
committer	James Graham <james@hoppipolla.co.uk>	2015-07-27 17:47:31 +0100
commit	df03062d626f485dd896ce9c4374dfce447dc657 (patch)
tree	a96bdde06c6cd88dd68bc5ef4de8277fc6250a60 /tests/wpt/css-tests/css-flexbox-1_dev/html/reference
parent	662c00a8109c49d4c57343156b774441f4f48640 (diff)
download	servo-df03062d626f485dd896ce9c4374dfce447dc657.tar.gz servo-df03062d626f485dd896ce9c4374dfce447dc657.zip