ava / use-http

🐶 React hook for making isomorphic http requests
https://use-http.com
MIT License
2.31k stars 113 forks source link

Provider + useQuery/useMutation non-tagged-template syntax doesn't work. #329

Open chrisvariety opened 3 years ago

chrisvariety commented 3 years ago

Describe the bug Invoking useQuery or useMutation with a regular function call (instead of a tagged template literal) + Provider triggers invariant variation:

useQuery requires a URL to be set as the 1st argument,

      unless you wrap your app like:

      <Provider url="https://q0hkn.csb.app"><App /></Provider>
useQuery(`
        {
            users {
                id
                name
                email
            }
        }
    `);

⚠️ Make a Codesandbox ⚠️ I took the GraphQL Codesandbox and just added parenthesis around the useQuery call: https://codesandbox.io/s/graphql-usequery-provider-forked-q0hkn?file=/src/index.js:369-434

To Reproduce Steps to reproduce the behavior:

  1. Just load the page!

Expected behavior I would expect this invariant not to trigger because useQuery is wrapped in a <Provider url="...">.

This triggers because of this invariant: https://github.com/ava/use-http/blob/d725956cb2fab9b2a7c979669559ab0426a361c4/src/useQuery.ts#L25-L28 (also present on useMutation)

!!context.url is true, but Array.isArray(urlOrQuery) is false, so true && false => false which triggers the invariant.

zachariahtimothy commented 3 years ago

This issue also prevents passing in the document as a variable (we auto-generate from graphql-codegenerator).