iOS 17 Snapshots have weird edges and radius
davidalhambra opened this issue · 7 comments
Describe the bug
When I run my tests on iOS17 I get different version than the previous versions. It's weir because the components itself doesn't change visually on my app, only in the snapshots. It happens with some components that have radius or curved edges.
This is happening for UIKit and SwiftUI components. They also have different approaches. In the screenshot we see an screenshot of one Capsule SwiftUI item, but is happening the same with an UIKit item built with a background color and shaped.
To Reproduce
This is the body of the Capsule item of the screenshot bellow.
public var body: some View {
/// We do not use Apples formatted API because we want a small badge
/// without a space between number and % - also this code looks simpler.
Text(String(format: "%.0f%%", progress))
.padding(.horizontal, Style.horizontalPadding)
.frame(height: Style.height)
.background(
Capsule()
.fill(Style.background(for: progress).color,
strokeBorder: Style.border.color,
lineWidth: Style.borderWidth)
)
}
Expected behavior
On previous iOS versions we had a clear Snapshot with the Capsule or Circle shape. Right now we get the good shape on the app (nothing changed) but not at the Snapshot.
Environment
- swift-snapshot-testing version [e.g. 1.9.0]
- Xcode 15.0
- Swift 5
- OS: iOS 17
We are also getting jagged and blurry border edges when recording snapshots in Xcode 15 / iOS 17. Only in the snapshots, not in our app.
From what I can see the issue seems to be related to any kind of RoundedRectangle in SwiftUI with a border (also SwiftUI.Toggle).
Side note: Recently SnapshotTesting was crashing for me when changing my own uneven rectangle implementation to apples UnevenRoundedRectangle() - maybe this is related 🤷🏻♀️
I fixed this issue by explicitly using a circular
corner style - on iOS 17 I think it now defaults to continuous
.
I'm seeing this on Xcode 16 / iOS 18 with UIKit buttons now 😬 (worth noting #606 seems to be the same issue)
I'm not sure if its just me, but it seems using a corner radius of 16
seems to work fine. I wonder if using a power of 2
or power of 4
as a value works fine?
I think for UIKit, if you manually mask your view using a UIBezierPath
, it seems to work as well as a possible solution to using cornerRadius
.
I think actually, if you do layer.cornerCurve = .circular
, it should work too in snapshot tests too unless I'm mistaken?
I'm still having this issue on Xcode 16 and tvOS 18. Using .continuous
style didn't work for me .