Runtime warning: received an action for a missing element

[jose-pay]

The following full working example is triggering an A "forEach" at "RefreshTest/PastaListView.swift" received an action for a missing element.

This warning is triggered when
a) the user taps on the back button to go back to the main screen and then taps on the "Pasta" cell again
b) when the user pulls to refresh

For case a) It seems that the PastaListView stays in memory. The view will appear and you can see the old cells in the list.

I guess that the pastaTiles in the PastaListReducer.State can be cleared to get rid of the warning, but it would be interesting to understand the underlying issue here.

import ComposableArchitecture
import SwiftUI

@main
struct PastaApp: App {

    var body: some Scene {
        WindowGroup {
            NavigationView {
                List {
                    NavigationLink("Pasta") {
                        PastaListView(
                            store: Store(
                                initialState: PastaListReducer.State(),
                                reducer: PastaListReducer()
                                    ._printChanges()
                            )
                        )
                    }
                }
                .navigationTitle("Demo")
            }
        }
    }
}

struct PastaService {

    var fetchPasta: @Sendable () async throws -> [PastaTile]
}

extension DependencyValues {

    var pastaService: PastaService {
        get { self[PastaService.self] }
        set { self[PastaService.self] = newValue }
    }
}

extension PastaService: DependencyKey {

    public static var liveValue: PastaService {
        testValue
    }

    public static var testValue = Self(
        fetchPasta: {
            try await Task.sleep(nanoseconds: NSEC_PER_SEC)
            return [
                PastaTile(type: .fusilli),
                PastaTile(type: .fettuccine)
            ]
        }
    )
}


struct PastaListReducer: ReducerProtocol {

    struct State {
        var pastaTiles: IdentifiedArrayOf<PastaRowReducer.State> = []
    }

    enum Action {
        case pasta(id: PastaRowReducer.State.ID, action: PastaRowReducer.Action)

        case task
        case refresh

        case loadPasta
        case pastaResponse(TaskResult<[PastaTile]>)
    }

    @Dependency(\.pastaService) var pastaService

    var body: some ReducerProtocolOf<Self> {
        Reduce { state, action in
            switch action {
                case .refresh:
                    return .task {
                        .loadPasta
                    }
                case .task:
                    return .task {
                        .loadPasta
                    }
                case .loadPasta:
                    return .task {
                        await .pastaResponse(
                            TaskResult { try await pastaService.fetchPasta() }
                        )
                    }
                case let .pastaResponse(.success(pasta)):
                    state.pastaTiles = IdentifiedArray(
                        uniqueElements: pasta.map {
                            switch $0.type {
                                case .fusilli:
                                    return .fusilli(.init(pasta: $0))
                                case .fettuccine:
                                    return .fettuccine(.init(pasta: $0))
                            }
                        }
                    )
                    return .none
                case .pasta(id: let id, action: let action):
                    return .none
                case .pastaResponse(.failure):
                    return .none
            }
        }
        .forEach(\.pastaTiles, action: /Action.pasta(id:action:)) {
            PastaRowReducer()
        }
    }
}

struct PastaRowReducer: ReducerProtocol {

    enum State: Equatable, Identifiable {

        case fettuccine(FettuccineReducer.State)
        case fusilli(FusilliReducer.State)

        var id: UUID {
            switch self {
                case .fettuccine(let state):
                    return state.pasta.id
                case .fusilli(let state):
                    return state.pasta.id
            }
        }
    }

    enum Action {
        case fettuccine(FettuccineReducer.Action)
        case fusilli(FusilliReducer.Action)
    }

    var body: some ReducerProtocolOf<Self> {
        Reduce { _, _ in
            .none
        }
        .ifCaseLet(/State.fusilli, action: /Action.fusilli) {
            FusilliReducer()
        }
        .ifCaseLet(/State.fettuccine, action: /Action.fettuccine) {
            FettuccineReducer()
        }
    }
}

struct FettuccineReducer: ReducerProtocol {

    struct State: Equatable {
        let pasta: PastaTile
    }

    enum Action {}

    func reduce(into state: inout State, action: Action) -> EffectTask<Action> {
        .none
    }
}

struct FusilliReducer: ReducerProtocol {

    struct State: Equatable {
        let pasta: PastaTile
    }

    enum Action {
        case task
        case onDisappear
    }

    func reduce(into state: inout State, action: Action) -> EffectTask<Action> {
        switch action {
            case .task:
                return .none
            case .onDisappear:
                return .none
        }
    }
}

enum PastaType {
    case fusilli, fettuccine
}

struct PastaTile: Equatable, Identifiable {
    let id = UUID()
    let type: PastaType
}

struct PastaListView: View {

    let store: StoreOf<PastaListReducer>

    var body: some View {
        WithViewStore(store, observe: \.pastaTiles) { viewStore in
            List {
                ForEachStore(
                    store.scope(
                        state: \.pastaTiles,
                        action: PastaListReducer.Action.pasta),
                    content: PastaRowView.init
                )
            }
            .task {
                await viewStore.send(.task).finish()
            }
            .refreshable {
                await viewStore.send(.refresh).finish()
            }
        }
    }
}

struct PastaRowView: View {

    let store: StoreOf<PastaRowReducer>

    var body: some View {
        SwitchStore(store) {
            CaseLet(
                state: /PastaRowReducer.State.fusilli,
                action: PastaRowReducer.Action.fusilli
            ) { store in
                FusilliView(store: store)
            }
            CaseLet(
                state: /PastaRowReducer.State.fettuccine,
                action: PastaRowReducer.Action.fettuccine
            ) { store in
                Text("Fettuccine")
            }
        }
    }
}

struct FusilliView: View {

    let store: StoreOf<FusilliReducer>

    var body: some View {
        WithViewStore(store) { viewStore in
            Text("Fusilli")
                .task {
                    await viewStore.send(.task).finish()
                }
                .onDisappear {
                    viewStore.send(.onDisappear)
                }
        }
    }
}

struct PastaListView_Previews: PreviewProvider {

    static var previews: some View {
        PastaListView(
            store: Store(
                initialState: PastaListReducer.State(),
                reducer: PastaListReducer()
            )
        )
    }
}

[tgrapperon]

Hey @jose-pay!
In your case, the issue comes from the uncontrolled UUID that you assign to your PastasTiles:

struct PastaTile: Equatable, Identifiable {
  let id = UUID()
  let type: PastaType
}

Each time you create a new value of this type, it will be different, even if you use the same PastaType. When you pull to refresh, you replace the existing PastaTile values with new ones. In terms of SwiftUI, it means that it needs to replace the corresponding views¹, and it then recreates new PastaRow's views and ditches the existing ones. Because these existing views are removed, they will emit onDisappear, but the PastaTile value that supported them is already gone in the PastaList state (you just replaced the values), so this is technically a "zombie" pasta talking, and TCA considers this as an issue and raises the warning.

The same phenomenon happens with navigating back and forth, as your lazy task reloads new pastas over the existing ones that weren't discarded when navigating back, triggering something similar to the "pull to refresh" effect.

The partial solution would be to find a way to assign stable ID's (UUID or not) to your PastaTiles, and the warnings should go away in your case. But please note that since you're emitting at onDisappear and since this action is triggered when the view goes away, you will mostly emit because the underlying state is nil, and you'll always get warnings when pastas are legitimately removed. You should probably devise a way to avoid emitting actions at onDisappear. How you should do it really depends on what you want to achieve for this event.

Footnotes

1. This is because ForEachStore keys the views with the identified array's ID (the UUID) in an internal ForEach, and because this value changes, the views are considered "new" instead of "updated", and this triggers onAppear/onDisappear on existing/removed views, even if their content is apparently the same. ↩

[stephencelis]

It might also be helpful to get the full warning message, which should include the name of the action being sent into the system. For TCA apps where onDisappear is driven off state, it's not always possible to feed those actions back into the system depending on how your reducer is composed.