Skip to content

Cache inconsistency with @defer and refetch #12250

@timofarei

Description

@timofarei

Issue Description

Description

When using @defer directive with Apollo Client, the cache becomes inconsistent after deleting an item and refetching. While the server returns the correct data after deletion and refetch, the UI renders duplicate entries of the remaining items.

Example query demonstrating @defer usage:

query Books {
  books {
    id
    title
    ... @defer {
      deferredInfo {
        id
        title
      }
    }
  }
}

Expected Behavior

(Refers to screenshots in Reproduction steps)
After deletion and refetch, UI should display only the remaining items matching the server response.

Actual Behavior

UI displays duplicate entries of remaining items, despite server returning correct data.

Additional Context

  • Issue occurs specifically when using @defer directive
  • Standard queries without deferred fields work correctly
  • Manual cache updates via cache.modify() resolve the issue

Link to Reproduction

https://github.com/timofarei/apollo-gql-incremental-delivery-refetch-bug

Reproduction Steps

  1. Clone repository: [link to repo]
  2. Run the app and note the list of two books:
Screenshot 2025-01-03 at 15 20 44
  1. Delete the first book using the delete button
  2. Observe that the remaining book appears twice in the list
Screenshot 2025-01-03 at 15 20 55

@apollo/client version

3.12.4

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions