Bug 246495

Summary: table tr borders render incorrectly
Product: WebKit Reporter: Darin Senneff <darin.senneff>
Component: TablesAssignee: Nobody <webkit-unassigned>
Status: RESOLVED CONFIGURATION CHANGED    
Severity: Normal CC: ahmad.saleem792, bfulgham, karlcow, simon.fraser, webkit-bug-importer, zalan
Priority: P2 Keywords: InRadar
Version: Safari 16   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Screen recording - table tr border issue none

Description Darin Senneff 2022-10-13 17:31:21 PDT 
Created attachment 462973 [details]
Screen recording - table tr border issue

When a table tr element has a border applied to it with CSS, the size and placement of that row and its border does not render correctly (see the attached screen recording for a visual). It seems that including elements such a button in the table causes the issue, as tables without those elements do not have the issue.

Demo page: https://codepen.io/dsenneff/pen/vYjbQYm/91d48ea673dcb4fd7c09e43be2b83384
Demo page (without CodePen wrapper): https://cdpn.io/pen/debug/vYjbQYm/91d48ea673dcb4fd7c09e43be2b83384

To replicate:
1. Load the demo page linked above.
2. Observe the top-border of several rows in the first table have rendering issues. The second table does not have any issues. 
3. Using the browser inspector, toggle off-and-on the top-border style. 
4. Observe how the table renders different as the top-border is turned on-and-off.
Comment 1 Radar WebKit Bug Importer 2022-10-20 17:32:20 PDT 
<rdar://problem/101406586>
Comment 2 Darin Senneff 2022-11-28 08:57:57 PST 
Issue still present in Safari 16.1 on both MacOS and iPadOS.
Comment 3 Ahmad Saleem 2023-02-18 03:54:38 PST 
I am not able to reproduce this issue in Safari Technology Preview 163 and WebKiT ToT and it does not have glitch like screen recording, which is still present in Safari 16.3.

It seems with Safari 16.4, it might be fixed, if it is as far as STP163.

Marking this as "RESOLVED CONFIGURATION CHANGED". Thanks!