Very strange layout on macOS Sonoma

[PatrikTheDev]

Summary

Steps to reproduce

Just launched the app for the first time

Environment

expo-env-info 1.0.5 environment info:
System:
OS: macOS 14.0
Shell: 3.6.0 - /opt/homebrew/bin/fish
Binaries:
Node: 20.3.1 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.6.7 - /usr/local/bin/npm
Watchman: 2023.06.08.00 - /opt/homebrew/bin/watchman
Managers:
CocoaPods: 1.11.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
IDEs:
Xcode: 14.2/14C18 - /usr/bin/xcodebuild

[Saadnajmi]

macOS Sonoma added a change by adding NSView.clipsToBounds as a property, and a breaking change of changing drawRect to give you dirtyRects that can very much draw outside the bounds of your views. RN-SVG uses drawRect in its implementation, and we saw similar issues in our apps with Sonoma. Fix would be in react-native-svg, somewhere around here https://github.com/software-mansion/react-native-svg/blob/0e931577ac9d9241be813bd9a7f03f71b7629ff0/apple/Elements/RNSVGSvgView.mm#L287C1-L288C1

[PatrikTheDev]

How about the last screenshot? The settings page rendered incorrectly upon the first launch, though subsequent launches looked fine

[Saadnajmi]

I found another explainer: https://indiestack.com/2023/06/view-clipping-sonoma/
I'm not sure what's happening with the settings page, but I know React Native macOS overrides drawRect to I'm pretty sure, so there might be an issue there too.

[gabrieldonadel]

How about the last screenshot? The settings page rendered incorrectly upon the first launch, though subsequent launches looked fine

I'll take a look at that

[idrakimuhamad]

Had this too in Sonoma. But goes away after sleep.

[gabrieldonadel]

A new version of Expo Orbit has just been released! v0.1.3 includes fixes for this and other issues, you can check the full details on the releases page. Please test it out and let us know if you find any other problems.