title: React Apollo GraphQL : Expecting a parsed GraphQL document. Perhaps you need to wrap the query string in a "gql" tag?
body: <p>I keep getting this error when trying to update cache after mutation:</p>
  
  <blockquote>
    <p>Possible Unhandled Promise Rejection (id: 0):
    Invariant Violation: Expecting a parsed GraphQL document. Perhaps you need to wrap the query string in a "gql" tag?</p>
  </blockquote>
  
  <p>The mutation succeeds, then I run this code inside the <strong>onCompleted</strong> method.</p>
  
  <pre><code>const cards = this.props.client.readQuery({ FETCH_CARDS, variables: { userId: data.createPaymentMethod.userId } });
  
  const { id,
          brand,
          lastFour,
          userId,
          stripeID } = data.createPaymentMethod
  
  const paymentMethod = {
    id: id,
    brand: brand,
    lastFour: lastFour,
    userId: userId,
    stripeID: stripeID,
    __typename: 'PaymentMethod',
  };
  
  // Write back to the to-do list and include the new item
  this.props.client.writeQuery({
    FETCH_CARDS,
    data: {
      paymentMethod: [...cards.paymentMethod, paymentMethod],
    },
  });
  </code></pre>
  
  <p>I don't understand what I'm doing wrong. I'm following this guide: <a href="https://www.apollographql.com/docs/react/caching/cache-interaction/#writequery-and-writefragment" rel="noreferrer">https://www.apollographql.com/docs/react/caching/cache-interaction/#writequery-and-writefragment</a></p>
  
  <p>EDIT: FETCH_CARDS</p>
  
  <pre><code>const FETCH_CARDS = gql`
    query PaymentMethod($userId: ID){
      paymentMethod(userId: $userId) {
        id
        brand
        lastFour
        userId
        stripeID
      }
    }
  `;
  </code></pre>