diff --git a/Tests/LibWeb/Layout/expected/tab-size-letter-spacing.txt b/Tests/LibWeb/Layout/expected/tab-size-letter-spacing.txt new file mode 100644 index 00000000000..fadb0803570 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/tab-size-letter-spacing.txt @@ -0,0 +1,16 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x33 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x17 children: not-inline + BlockContainer
at (8,8) content-size 784x17 children: inline + frag 0 from TextNode start: 1, length: 1, rect: [8,8 14.265625x17] baseline: 13.296875 + "A" + TextNode <#text> + BlockContainer <(anonymous)> at (8,25) content-size 784x0 children: inline + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x33] + PaintableWithLines (BlockContainer) [8,8 784x17] + PaintableWithLines (BlockContainer
) [8,8 784x17] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer(anonymous)) [8,25 784x0] diff --git a/Tests/LibWeb/Layout/expected/tab-size-word-spacing.txt b/Tests/LibWeb/Layout/expected/tab-size-word-spacing.txt new file mode 100644 index 00000000000..fadb0803570 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/tab-size-word-spacing.txt @@ -0,0 +1,16 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x33 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x17 children: not-inline + BlockContainer
at (8,8) content-size 784x17 children: inline + frag 0 from TextNode start: 1, length: 1, rect: [8,8 14.265625x17] baseline: 13.296875 + "A" + TextNode <#text> + BlockContainer <(anonymous)> at (8,25) content-size 784x0 children: inline + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x33] + PaintableWithLines (BlockContainer) [8,8 784x17] + PaintableWithLines (BlockContainer
) [8,8 784x17] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer(anonymous)) [8,25 784x0] diff --git a/Tests/LibWeb/Layout/input/tab-size-letter-spacing.html b/Tests/LibWeb/Layout/input/tab-size-letter-spacing.html new file mode 100644 index 00000000000..da495d4dae2 --- /dev/null +++ b/Tests/LibWeb/Layout/input/tab-size-letter-spacing.html @@ -0,0 +1,9 @@ + + +
A
diff --git a/Tests/LibWeb/Layout/input/tab-size-word-spacing.html b/Tests/LibWeb/Layout/input/tab-size-word-spacing.html new file mode 100644 index 00000000000..c7ae45723e3 --- /dev/null +++ b/Tests/LibWeb/Layout/input/tab-size-word-spacing.html @@ -0,0 +1,9 @@ + + +
A
diff --git a/Userland/Libraries/LibWeb/Layout/InlineLevelIterator.cpp b/Userland/Libraries/LibWeb/Layout/InlineLevelIterator.cpp index ed657f7f270..4e630da7b32 100644 --- a/Userland/Libraries/LibWeb/Layout/InlineLevelIterator.cpp +++ b/Userland/Libraries/LibWeb/Layout/InlineLevelIterator.cpp @@ -253,18 +253,22 @@ Optional InlineLevelIterator::next_without_lookahead( // https://drafts.csswg.org/css-text/#tab-size-property auto tab_size = text_node.computed_values().tab_size(); + auto resolution_context = CSS::Length::ResolutionContext::for_layout_node(text_node); CSSPixels tab_width; tab_width = tab_size.visit( [&](CSS::LengthOrCalculated const& t) -> CSSPixels { - auto resolution_context = CSS::Length::ResolutionContext::for_layout_node(text_node); auto value = t.resolved(resolution_context); - return value.to_px(text_node); }, [&](CSS::NumberOrCalculated const& n) -> CSSPixels { - auto number = n.resolved(text_node); + auto tab_number = n.resolved(text_node); + auto computed_letter_spacing = text_node.computed_values().letter_spacing(); + auto computed_word_spacing = text_node.computed_values().word_spacing(); - return CSSPixels::nearest_value_for(number * chunk.font->glyph_width(' ')); + auto letter_spacing = computed_letter_spacing.resolved(resolution_context).to_px(text_node); + auto word_spacing = computed_letter_spacing.resolved(resolution_context).to_px(text_node); + + return CSSPixels::nearest_value_for(tab_number * (chunk.font->glyph_width(' ') + word_spacing.to_float() + letter_spacing.to_float())); }); // https://drafts.csswg.org/css-text/#white-space-phase-2