<!DOCTYPE html>
<head>
<link href="resources/grid.css" rel="stylesheet">
<style>
.grid {
grid-auto-rows: minmax(min-content, 9px);
grid-auto-columns: min-content;
height: 10px;
}
.firstRowFirstColumn {
font: 10px/1 Ahem;
}
</style>
<script src="../../resources/js-test.js"></script>
<script type="text/javascript">
if (window.testRunner)
testRunner.dumpAsText();
document.addEventListener("DOMContentLoaded", crash, false);
function crash() {
var grid = document.getElementById("grid");
shouldBeEqualToString("window.getComputedStyle(grid, '').getPropertyValue('grid-template-rows')", "10px");
var child = document.createElement("div");
child.className = "firstRowFirstColumn";
child.innerHTML = "XXXX XXXX";
grid.appendChild(child);
shouldBeEqualToString("window.getComputedStyle(grid, '').getPropertyValue('grid-template-rows')", "20px");
}
</script>
</head>
<body>
<p>The test has passed if it does not CRASH in Debug builds.</p>
<div class="grid" id="grid">
<div class="firstRowFirstColumn">XXXX</div>
</div>
</body>