mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-04-30 11:37:16 +02:00
Tests: Import a bunch of WPT tests from /css/css-flexbox
This commit is contained in:
Andreas Kling
committed by
Andreas Kling
Andreas Kling
parent
0ebdac0b35
commit
abd24d001d
Notes:
github-actions[bot]
2024-10-30 09:18:21 +00:00
Author: https://github.com/awesomekling Commit: https://github.com/LadybirdBrowser/ladybird/commit/abd24d001df Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/2039
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-content: center</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-content: center;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-content"),
|
||||
"center");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-content: flex-end</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-content"),
|
||||
"flex-end");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-content: flex-start</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-content: flex-start;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-content"),
|
||||
"flex-start");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-content: space-around</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-content: space-around;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-content"),
|
||||
"space-around");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-content: space-between</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-content: space-between;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-content"),
|
||||
"space-between");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: baseline</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: baseline;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"baseline");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: center</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"center");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: flex-end</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: flex-end;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"flex-end");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: flex-start</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: flex-start;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"flex-start");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: invalid</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: filler;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"normal");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-items: stretch</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-items: stretch;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-items"),
|
||||
"stretch");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: baseline</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: baseline;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"baseline");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: center</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: center;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"center");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: flex-end</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: flex-end;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"flex-end");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: flex-start</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: flex-start;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"flex-start");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: invalid</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: filler;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | align-self: stretch</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
align-self: stretch;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("align-self"),
|
||||
"stretch");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | display: inline-flex</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("display"),
|
||||
"inline-flex");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | display: flex</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
display: flex;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("display"),
|
||||
"flex");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-basis: 0</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-basis-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-basis: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"0px");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-basis: 0%</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-basis-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-basis: 0%;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"0%");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-basis: auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-basis-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-basis: auto;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,27 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-basis: percent</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-basis-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
html {
|
||||
display: flex;
|
||||
width: 100px;
|
||||
}
|
||||
body {
|
||||
color: red;
|
||||
margin: 0;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"100%");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-direction: column-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-direction: column</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-direction: row</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-direction: filler;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-direction: row-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-direction: row</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-direction: row;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-nowrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column-reverse nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column-reverse">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-nowrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column-reverse nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column-reverse wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column-reverse">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column-reverse wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column-reverse">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column wrap-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap-reverse">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column wrap-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: column</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-column">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: column;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"column");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-nowrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-nowrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row-reverse nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row-reverse">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-nowrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row-reverse nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row-reverse wrap-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row-reverse">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap-reverse">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row-reverse wrap-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row-reverse wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row-reverse">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row-reverse wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row-reverse">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row-reverse");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row wrap-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap-reverse">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row wrap-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: row</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-direction-row">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: row;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-flow: wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-flow-property">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-flex-wrap-wrap">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-flow: wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-direction"),
|
||||
"row");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-grow: 0</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-grow-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-grow: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-grow: negative</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-grow-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-grow: -1;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-grow: number</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-grow-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-grow: 666;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"666");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: 0 auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: initial;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: auto;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: initial</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: initial;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: invalid</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: 0 1 1;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: none;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"0");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"0");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: number</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: 666;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"666");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"0%");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex: invalid</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex: 666 666 666px;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-grow"),
|
||||
"666");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"666");
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-basis"),
|
||||
"666px");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-shrink: 0</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-shrink-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"0");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-shrink: negative</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-shrink-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-shrink: -1;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"1");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-shrink: number</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-shrink-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-shrink: 666;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-shrink"),
|
||||
"666");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-wrap: wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-wrap-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-wrap: filler;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-wrap: nowrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-wrap-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"nowrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-wrap: wrap-reverse</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-wrap-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap-reverse");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | flex-wrap: wrap</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-wrap-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("flex-wrap"),
|
||||
"wrap");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | justify-content: center</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("justify-content"),
|
||||
"center");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | justify-content: flex-end</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("justify-content"),
|
||||
"flex-end");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | justify-content: flex-start</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("justify-content"),
|
||||
"flex-start");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | justify-content: space-around</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
justify-content: space-around;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("justify-content"),
|
||||
"space-around");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | justify-content: space-between</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#justify-content-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
justify-content: space-between;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("justify-content"),
|
||||
"space-between");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<title>CSS Flexible Box Test: computed style for auto minimum size</title>
|
||||
<link rel="author" title="Rune Lillesveen" href="mailto:futhark@chromium.org" />
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#min-size-auto" />
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
.flex { display: flex }
|
||||
.none { display: none }
|
||||
.min-wh {
|
||||
min-width: auto;
|
||||
min-height: auto;
|
||||
}
|
||||
.contents { display: contents }
|
||||
</style>
|
||||
<div class="flex">
|
||||
<div class="min-wh"></div>
|
||||
</div>
|
||||
<div class="none">
|
||||
<div class="flex">
|
||||
<div class="min-wh"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="contents">
|
||||
<div class="min-wh"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<div class="min-wh none"></div>
|
||||
</div>
|
||||
<script>
|
||||
const tests = [
|
||||
{ description: "Computed min-width/min-height of specified auto for flex item.", computed: "auto" },
|
||||
{ description: "Computed min-width/min-height of specified auto inside display:none which would otherwise have been a flex item.", computed: "0px" },
|
||||
{ description: "Computed min-width/min-height of specified auto for flex item inside display:contents.", computed: "auto" },
|
||||
{ description: "Computed min-width/min-height of specified auto with display:none which would otherwise have been a flex item.", computed: "0px" }
|
||||
];
|
||||
|
||||
const testElements = document.querySelectorAll(".min-wh");
|
||||
let testNo = 0;
|
||||
for (let testElement of testElements) {
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(testElement).minWidth, tests[testNo].computed);
|
||||
assert_equals(getComputedStyle(testElement).minHeight, tests[testNo].computed);
|
||||
}, tests[testNo].description);
|
||||
testNo++;
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | min-height: auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
html {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
body {
|
||||
color: red;
|
||||
min-height: auto;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("min-height"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | min-width: auto</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
html {
|
||||
display: flex;
|
||||
}
|
||||
body {
|
||||
color: red;
|
||||
min-width: auto;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("min-width"),
|
||||
"auto");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,25 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | order: -1</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
html {
|
||||
order: 666;
|
||||
}
|
||||
body {
|
||||
color: red;
|
||||
order: inherit;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("order"),
|
||||
"666");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | order: integer</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
order: 5;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("order"),
|
||||
"5");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | order: noninteger</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
order: 1.5;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("order"),
|
||||
"0");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | order: -1</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
order: -1;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("order"),
|
||||
"-1");
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,22 @@
|
||||
<!DOCTYPE html>
|
||||
<title>flexbox | computed style | order: 0</title>
|
||||
<link rel="author" href="http://opera.com" title="Opera Software">
|
||||
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
|
||||
<script src="../../../resources/testharness.js"></script>
|
||||
<script src="../../../resources/testharnessreport.js"></script>
|
||||
<meta name="flags" content="dom">
|
||||
<style>
|
||||
body {
|
||||
color: red;
|
||||
order: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="log"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
var body = document.body;
|
||||
|
||||
assert_equals(getComputedStyle(body).getPropertyValue("order"),
|
||||
"0");
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user