In a table with the directionality is set to RTL, the position of sticky elements incorrectly positioned horizontally. The amount that they are off seems to be related to how much the table can be scrolled (if the table can only be scrolled slightly, the position is only off by a little bit). This is an issue in Safari 14.0.3 and Technology Preview 119, but Safari 13.1 behaves as expected as well as Firefox and Chrome. I am also seeing the issue in multiple iOS versions (13.0, 13.7, 14.1 all tested in a simulator) See this stackblitz for a minimal reproduction of the bug: https://stackblitz.com/edit/rtl-sticky-table-bug This was originally discovered when working with the Angular Material table. Here is an example of that table showing this bug: https://stackblitz.com/edit/rtl-sticky-bug-material
I've noticed that if you open dev tools and highlight one of the incorrectly positioned elements, it highlights the correct position - not where the element is visible. Also, if there's a button in the incorrectly positioned element, you can click the button by clicking where the button should be - not where it is visible.
<rdar://problem/74403616>
Created attachment 422300 [details] Testcase
Created attachment 422302 [details] Non-table test
Created attachment 422332 [details] Patch
Committed r273982: <https://commits.webkit.org/r273982> All reviewed patches have been landed. Closing bug and clearing flags on attachment 422332 [details].