question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Fragments with only @client local state data throw exception

See original GitHub issue

Intended outcome: Be able to query local state with a fragment that only includes @client data:

query MyQuery {
  ...RootQueryFragment
}

fragment RootQueryFragment on Query {
  localStateMessage @client
}

Actual outcome:

Throws an exception:

  TypeError: Cannot read property 'selectionSet' of undefined
      at isEmpty (bundle.esm.js:529)
      at bundle.esm.js:530
      at Array.every (<anonymous>)
      at isEmpty (bundle.esm.js:529)
      at nullIfDocIsEmpty (bundle.esm.js:535)
      at removeDirectivesFromDocument (bundle.esm.js:551)
      at removeConnectionDirectiveFromDocument (bundle.esm.js:666)
      at ApolloLink.request (bundle.esm.js:2601)
      //...

It works when no fragment is used:

  query MyQuery {
    localStateMessage @client
  }

It also works when the fragment includes non-local data (i.e. without @client):

  query MyQuery {
    ...RootQueryFragment
  }

  fragment RootQueryFragment on Query {
    localStateMessage @client
    people {
      id
      name
    }
  }

How to reproduce the issue:

See 4529-local-state-fragments branch of my react-apollo-error-template fork.

Versions

System:
  OS: Linux 4.20 Arch Linux
Binaries:
  Node: 11.9.0 - /usr/bin/node
  Yarn: 1.13.0 - /usr/bin/yarn
  npm: 6.7.0 - /usr/bin/npm
Browsers:
  Firefox: 65.0
  // This wasn't detected but I was actually running the example in Chromium
  Chromium: 72.0.3626.81
npmPackages:
  apollo-cache-inmemory: 1.5.1 => 1.5.1 
  apollo-client: 2.5.1 => 2.5.1 
  apollo-link: 1.2.8 => 1.2.8 
  react-apollo: 2.1.4 => 2.1.4 

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

10reactions
lifeiscontentcommented, Jul 31, 2019

@hwillson any updates on this?

3reactions
solomon23commented, Sep 14, 2020

Running into a similar problem

export const TEST_DATA_QUERY = gql`
  query TestPageDataQuery {
    me {
      id
    }
    ...ProfileData
  }
  ${profileStateFragment}
`

export const profileStateFragment = gql`
  fragment ProfileData on Query {
    profileClickCount @client
  }
`

Will cause the client to send the fragment to the server and the server will return an error

Read more comments on GitHub >

github_iconTop Results From Across the Web

Managing local state | Full-Stack Quickstart - Apollo GraphQL
Storing local data in the Apollo cache. Like most web apps, our app relies on a combination of remotely fetched data and locally...
Read more >
Use Apollo to Manage the App's Local State
By default, the Apollo Client stores the data in a de-normalized fashion, so that we can use fragments and the cache key to...
Read more >
Storing local data with Apollo Client | by Eugenia Zigisova
To get local state value, we are going to use a simple GraphQL query which requires only one field isDarkMode . We use...
Read more >
Test your fragments - Android Developers
Caution: If you try to transition your fragment under test to its current state, FragmentScenario ignores the request without throwing an exception. In ......
Read more >
React to Relay: local state management, part 3 - babangsund
ERROR : Found a circular reference from fragment 'DialogContainerTask'. We'll just have to write everything twice, and since we're unable to use ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found