Would like to use this with storybook-addon-apollo-client
airtonix opened this issue · comments
Would let us mock out the responses of Network Layer Container components
https://www.npmjs.com/package/storybook-addon-apollo-client
- I ran through all the required setup for the addon,
- Our GQL guys gave me a schema.graphql to put in our frontend project
- I setup one of the stories that ends up loading a Network Layer Component with a query created with
gql
from@ts-gql/tag
- it spits out this error:
Expecting a parsed GraphQL document. Perhaps you need to wrap the query string in a "gql" tag? http://docs.apollostack.com/apollo-client/core.html#gql
Invariant Violation: Expecting a parsed GraphQL document. Perhaps you need to wrap the query string in a "gql" tag? http://docs.apollostack.com/apollo-client/core.html#gql
at new InvariantError (http://localhost:6006/vendors~main.iframe.bundle.js:163217:28)
at invariant (http://localhost:6006/vendors~main.iframe.bundle.js:163229:15)
at checkDocument (http://localhost:6006/vendors~main.iframe.bundle.js:5447:96)
at removeConnectionDirectiveFromDocument (http://localhost:6006/vendors~main.iframe.bundle.js:5903:143)
at MockLink.push.../../node_modules/.pnpm/@apollo/client@3.1.1_graphql@14.6.0+react@16.13.1/node_modules/@apollo/client/utilities/testing/mocking/mockLink.js.MockLink.normalizeMockedResponse (http://localhost:6006/vendors~main.iframe.bundle.js:6776:133)
at MockLink.push.../../node_modules/.pnpm/@apollo/client@3.1.1_graphql@14.6.0+react@16.13.1/node_modules/@apollo/client/utilities/testing/mocking/mockLink.js.MockLink.addMockedResponse (http://localhost:6006/vendors~main.iframe.bundle.js:6719:45)
at http://localhost:6006/vendors~main.iframe.bundle.js:6713:23
at Array.forEach (<anonymous>)
at new MockLink (http://localhost:6006/vendors~main.iframe.bundle.js:6712:29)
at new MockedProvider (http://localhost:6006/vendors~main.iframe.bundle.js:6622:27)
If I instead use the import { gql } from '@apollo/client';
to write the queries, then it doesn't crash and burn, but obviously there's no type safety on our query results :(
looking at your README.md
there's this :
@ts-gql/apollo only exposes a subset of @apollo/client's functionality. For example, it doesn't expose useLazyQuery because we recommend using useApolloClient().query instead. If you disagree with some of the decisions that @ts-gql/apollo makes, you can use ts-gql but write your own type definitions for Apollo or another GraphQL client.
Confused? are you essentially telling anyone who wants a bit more out of the @ts-gql/apollo
exports to go away ?
I think I need @ts-gql/client/testing
exported also.
With the change to use @graphql-typed-document-node/core
, you can now use @apollo/client/testing
and it will work with ts-gql's queries.