Getting different result when masking inverted view in widgets vs. inside app

Hi there,

I'm trying to overlay an inverted version of a view on top of itself, and then partially masking it so that you can see underneath it.

Here is the code I'm using for the masking invert view:

Code Block swift
struct BugView: View {
    var body: some View {
        let view = ZStack {
            Color.white
            Text("50%")
                .foregroundColor(.black)
                .font(.system(size: 100))
                .minimumScaleFactor(0.0001)
        }
        return ZStack(alignment: .center) {
                view
                view.colorInvert()
                    .mask(
                        GeometryReader { proxy in
                            Rectangle().frame(width: proxy.size.width / 2)
                        }
                    )
            }
    }


Inside my app it does as expected, showing a text that says 50% with half the view inverted. You can see a screenshot at imgur.com/E9QjBQI

When I put this same view in a Widget however, it seems that the background of the inverted view doesn't get masked and bleeds over the rest of the view. You can see how it looks here: imgur.com/vI8602l

I'm not sure how to accomplish the desired effect in both contexts. I also wonder if there's an easier way to do this, this seems hacky.
Getting different result when masking inverted view in widgets vs. inside app
 
 
Q