Add phased rendering to the display list builder so that within each stacking context, block backgrounds/borders paint before floats, which paint before inline content, per CSS 2.1 Appendix E steps 3-5. Introduces a RenderPhase enum (BackgroundsOnly, InlineContentOnly, Full) threaded through render_layout_box_normal and render_non_inline_descendants. Step 6 positioned-auto descendants are collected and rendered via render_stacking_context for correct internal Appendix E ordering. Net +20 WPT tests passing (25 promoted, 5 demoted for pixel regressions). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
129 lines
11 KiB
Plaintext
129 lines
11 KiB
Plaintext
DisplayList items=127
|
|
SolidRect rect=(20, 79.90401, 230, 130) color=#e0e0ff
|
|
Border rect=(20, 79.90401, 230, 130) widths=(5 5 5 5) colors=(#0000ff #0000ff #0000ff #0000ff)
|
|
SolidRect rect=(35, 114.104004, 200, 50) color=#e0ffe0
|
|
Border rect=(35, 114.104004, 200, 50) widths=(4 4 4 4) colors=(#008000 #008000 #008000 #008000)
|
|
SolidRect rect=(20, 269.808, 150, 68.400024) color=#ffe0e0
|
|
Border rect=(20, 269.808, 150, 68.400024) widths=(5 5 5 5) colors=(#ff0000 #ff0000 #ff0000 #ff0000)
|
|
SolidRect rect=(20, 338.20804, 200, 78.400024) color=#f0e0ff
|
|
Border rect=(20, 338.20804, 200, 78.400024) widths=(8 8 8 8) colors=(#800080 #800080 #800080 #800080)
|
|
SolidRect rect=(20, 476.51205, 410, 100) color=#f5f5f5
|
|
SolidRect rect=(25, 481.51205, 120, 80) color=#fff5e0
|
|
Border rect=(25, 481.51205, 120, 80) widths=(5 5 5 5) colors=(#ffa500 #ffa500 #ffa500 #ffa500)
|
|
SolidRect rect=(155, 481.51205, 110, 90) color=#e0ffff
|
|
Border rect=(155, 481.51205, 110, 90) widths=(5 5 5 5) colors=(#008080 #008080 #008080 #008080)
|
|
SolidRect rect=(20, 636.416, 510, 110) color=#f5f5f5
|
|
SolidRect rect=(25, 641.416, 200, 100) color=#fff0e0
|
|
Border rect=(25, 641.416, 200, 100) widths=(10 10 10 10) colors=(#a52a2a #a52a2a #a52a2a #a52a2a)
|
|
SolidRect rect=(225, 641.416, 200, 100) color=#fff0e0
|
|
Border rect=(225, 641.416, 200, 100) widths=(10 10 10 10) colors=(#a52a2a #a52a2a #a52a2a #a52a2a)
|
|
SolidRect rect=(20, 806.31995, 330, 180) color=#f5f5f5
|
|
SolidRect rect=(25, 811.31995, 150, 80) color=#e0e0ff
|
|
Border rect=(25, 811.31995, 150, 80) widths=(5 5 5 5) colors=(#000080 #000080 #000080 #000080)
|
|
SolidRect rect=(185, 811.31995, 150, 80) color=#e0e0ff
|
|
Border rect=(185, 811.31995, 150, 80) widths=(5 5 5 5) colors=(#000080 #000080 #000080 #000080)
|
|
SolidRect rect=(25, 901.31995, 150, 80) color=#e0e0ff
|
|
Border rect=(25, 901.31995, 150, 80) widths=(5 5 5 5) colors=(#000080 #000080 #000080 #000080)
|
|
SolidRect rect=(185, 901.31995, 150, 80) color=#e0e0ff
|
|
Border rect=(185, 901.31995, 150, 80) widths=(5 5 5 5) colors=(#000080 #000080 #000080 #000080)
|
|
SolidRect rect=(21, 1047.2239, 47.385468, 36.7) color=#f9f9f9
|
|
SolidRect rect=(69.38547, 1047.2239, 47.385468, 36.7) color=#f9f9f9
|
|
SolidRect rect=(21, 1084.9238, 47.385468, 36.7) color=#f9f9f9
|
|
SolidRect rect=(69.38547, 1084.9238, 47.385468, 36.7) color=#f9f9f9
|
|
Border rect=(21, 1046.2239, 47.385468, 2) widths=(2 0 0 0) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(69.38547, 1046.2239, 47.385468, 2) widths=(2 0 0 0) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(21, 1084.4238, 47.385468, 1) widths=(1 0 0 0) colors=(#808080 #808080 #808080 #808080)
|
|
Border rect=(69.38547, 1084.4238, 47.385468, 1) widths=(1 0 0 0) colors=(#808080 #808080 #808080 #808080)
|
|
Border rect=(21, 1120.6238, 47.385468, 2) widths=(2 0 0 0) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(69.38547, 1120.6238, 47.385468, 2) widths=(2 0 0 0) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(20, 1047.2239, 2, 36.7) widths=(0 0 0 2) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(68.88547, 1047.2239, 1, 36.7) widths=(0 0 0 1) colors=(#808080 #808080 #808080 #808080)
|
|
Border rect=(115.770935, 1047.2239, 2, 36.7) widths=(0 0 0 2) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(20, 1084.9238, 2, 36.7) widths=(0 0 0 2) colors=(#000000 #000000 #000000 #000000)
|
|
Border rect=(68.88547, 1084.9238, 1, 36.7) widths=(0 0 0 1) colors=(#808080 #808080 #808080 #808080)
|
|
Border rect=(115.770935, 1084.9238, 2, 36.7) widths=(0 0 0 2) colors=(#000000 #000000 #000000 #000000)
|
|
SolidRect rect=(210, 1190.9279, 140, 60) color=#ffe0e0
|
|
Border rect=(210, 1190.9279, 140, 60) widths=(4 4 4 4) colors=(#8b0000 #8b0000 #8b0000 #8b0000)
|
|
SolidRect rect=(20, 1310.8318, 200, 120) color=#ffffcc
|
|
Border rect=(20, 1310.8318, 200, 120) widths=(2 8 4 10) colors=(#000000 #000000 #000000 #000000)
|
|
SolidRect rect=(20, 1182.5278, 180, 49.19995) color=#e0ffe0
|
|
Border rect=(20, 1182.5278, 180, 49.19995) widths=(5 5 5 5) colors=(#006400 #006400 #006400 #006400)
|
|
Text rect=(35, 1199.1278, 27.066078, 16) text="Float" color=#000000 font_size=16
|
|
Text rect=(65.12041, 1199.1278, 62.21439, 16) text="border-box" color=#000000 font_size=16
|
|
Text rect=(20, 40.592003, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 40.592003, 11.724052, 18.72) text="1:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 40.592003, 49.136562, 18.72) text="Nested" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(120.58221, 40.592003, 41.90696, 18.72) text="Mixed" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(166.06273, 40.592003, 70.26185, 18.72) text="Box-Sizing" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(35, 96.504005, 32.152718, 16) text="Outer" color=#000000 font_size=16
|
|
Text rect=(70.20705, 96.504005, 66.70191, 16) text="content-box" color=#000000 font_size=16
|
|
Text rect=(47, 127.704, 29.979443, 16) text="Inner" color=#000000 font_size=16
|
|
Text rect=(80.033775, 127.704, 62.21439, 16) text="border-box" color=#000000 font_size=16
|
|
Text rect=(145.3025, 127.704, 33.444935, 16) text="(100%" color=#000000 font_size=16
|
|
Text rect=(181.80177, 127.704, 34.51395, 16) text="width)" color=#000000 font_size=16
|
|
Text rect=(20, 230.496, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 230.496, 11.724052, 18.72) text="2:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 230.496, 60.84687, 18.72) text="Min/Max" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(132.2925, 230.496, 79.498146, 18.72) text="Constraints" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(35, 286.40802, 58.866375, 16) text="Min-width:" color=#000000 font_size=16
|
|
Text rect=(96.92071, 286.40802, 33.59765, 16) text="150px" color=#000000 font_size=16
|
|
Text rect=(35, 305.60803, 37.662262, 16) text="(width:" color=#000000 font_size=16
|
|
Text rect=(75.71659, 305.60803, 30.40235, 16) text="80px)" color=#000000 font_size=16
|
|
Text rect=(40, 359.80804, 61.38032, 16) text="Max-width:" color=#000000 font_size=16
|
|
Text rect=(104.434654, 359.80804, 33.59765, 16) text="200px" color=#000000 font_size=16
|
|
Text rect=(141.08664, 359.80804, 37.662262, 16) text="(width:" color=#000000 font_size=16
|
|
Text rect=(40, 379.00806, 37.12188, 16) text="300px)" color=#000000 font_size=16
|
|
Text rect=(20, 437.20007, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 437.20007, 11.724052, 18.72) text="3:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 437.20007, 27.791367, 18.72) text="Flex" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(99.23701, 437.20007, 67.93903, 18.72) text="Container" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(40, 498.11206, 62.62555, 16) text="Border-box" color=#000000 font_size=16
|
|
Text rect=(40, 517.312, 33.59765, 16) text="120px" color=#000000 font_size=16
|
|
Text rect=(170, 498.11206, 68.48752, 16) text="Content-box" color=#000000 font_size=16
|
|
Text rect=(170, 517.312, 26.87812, 16) text="80px" color=#000000 font_size=16
|
|
Text rect=(20, 597.10406, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 597.10406, 11.724052, 18.72) text="4:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 597.10406, 27.791367, 18.72) text="Flex" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(99.23701, 597.10406, 30.773922, 18.72) text="with" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(133.58449, 597.10406, 78.20616, 18.72) text="Percentage" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(215.36421, 597.10406, 35.282112, 18.72) text="Basis" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(50, 668.016, 53.85022, 16) text="Flex-basis" color=#000000 font_size=16
|
|
Text rect=(106.90455, 668.016, 23.201176, 16) text="40%" color=#000000 font_size=16
|
|
Text rect=(250, 668.016, 53.85022, 16) text="Flex-basis" color=#000000 font_size=16
|
|
Text rect=(306.90454, 668.016, 23.201176, 16) text="40%" color=#000000 font_size=16
|
|
Text rect=(20, 767.008, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 767.008, 11.724052, 18.72) text="5:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 767.008, 28.890924, 18.72) text="Grid" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(100.33656, 767.008, 47.25357, 18.72) text="Layout" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(40, 827.9199, 23.659325, 16) text="Grid" color=#000000 font_size=16
|
|
Text rect=(66.71365, 827.9199, 7.506608, 16) text="A" color=#000000 font_size=16
|
|
Text rect=(200, 827.9199, 23.659325, 16) text="Grid" color=#000000 font_size=16
|
|
Text rect=(226.71367, 827.9199, 7.6358294, 16) text="B" color=#000000 font_size=16
|
|
Text rect=(40, 917.9199, 23.659325, 16) text="Grid" color=#000000 font_size=16
|
|
Text rect=(66.71365, 917.9199, 7.424376, 16) text="C" color=#000000 font_size=16
|
|
Text rect=(200, 917.9199, 23.659325, 16) text="Grid" color=#000000 font_size=16
|
|
Text rect=(226.71367, 917.9199, 8.5756235, 16) text="D" color=#000000 font_size=16
|
|
Text rect=(20, 1006.9119, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 1006.9119, 11.724052, 18.72) text="6:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 1006.9119, 37.151367, 18.72) text="Table" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(108.59701, 1006.9119, 24.561409, 18.72) text="(UA" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(136.73198, 1006.9119, 80.73516, 18.72) text="border-box)" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(30, 1056.2239, 20.111603, 16) text="Cell" color=#000000 font_size=16
|
|
Text rect=(53.165936, 1056.2239, 6.71953, 16) text="1" color=#000000 font_size=16
|
|
Text rect=(77.88547, 1056.2239, 20.111603, 16) text="Cell" color=#000000 font_size=16
|
|
Text rect=(101.0514, 1056.2239, 6.71953, 16) text="2" color=#000000 font_size=16
|
|
Text rect=(30, 1093.4238, 20.111603, 16) text="Cell" color=#000000 font_size=16
|
|
Text rect=(53.165936, 1093.4238, 6.71953, 16) text="3" color=#000000 font_size=16
|
|
Text rect=(77.88547, 1093.4238, 20.111603, 16) text="Cell" color=#000000 font_size=16
|
|
Text rect=(101.0514, 1093.4238, 6.71953, 16) text="4" color=#000000 font_size=16
|
|
Text rect=(20, 1143.2158, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 1143.2158, 11.724052, 18.72) text="7:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 1143.2158, 82.96177, 18.72) text="Shrink-to-fit" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(222, 1204.5278, 64.2467, 16) text="Inline-block" color=#000000 font_size=16
|
|
Text rect=(20, 1271.5198, 29.000881, 18.72) text="Test" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(52.574448, 1271.5198, 11.724052, 18.72) text="8:" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(67.87207, 1271.5198, 82.57691, 18.72) text="Asymmetric" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(154.02254, 1271.5198, 108.48528, 18.72) text="Padding/Border" color=#000000 font_size=18.72 font_weight=700
|
|
Text rect=(50, 1319.4318, 65.48017, 16) text="Asymmetric" color=#000000 font_size=16
|
|
Text rect=(118.5345, 1319.4318, 20.546255, 16) text="box" color=#000000 font_size=16
|