Why does adding ".shadow" modifier to a List makes ".onMove" modifier not working anymore?

Question

It's running on macOS (11.7.2), Codes as below:

struct ContentView: View {
@State private var users = ["Paul", "Taylor", "Adele"]

var body: some View {
    List {
        ForEach(users, id: \.self) { user in
            Text(user)
        }
        .onMove { a, b in
            print(a,b)
        }
    }
    .frame(width: 200,height: 200)
    .background(Color.white)
    .cornerRadius(10)
    .position(x: 500, y:300)
    //.shadow(color: Color.black.opacity(0.2), radius: 10)
}

}

If I comment out .shadow modifier, .onMove's closure get executed, otherwise it's not.

Why is this happening? How can I fix this? How does .shadow affect .onMove? That's the most curious part to me, any tips?

Answer 1

It works if you set the shadow before the background. Like this:

List {
    ForEach(users, id: \.self) { user in
        Text(user)
            .foregroundColor(.red)
    }.onMove { a, b in
        print(a,b)
    }
}
.frame(width: 200,height: 200)
.shadow(color: Color.black.opacity(0.2), radius: 10)
.background(Color.white)
.cornerRadius(10)
.position(x: 500, y:300)