Skip to content
Permalink
Browse files
Don't detach whitespace nodes when the previous sibling is an out of …
…flow block

Don't detach whitespace nodes when the previous sibling is an out of flow block
https://bugs.webkit.org/show_bug.cgi?id=247683

Reviewed by Alan Baradlay.

Merge - https://src.chromium.org/viewvc/blink?revision=195585&view=revision

A whitespace node was not being rendered after an out of flow block element was
inserted in front of it and the container was an inline element. Normally a
block element would cause the whitespace node to be detached as it should no
longer be rendered since the block element creates a new line. This doesn't
matter though if the block element is out of the normal flow of the document.
Now we correctly verify that the inserted block element is in the normal flow
the document before deciding if no renderer is needed.

* Source/WebCore/rendering/updating/RenderTreeUpdater.cpp:
(RenderTreeUpdater::textRendererIsNeeded): Add "isOutOfFlowPositioned" condition
* LayoutTests/fast/inline/do-not-detach-whitespace-with-out-of-flow-siblings-inside-inline-parent.html: Add Test Case
* LayoutTests/fast/inline/do-not-detach-whitespace-with-out-of-flow-siblings-inside-inline-parent-expected.html: Add Test Case Expectation
* LayoutTests/fast/block/positioning/relative-positioned-inline-container-expected.txt: Updated Test Expectations
* LayoutTests/imported/w3c/web-platform-tests/css/css-position/position-absolute-crash-chrome-007.txt: Ditto
* LayoutTests/platform/glib/fast/block/positioning/052-expected.txt: Ditto
* LayoutTests/platform/glib/fast/block/positioning/058-expected.txt: Ditto
* LayoutTests/platform/glib/fast/block/positioning/relative-positioned-inline-container-expected.txt: Ditto
* LayoutTests/platform/glib/fast/block/positioning/trailing-space-test-expected.txt: Ditto
* LayoutTests/platform/gtk/fast/block/positioning/052-expected.png: Ditto
* LayoutTests/platform/gtk/fast/block/positioning/058-expected.png: Ditto
* LayoutTests/platform/gtk/fast/block/positioning/rtl-static-positioning-expected.txt: Ditto
* LayoutTests/platform/gtk/fast/block/positioning/trailing-space-test-expected.png: Ditto
* LayoutTests/platform/ios/fast/block/positioning/052-expected.txt: Ditto
* LayoutTests/platform/ios/fast/block/positioning/058-expected.txt: Ditto
* LayoutTests/platform/ios/fast/block/positioning/rtl-static-positioning-expected.txt: Ditto
* LayoutTests/platform/ios/fast/block/positioning/trailing-space-test-expected.txt: Ditto
* LayoutTests/platform/mac/fast/block/positioning/052-expected.txt: Ditto
* LayoutTests/platform/mac/fast/block/positioning/058-expected.txt: Ditto
* LayoutTests/platform/mac/fast/block/positioning/rtl-static-positioning-expected.txt: Ditto
* LayoutTests/platform/mac/fast/block/positioning/trailing-space-test-expected.txt: Ditto

Canonical link: https://commits.webkit.org/256602@main
  • Loading branch information
Ahmad-S792 authored and Ahmad Saleem committed Nov 12, 2022
1 parent 2b519ff commit af4bfb1cdbf87b2c7f020cd627ea2d72177fee26
Show file tree
Hide file tree
Showing 21 changed files with 48 additions and 2 deletions.
@@ -12,5 +12,6 @@ layer at (8,8) size 100x22
RenderInline (relative positioned) {SPAN} at (0,0) size 100x22
RenderText {#text} at (0,0) size 0x0
RenderBR {BR} at (0,0) size 0x18
RenderText {#text} at (0,0) size 0x0
RenderBlock {DIV} at (0,18) size 100x0 [bgcolor=#FF0000]
RenderText {#text} at (0,0) size 0x0
@@ -0,0 +1,10 @@
<!DOCTYPE html>
<style>
/* Disable kerning because kerning may differ for different node tree. */
html { font-kerning: none; }
</style>
<body>
<span>
<span>A</span>
<span>B</span>
</span>
@@ -0,0 +1,16 @@
<!DOCTYPE html>
<style>
/* Disable kerning because kerning may differ for different node tree. */
html { font-kerning: none; }
</style>
<body>
<span>
<span id="A">A</span>
<span>B</span>
</span>
<script>
var a = document.getElementById('A');
var d = document.createElement('div');
d.style.position = "absolute";
a.parentNode.insertBefore(d, a.nextSibling);
</script>
@@ -1,7 +1,7 @@
parent
start split start
splitter
split middle css-container start ABSFULLABS css container end split end parent end
split middle css-container start ABS FULLABS css container end split end parent end

PASS test passes if it does not crash

@@ -9,6 +9,7 @@ layer at (108,8) size 35x17
RenderInline (relative positioned) {SPAN} at (0,0) size 35x17
RenderText {#text} at (0,0) size 35x17
text run at (0,0) width 35: "Hello"
RenderText {#text} at (0,0) size 0x0
layer at (158,58) size 35x18
RenderBlock (positioned) {DIV} at (50,50) size 35x18 [color=#FFFFFF] [bgcolor=#008000]
RenderText {#text} at (0,0) size 35x17
@@ -19,5 +19,6 @@ layer at (8,42) size 782x35
RenderText {#text} at (228,0) size 782x35
text run at (228,0) width 554: "The image (found or not) should be positioned at the top/left corner of this green-shaded"
text run at (0,18) width 27: "text "
RenderText {#text} at (0,0) size 0x0
layer at (236,42) size 42x42
RenderImage {IMG} at (0,0) size 42x42 [border: (1px solid #000000)]
@@ -12,5 +12,6 @@ layer at (8,8) size 100x21
RenderInline (relative positioned) {SPAN} at (0,0) size 100x21
RenderText {#text} at (0,0) size 0x0
RenderBR {BR} at (0,0) size 0x17
RenderText {#text} at (0,0) size 0x0
RenderBlock {DIV} at (0,18) size 100x0 [bgcolor=#FF0000]
RenderText {#text} at (0,0) size 0x0
@@ -10,6 +10,9 @@ layer at (0,0) size 800x600
RenderInline {SPAN} at (0,0) size 277x19 [border: (1px solid #000000)]
RenderText {#text} at (1,18) size 275x17
text run at (1,18) width 275: "These two boxes should be the same width."
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (284,50) size 100x100
RenderImage {IMG} at (284,50) size 100x100 [bgcolor=#008000]
layer at (284,150) size 100x100
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -11,6 +11,7 @@ layer at (8,26) size 380x380
RenderBlock (relative positioned) {DIV} at (0,18) size 380x380 [border: (20px solid #00000000)]
RenderBlock {DIV} at (90,40) size 250x220 [border: (10px solid #00000000)]
RenderInline {SPAN} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (228,76) size 100x100
RenderBlock (positioned) {DIV} at (220,50) size 100x100 [bgcolor=#FF0000]
layer at (228,76) size 100x100
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -9,6 +9,7 @@ layer at (108,8) size 36x19
RenderInline (relative positioned) {SPAN} at (0,0) size 36x19
RenderText {#text} at (0,0) size 36x19
text run at (0,0) width 36: "Hello"
RenderText {#text} at (0,0) size 0x0
layer at (158,58) size 36x20
RenderBlock (positioned) {DIV} at (50,50) size 36x20 [color=#FFFFFF] [bgcolor=#008000]
RenderText {#text} at (0,0) size 36x19
@@ -19,5 +19,6 @@ layer at (8,44) size 755x39
RenderText {#text} at (232,0) size 755x39
text run at (232,0) width 523: "The image (found or not) should be positioned at the top/left corner of this green-"
text run at (0,20) width 77: "shaded text "
RenderText {#text} at (0,0) size 0x0
layer at (241,44) size 42x42
RenderImage {IMG} at (0,0) size 42x42 [border: (1px solid #000000)]
@@ -11,6 +11,7 @@ layer at (8,28) size 380x380
RenderBlock (relative positioned) {DIV} at (0,20) size 380x380 [border: (20px solid #00000000)]
RenderBlock {DIV} at (90,40) size 250x220 [border: (10px solid #00000000)]
RenderInline {SPAN} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (228,78) size 100x100
RenderBlock (positioned) {DIV} at (220,50) size 100x100 [bgcolor=#FF0000]
layer at (228,78) size 100x100
@@ -10,6 +10,9 @@ layer at (0,0) size 800x600
RenderInline {SPAN} at (0,0) size 281x21 [border: (1px solid #000000)]
RenderText {#text} at (1,20) size 279x19
text run at (1,20) width 279: "These two boxes should be the same width."
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (287,50) size 100x100
RenderImage {IMG} at (287,50) size 101x100 [bgcolor=#008000]
layer at (287,150) size 100x100
@@ -9,6 +9,7 @@ layer at (108,8) size 36x18
RenderInline (relative positioned) {SPAN} at (0,0) size 36x18
RenderText {#text} at (0,0) size 36x18
text run at (0,0) width 36: "Hello"
RenderText {#text} at (0,0) size 0x0
layer at (158,58) size 36x18
RenderBlock (positioned) {DIV} at (50,50) size 36x18 [color=#FFFFFF] [bgcolor=#008000]
RenderText {#text} at (0,0) size 36x18
@@ -19,5 +19,6 @@ layer at (8,42) size 755x36
RenderText {#text} at (232,0) size 755x36
text run at (232,0) width 523: "The image (found or not) should be positioned at the top/left corner of this green-"
text run at (0,18) width 77: "shaded text "
RenderText {#text} at (0,0) size 0x0
layer at (241,42) size 42x42
RenderImage {IMG} at (0,0) size 42x42 [border: (1px solid #000000)]
@@ -11,6 +11,7 @@ layer at (8,26) size 380x380
RenderBlock (relative positioned) {DIV} at (0,18) size 380x380 [border: (20px solid #00000000)]
RenderBlock {DIV} at (90,40) size 250x220 [border: (10px solid #00000000)]
RenderInline {SPAN} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (228,76) size 100x100
RenderBlock (positioned) {DIV} at (220,50) size 100x100 [bgcolor=#FF0000]
layer at (228,76) size 100x100
@@ -10,6 +10,9 @@ layer at (0,0) size 800x600
RenderInline {SPAN} at (0,0) size 281x20 [border: (1px solid #000000)]
RenderText {#text} at (1,18) size 279x18
text run at (1,18) width 279: "These two boxes should be the same width."
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
RenderText {#text} at (0,0) size 0x0
layer at (287,50) size 100x100
RenderImage {IMG} at (287,50) size 101x100 [bgcolor=#008000]
layer at (287,150) size 100x100
@@ -428,7 +428,7 @@ bool RenderTreeUpdater::textRendererIsNeeded(const Text& textNode)

if (parentRenderer.isRenderInline()) {
// <span><div/> <div/></span>
if (previousRenderer && !previousRenderer->isInline())
if (previousRenderer && !previousRenderer->isInline() && !previousRenderer->isOutOfFlowPositioned())
return false;
} else {
if (parentRenderer.isRenderBlock() && !parentRenderer.childrenInline() && (!previousRenderer || !previousRenderer->isInline()))

0 comments on commit af4bfb1

Please sign in to comment.