Bug 311048 – Collapsed border color mismatch when table cell has different writing-mode

• Status: RESOLVED
• Resolution: FIXED
• Component: Tables

[Karl Dubost]

Created attachment 478835 [details]
testcase

In computeCollapsedBeforeBorder and computeCollapsedAfterBorder, four calls to borderAfter() omit the tableWritingMode() parameter, causing the border value (width/style) to be read using the element's own writing mode while the border color is resolved using the table's writing mode. When a cell has a different writing mode from the table, these disagree about which physical edge is "after", producing a CollapsedBorderValue with width/style from one physical edge and color from another.

The affected lines in RenderTableCell.cpp:

  - computeCollapsedBeforeBorder:
    - previousCell->style().borderAfter()
    - previousRow->style().borderAfter()
    - currSection->style().borderAfter()
  - computeCollapsedAfterBorder:
    - lastRowInSpan->style().borderAfter()

All four should pass tableWritingMode() as the argument, matching the pattern already used by neighboring lookups in the same functions.

The root cause is where afterColorProperty is resolved using tableWritingMode(): CSSPropertyID afterColorProperty = ... CSSProperty::resolveDirectionAwareProperty(CSSPropertyBorderBlockEndColor, tableWritingMode()) ...;

This correctly maps to border-bottom-color for a horizontal-tb table. But previousCell->style().borderAfter() uses the cell's own writing mode, so for a vertical-rl cell it reads border-left properties. The resulting CollapsedBorderValue gets its width/style from border-left but its color from border-bottom-color.

Steps to Reproduce:

1. With Safari Technology Preview 239 on macOS
2. Open testcase

Expected Results:

The border between rows should be 3px blue in both tables (cell-below's 3px blue top border wins over cell-above's 1px gray bottom border per the "wider border wins" rule).

Actual Results:

In the test table, the border between rows renders with the wrong color (gray instead of blue). The gray comes from border-bottom-color of the cell above, which leaks into the collapsed border value due to the writing-mode mismatch. The reference table correctly shows 3px blue.

Firefox and Chrome both render 3px blue for both tables.

[Radar WebKit Bug Importer]

<rdar://problem/173655092>

[Karl Dubost]

Pull request: https://github.com/WebKit/WebKit/pull/61647

[EWS]

Committed 310303@main (81700e22624d): <https://commits.webkit.org/310303@main>

Reviewed commits have been landed. Closing PR #61647 and removing active labels.

[Karl Dubost]

Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/58874