| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../resources/runner.js"></script> |
| <style> |
| div { color: grey } |
| .a:has(~ .b) { color: green } |
| </style> |
| </head> |
| <body> |
| <div id=container><div class=a></div></div> |
| <script> |
| |
| function makeTree(siblings) { |
| for (var i = 0; i < siblings; i++) { |
| var child = document.createElement("div"); |
| child.id = "child" + i; |
| container.appendChild(child); |
| } |
| } |
| |
| makeTree(2048); |
| container.offsetHeight; // force recalc style |
| |
| var runFunction = function() |
| { |
| child0.classList.toggle("b"); |
| container.offsetHeight; // force recalc style |
| child0.classList.toggle("b"); |
| container.offsetHeight; // force recalc style |
| |
| child2047.classList.toggle("b"); |
| container.offsetHeight; // force recalc style |
| child2047.classList.toggle("b"); |
| container.offsetHeight; // force recalc style |
| } |
| |
| PerfTestRunner.measureRunsPerSecond({ |
| description: "Measures performance of the '.a:has(~ .b)' invalidation with a single subject element.", |
| run: runFunction |
| }); |
| |
| </script> |
| </body> |
| </html> |
