| <!DOCTYPE html> |
| <script src="../../resources/runner.js"></script> |
| <style> |
| #target div { display:table; } |
| #target span { display:block; break-inside:avoid; height:2em; } |
| </style> |
| <pre id="log"></pre> |
| <!-- We only want to measure layout performance, so try to avoid irrelevant things, such as painting. --> |
| <div style="overflow:hidden; width:0; height:0;"> |
| <div id="target" style="columns:3; column-fill:auto; width:40em; height:13em; line-height:2em;"> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| <div> |
| <span></span> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| <script> |
| var target = document.getElementById("target"); |
| var style = target.style; |
| |
| function test() { |
| style.width = "41em"; |
| PerfTestRunner.forceLayout(); |
| style.width = "40em"; |
| PerfTestRunner.forceLayout(); |
| } |
| |
| PerfTestRunner.measureRunsPerSecond({ |
| description: "Measures performance of multicol layout in deeply nested tables.", |
| run: test |
| }); |
| </script> |
