119 lines
4.6 KiB
HTML
119 lines
4.6 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
|
<html>
|
|
<head>
|
|
<link href="resources/grid.css" rel="stylesheet">
|
|
<style>
|
|
.gridAutoFlowDense {
|
|
grid-auto-flow: dense;
|
|
}
|
|
.gridAutoFlowColumnDense {
|
|
grid-auto-flow: column dense;
|
|
}
|
|
.gridAutoFlowRowDense {
|
|
grid-auto-flow: row dense;
|
|
}
|
|
.gridAutoFlowDenseColumn {
|
|
grid-auto-flow: dense column;
|
|
}
|
|
.gridAutoFlowDenseRow {
|
|
grid-auto-flow: dense row;
|
|
}
|
|
.gridAutoFlowInherit {
|
|
grid-auto-flow: inherit;
|
|
}
|
|
/* Bad values. */
|
|
.gridAutoFlowNone {
|
|
grid-auto-flow: none;
|
|
}
|
|
.gridAutoFlowRows {
|
|
grid-auto-flow: rows;
|
|
}
|
|
.gridAutoFlowColumns {
|
|
grid-auto-flow: columns;
|
|
}
|
|
.gridAutoFlowColumnFoo {
|
|
grid-auto-flow: column foo;
|
|
}
|
|
.gridAutoFlowColumnColumn {
|
|
grid-auto-flow: column column;
|
|
}
|
|
.gridAutoFlowDenseRowRow {
|
|
grid-auto-flow: dense row row;
|
|
}
|
|
</style>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="grid" id="gridInitial"></div>
|
|
<div class="grid gridAutoFlowColumnSparse" id="gridAutoFlowColumnSparse"></div>
|
|
<div class="grid gridAutoFlowRowSparse" id="gridAutoFlowRowSparse"></div>
|
|
<div class="grid gridAutoFlowDense" id="gridAutoFlowDense"></div>
|
|
<div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnDense"></div>
|
|
<div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowDense"></div>
|
|
<div class="grid gridAutoFlowDenseColumn" id="gridAutoFlowDenseColumn"></div>
|
|
<div class="grid gridAutoFlowDenseRow" id="gridAutoFlowDenseRow"></div>
|
|
<div class="grid gridAutoFlowColumnSparse">
|
|
<div class="grid gridAutoFlowInherit" id="gridAutoFlowInherit"></div>
|
|
</div>
|
|
<div class="grid gridAutoFlowColumnSparse">
|
|
<div><div class="grid gridAutoFlowInherit" id="gridAutoFlowNoInherit"></div><div>
|
|
</div>
|
|
<div class="grid gridAutoFlowNone" id="gridAutoFlowNone"></div>
|
|
<div class="grid gridAutoFlowColumns" id="gridAutoFlowColumns"></div>
|
|
<div class="grid gridAutoFlowRows" id="gridAutoFlowRows"></div>
|
|
<div class="grid gridAutoFlowColumnFoo" id="gridAutoFlowColumnFoo"></div>
|
|
<div class="grid gridAutoFlowColumnColumn" id="gridAutoFlowColumnColumn"></div>
|
|
<div class="grid gridAutoFlowDenseRowRow" id="gridAutoFlowDenseRowRow"></div>
|
|
<script src="resources/grid-definitions-parsing-utils.js"></script>
|
|
<script>
|
|
description('Test that setting and getting grid-auto-flow works as expected');
|
|
|
|
debug("Test getting grid-auto-flow set through CSS");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowColumnSparse", "column");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowRowSparse", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowDense", "row dense");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowColumnDense", "column dense");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowRowDense", "row dense");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowDenseColumn", "column dense");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowDenseRow", "row dense");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowInherit", "column");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowNoInherit", "row");
|
|
|
|
debug("");
|
|
debug("Test getting grid-auto-flow bad values set through CSS");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowNone", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowColumns", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowRows", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowColumnFoo", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowColumnColumn", "row");
|
|
checkGridAutoFlowSetCSSValue("gridAutoFlowDenseRowRow", "row");
|
|
|
|
debug("");
|
|
debug("Test the initial value");
|
|
checkGridAutoFlowSetJSValue("", "", "row");
|
|
|
|
debug("");
|
|
debug("Test getting and setting grid-auto-flow through JS");
|
|
checkGridAutoFlowSetJSValue("column", "column", "column");
|
|
checkGridAutoFlowSetJSValue("column dense", "column dense", "column dense");
|
|
checkGridAutoFlowSetJSValue("dense", "dense", "row dense");
|
|
checkGridAutoFlowSetJSValue("row dense", "row dense", "row dense");
|
|
checkGridAutoFlowSetJSValue("dense column", "column dense", "column dense");
|
|
checkGridAutoFlowSetJSValue("dense row", "row dense", "row dense");
|
|
checkGridAutoFlowSetJSValue("row", "row", "row");
|
|
|
|
debug("");
|
|
debug("Test getting and setting bad values for grid-auto-flow through JS");
|
|
checkGridAutoFlowSetJSValue("noone", "", "row");
|
|
checkGridAutoFlowSetJSValue("column column", "", "row");
|
|
checkGridAutoFlowSetJSValue("dense row row", "", "row");
|
|
|
|
debug("");
|
|
debug("Test setting grid-auto-flow to 'initial' through JS");
|
|
// Reusing the value so that we can check that it is set back to its initial value.
|
|
checkGridAutoFlowSetJSValue("initial", "initial", "row");
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|