mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-18 23:12:02 +00:00
de7ca7b157
When restructuring inline nodes because of a block element insertion during the layout tree build, we might end up with a `display: contents` element in the ancestor stack that is not part of the actual layout tree, since it's never actually used as a parent for any node. Because we were only rewinding the ancestor stack with actual new layout nodes, it became corrupted and layout nodes were added to the wrong parent. This new logic leaves the ancestor stack intact, only replacing layout nodes whenever a new one is created. Fixes the sidebar on https://reddit.com. Fixes #3590.
47 lines
1.5 KiB
HTML
47 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<link rel="match" href="../expected/block-element-inside-inline-element-ref.html" />
|
|
</head>
|
|
<body>
|
|
<!-- Block at end of inline element -->
|
|
<b>foo<div>bar</div></b>
|
|
<!-- Block at beginning of inline element -->
|
|
<hr>
|
|
<b><div>foo</div>bar</b>
|
|
<!-- Block in middle of inline element -->
|
|
<hr>
|
|
<b>foo<div>bar</div>baz</b>
|
|
<!-- Block in middle of two inline elements -->
|
|
<hr>
|
|
<b>foo<i>bar<div>baz</div>lorem</i>ipsum</b>
|
|
<!-- Multiple subsequent blocks -->
|
|
<hr>
|
|
<b>foo<div>bar</div><div>baz</div>lorem</b>
|
|
<!-- Multiple subsequent blocks with inline element between them -->
|
|
<hr>
|
|
<b>foo<div>bar</div><u>baz</u><div>lorem</div>ipsum</b>
|
|
<!-- Block in inline element following inline element -->
|
|
<hr>
|
|
<div>foo<b><div>bar</div></b></div>
|
|
<!-- Dynamic tree mutation test -->
|
|
<hr>
|
|
<div id="target1"></div>
|
|
<script>
|
|
document.querySelector('#target1').innerHTML = '<b>foo<div>bar</div>baz</b>';
|
|
</script>
|
|
<!-- Dynamic style update -->
|
|
<hr>
|
|
<span id="target2" style="font-weight: bold">foo <div>bar</div></span>
|
|
<script>
|
|
window.addEventListener('DOMContentLoaded', () => {
|
|
document.body.offsetWidth; // force layout
|
|
const target2 = document.querySelector('#target2');
|
|
target2.setAttribute('style', null);
|
|
});
|
|
</script>
|
|
<!-- Block inside `display: contents` element -->
|
|
<hr>
|
|
<b>foo<div style="display: contents"><div>bar</div></div>baz</b>
|
|
</body>
|
|
</html>
|