Merge pull request #2 from ArtCodeStudio/upstream-4-1-0

Merge upstream v4.1.0

Author: JumpLink

.github/workflows/dev.yml

@@ -0,0 +1,48 @@
+name: development
+
+on:
+  push:
+  pull_request:
+    branches:
+      - "*"
+
+jobs:
+  examples:
+    runs-on: ${{ matrix.os }}
+    strategy:
+      matrix:
+        os: [ubuntu-latest, windows-latest, macos-latest]
+        deno:
+          [1.x, canary]
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Setup Deno
+        uses: denoland/setup-deno@v1
+        with:
+          deno-version: ${{ matrix.deno }}
+
+      - name: examples/authentication-via-http-header.ts
+        run: deno run --allow-net examples/authentication-via-http-header.ts
+
+      - name: examples/batching-requests.ts
+        run: deno run --allow-net examples/batching-requests.ts
+
+      - name: examples/custom-fetch.ts
+        run: deno run --allow-net examples/custom-fetch.ts
+
+      - name: examples/error-handling.ts
+        run: deno run --allow-net examples/error-handling.ts
+
+      - name: examples/passing-custom-header-per-request.ts
+        run: deno run --allow-net examples/passing-custom-header-per-request.ts
+
+      - name: examples/passing-more-options-to-fetch.ts
+        run: deno run --allow-net examples/passing-more-options-to-fetch.ts
+
+      - name: examples/receiving-a-raw-response.ts
+        run: deno run --allow-net examples/receiving-a-raw-response.ts
+
+      - name: examples/using-variables.ts
+        run: deno run --allow-net examples/using-variables.ts

.github/workflows/pr.yml

@@ -3,3 +3,4 @@ node_modules
 dist
 .DS_Store
 *.log
+coverage

.github/workflows/trunk.yml

@@ -8,30 +8,33 @@ Now it also supports Deno 🦕
 <!-- START doctoc generated TOC please keep comment here to allow auto update -->
 <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
 
-- [Features](#features)
-- [Quickstart](#quickstart)
-- [Usage](#usage)
-- [Community](#community)
-  - [GraphQL Code Generator's GraphQL-Request TypeScript Plugin](#graphql-code-generators-graphql-request-typescript-plugin)
-- [Examples](#examples)
-  - [Authentication via HTTP header](#authentication-via-http-header)
-    - [Incrementally setting headers](#incrementally-setting-headers)
-  - [Passing Headers in each request](#passing-headers-in-each-request)
-  - [Passing more options to `fetch`](#passing-more-options-to-fetch)
-  - [Using GraphQL Document variables](#using-graphql-document-variables)
-  - [GraphQL Mutations](#graphql-mutations)
-  - [Error handling](#error-handling)
-  - [Using a custom `fetch` method](#using-a-custom-fetch-method)
-  - [Receiving a raw response](#receiving-a-raw-response)
-  - [File Upload](#file-upload)
-    - [Browser](#browser)
-    - [Node](#node)
-    - [Deno](#deno)
-  - [Batching](#batching)
-- [FAQ](#faq)
-  - [Why do I have to install `graphql`?](#why-do-i-have-to-install-graphql)
-  - [Do I need to wrap my GraphQL documents inside the `gql` template exported by `graphql-request`?](#do-i-need-to-wrap-my-graphql-documents-inside-the-gql-template-exported-by-graphql-request)
-  - [What's the difference between `graphql-request`, Apollo and Relay?](#whats-the-difference-between-graphql-request-apollo-and-relay)
+- [graphql-request](#graphql-request)
+  - [Features](#features)
+  - [Quickstart](#quickstart)
+  - [Usage](#usage)
+  - [Community](#community)
+    - [GraphQL Code Generator's GraphQL-Request TypeScript Plugin](#graphql-code-generators-graphql-request-typescript-plugin)
+  - [Examples](#examples)
+    - [Authentication via HTTP header](#authentication-via-http-header)
+      - [Incrementally setting headers](#incrementally-setting-headers)
+      - [Set endpoint](#set-endpoint)
+      - [passing-headers-in-each-request](#passing-headers-in-each-request)
+    - [Passing more options to `fetch`](#passing-more-options-to-fetch)
+    - [Using GraphQL Document variables](#using-graphql-document-variables)
+    - [GraphQL Mutations](#graphql-mutations)
+    - [Error handling](#error-handling)
+    - [Using a custom `fetch` method](#using-a-custom-fetch-method)
+    - [Receiving a raw response](#receiving-a-raw-response)
+    - [File Upload](#file-upload)
+      - [Browser](#browser)
+      - [Node](#node)
+      - [Deno](#deno)
+    - [Batching](#batching)
+    - [Cancellation](#cancellation)
+  - [FAQ](#faq)
+      - [Why do I have to install `graphql`?](#why-do-i-have-to-install-graphql)
+      - [Do I need to wrap my GraphQL documents inside the `gql` template exported by `graphql-request`?](#do-i-need-to-wrap-my-graphql-documents-inside-the-gql-template-exported-by-graphql-request)
+      - [What's the difference between `graphql-request`, Apollo and Relay?](#whats-the-difference-between-graphql-request-apollo-and-relay)
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
@@ -549,19 +552,50 @@ try {
 deno run --allow-net examples/batching-requests.ts
 ```
 
+### Cancellation
+
+It is possible to cancel a request using an `AbortController` signal.
+
+You can define the `signal` in the `GraphQLClient` constructor:
+
+```ts
+const abortController = new AbortController();
+
+const client = new GraphQLClient(endpoint, { signal: abortController.signal });
+client.request(query);
+
+abortController.abort();
+```
+
+You can also set the signal per request (this will override an existing
+GraphQLClient signal):
+
+```ts
+const abortController = new AbortController();
+
+const client = new GraphQLClient(endpoint);
+client.request({ document: query, signal: abortController.signal });
+
+abortController.abort();
+```
+
+In Node environment, `AbortController` is supported since version v14.17.0. For
+Node.js v12 you can use
+[abort-controller](https://github.com/mysticatea/abort-controller) polyfill.
+
+```
+ import 'abort-controller/polyfill'
+
+ const abortController = new AbortController()
+```
+
 ## FAQ
 
 #### Why do I have to install `graphql`?
 
-`graphql-request` uses a TypeScript type from the `graphql` package such that if
-you are using TypeScript to build your project and you are using
-`graphql-request` but don't have `graphql` installed TypeScript build will fail.
-Details
-[here](https://github.com/prisma-labs/graphql-request/pull/183#discussion_r464453076).
-If you are a JS user then you do not technically need to install `graphql`.
-However if you use an IDE that picks up TS types even for JS (like VSCode) then
-its still in your interest to install `graphql` so that you can benefit from
-enhanced type safety during development.
+`graphql-request` uses methods exposed by the `graphql` package to handle some
+internal logic. On top of that, for TypeScript users, some types are used from
+the `graphql` package to provide better typings.
 
 #### Do I need to wrap my GraphQL documents inside the `gql` template exported by `graphql-request`?
 

.gitignore

@@ -1,28 +1,35 @@
 import { GraphQLClient } from '../src/index.ts'
-;(async function () {
-  const endpoint = 'https://api.graph.cool/simple/v1/cixos23120m0n0173veiiwrjr'
+  ; (async function () {
+    const endpoint = 'https://fruits-api.netlify.app/graphql'
 
-  const graphQLClient = new GraphQLClient(endpoint, {
-    headers: {
-      authorization: 'Bearer MY_TOKEN',
-    },
-  })
+    const graphQLClient = new GraphQLClient(endpoint, {
+      headers: {
+        authorization: 'Bearer MY_TOKEN',
+      },
+    })
 
-  const query = /* GraphQL */ `
+    const query = /* GraphQL */ `
     {
-      Movie(title: "Inception") {
-        releaseDate
-        actors {
-          name
-        }
+      filterFruitsFam(family: "Rosaceae") {
+        id
+        tree_name
+        fruit_name
+        family
       }
     }
   `
 
-  interface TData {
-    Movie: { releaseDate: string; actors: Array<{ name: string }> }
-  }
+    interface Fruit {
+      "id": string;
+      "tree_name": string;
+      "fruit_name": string;
+      "family": string;
+    }
+
+    interface TData {
+      filterFruitsFam: Fruit[]
+    }
 
-  const data = await graphQLClient.request<TData>(query)
-  console.log(JSON.stringify(data, undefined, 2))
-})().catch((error) => console.error(error))
+    const data = await graphQLClient.request<TData>(query)
+    console.log(JSON.stringify(data, undefined, 2))
+  })().catch((error) => console.error(error))

README.md

@@ -2,23 +2,29 @@ import { GraphQLClient } from '../src/index.ts'
 import { wrapFetch } from 'https://deno.land/x/fetch_goody@v5.0.0/mod.ts';
 
 const start = async () => {
-  const endpoint = 'https://api.graph.cool/simple/v1/cixos23120m0n0173veiiwrjr'
+  const endpoint = 'https://fruits-api.netlify.app/graphql'
 
-  const graphQLClient = new GraphQLClient(endpoint, { fetch: wrapFetch()})
+  const graphQLClient = new GraphQLClient(endpoint, { fetch: wrapFetch() })
 
   const query = /* GraphQL */ `
     {
-      Movie(title: "Inception") {
-        releaseDate
-        actors {
-          name
-        }
+      filterFruitsFam(family: "Rosaceae") {
+        id
+        tree_name
+        fruit_name
+        family
       }
-    }
-  `
+    }`
+
+  interface Fruit {
+    "id": string;
+    "tree_name": string;
+    "fruit_name": string;
+    "family": string;
+  }
 
   interface TData {
-    Movie: { releaseDate: string; actors: Array<{ name: string }> }
+    filterFruitsFam: Fruit[]
   }
 
   const data = await graphQLClient.rawRequest<TData>(query)