Safari rendering bug causes upward offset of tool shelf color picker

[Keavon]

There is a Safari bug affecting our color picker popover for the tool shelf's working colors input. It causes Safari to render the popover by about a 130px upward offset. However, the click targets and devtools hover highlight visualizations for the elements in this popover do show up in the correct location, so this only affects how Safari paints the content.

https://github.com/GraphiteEditor/Graphite/assets/4388688/575d079d-803d-4fc5-8194-8ec977142a32

• It only occurs if there exists a scrollbar in the Properties panel
  • But strangely, it doesn't happen if there exists a scrollbar in the Layers panel— something must somehow be different between those two panels
• It only occurs if the tool shelf has at least two columns
  • However, it being two or three columns doesn't affect how tall the ~130px upward offset is
  • Deleting the .tools container will visibly shrink the shelf back to a width of 1 column, but doesn't stop the issue from occurring until the web page gets resized
• Disabling container-type: size; on the .shelf-and-table element prevents the issue from occurring

We need to investigate this further, ideally create a minimal reproduction test case, and report this. Then hope it's fixed. Or, find a particular way that we can change things to mitigate this on our end.

This is tested on Safari 16.5. container-type was added in Safari 16 (released 2022-09-12).

[Keavon]

Maybe related, as this is the only webkit bug report I can find about container-type: https://bugs.webkit.org/show_bug.cgi?id=256047

[Keavon]

https://bugs.webkit.org/show_bug.cgi?id=274144

[Keavon]

It sounds like this has been fixed in the latest Safari code but hasn't yet made its way into a Technical Preview or full release. So it's just a matter of waiting an indeterminate (and unfortunately, likely rather long) until it reaches users.

[Keavon]

This is fixed in the beta version of Safari 18, which is apparently set for a release this fall. So once that rolls out, and reaches more users over the following months and years, it shouldn't be as much of a problem anymore (especially once we require WebGPU to run Graphite soon, which will also require the latest Safari browser or a switch to Chrome or Firefox).