[css-flexbox] Migrate bug669714.html test from css3/flexbox to WPT
Migrate this test out of third_party/blink/web_tests/css3/flexbox
and into the WPT-specific directory, adding links to the relevant
specs and a test assertion describing its purpose.
Also, rename its filename to something more descriptive and less
Chromium-specific (it currently references crbug.com/669714).
Bug: 1063749
Change-Id: I1bed056c043df7322f1c9b2655b616d7217fb798
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2127035
Reviewed-by: Robert Ma <robertma@chromium.org>
Reviewed-by: Christian Biesinger <cbiesinger@chromium.org>
Commit-Queue: Mario Sanchez Prada <mario@igalia.com>
Cr-Commit-Position: refs/heads/master@{#754864}
diff --git a/third_party/blink/web_tests/css3/flexbox/bug669714.html b/third_party/blink/web_tests/css3/flexbox/bug669714.html
deleted file mode 100644
index 243a964..0000000
--- a/third_party/blink/web_tests/css3/flexbox/bug669714.html
+++ /dev/null
@@ -1,34 +0,0 @@
-<!DOCTYPE html>
-
-<style>
-html { line-height: 1; font-size: 18px; }
-#relpos { position: relative; top: 1px; }
-.flex { flex: 1; }
-.flex { min-height: 0; }
-.layout, .layout-column, .layout-row { display: flex; }
-.layout-column { flex-direction: column; }
-</style>
-
-<script src="../../resources/testharness.js"></script>
-<script src="../../resources/testharnessreport.js"></script>
-<script src="../../resources/check-layout-th.js"></script>
-
-<script>
-function update() {
- document.body.offsetHeight;
- document.getElementById("relpos").innerText = " ";
- checkLayout("#container");
-}
-</script>
-
-<body onload="update();">
-<p>XXX and YYY should be on separate lines and not overlap, i.e. the height of
-.flex should not be 0.</p>
-<div class="layout-column" id="container">
- <div class="layout-row">
- <div class="layout-column">
- <div class="flex" data-expected-height="18">XXX<span id="relpos"></span></div>
- <div>YYY</div>
- </div>
- </div>
-</div>
diff --git a/third_party/blink/web_tests/external/wpt/css/css-flexbox/flex-direction-column-overlap-001.html b/third_party/blink/web_tests/external/wpt/css/css-flexbox/flex-direction-column-overlap-001.html
new file mode 100644
index 0000000..4d483a4
--- /dev/null
+++ b/third_party/blink/web_tests/external/wpt/css/css-flexbox/flex-direction-column-overlap-001.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html>
+<title>CSS Flexbox: vertical overlap with flex-direction: column.</title>
+<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-direction-property">
+<link rel="help" href="https://crbug.com/669714"/>
+<meta name="assert" content="This test ensures that no unnecessary vertical overlap happens between an inline flex item and a block element inside a nested flexbox with 'flex-direction: column'."/>
+
+<style>
+html {
+ line-height: 1;
+ font-size: 18px;
+}
+
+.flex {
+ flex: 1;
+ min-height: 0;
+}
+
+.layout-column, .layout-row {
+ display: flex;
+}
+
+.layout-column {
+ flex-direction: column;
+}
+
+#relpos {
+ position: relative;
+ top: 1px;
+}
+</style>
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+
+<body>
+
+<p>XXX and YYY should be on separate lines and not overlap, i.e. the height of .flex should not be 0.</p>
+
+<div class="layout-column" id="container">
+ <div class="layout-row">
+ <div class="layout-column">
+ <div class="flex" data-expected-height="18">XXX<span id="relpos"></span></div>
+ <div>YYY</div>
+ </div>
+ </div>
+</div>
+
+<script>
+document.body.offsetHeight;
+document.getElementById("relpos").innerText = " ";
+checkLayout("#container");
+</script>
+</body>
+</html>
