Mirror: The highly customizable and versatile GraphQL client with which you add on features like normalized caching as you grow.
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

(persisted-fetch) - pass document as a second argument to the generateHash option (#887)

* pass document as a second argument to the generateHash option

* add test to assert that formatDocument preserves custom properties

* assert hashFn is called with the correct arguments

* add build time generation to readme

authored by

Jovi De Croock and committed by
GitHub
1cdfbefb c4f24eed

+47 -4
+5
.changeset/cuddly-ligers-design.md
··· 1 + --- 2 + '@urql/exchange-persisted-fetch': minor 3 + --- 4 + 5 + Pass the parsed GraphQL-document as a second argument to the `generateHash` option.
+23 -1
exchanges/persisted-fetch/README.md
··· 28 28 persistedFetchExchange({ 29 29 /* optional config */ 30 30 }), 31 - fetchExchange 31 + fetchExchange, 32 32 ], 33 33 }); 34 34 ``` ··· 40 40 41 41 The `persistedFetchExchange` only handles queries, so for mutations we keep the 42 42 `fetchExchange` around alongside of it. 43 + 44 + ## Avoid hashing during runtime 45 + 46 + If you want to generate hashes at build-time you can use a [webpack-loader](https://github.com/leoasis/graphql-persisted-document-loader) to achieve this, 47 + when using this all you need to do in this exchange is the following: 48 + 49 + ```js 50 + import { createClient, dedupExchange, fetchExchange, cacheExchange } from 'urql'; 51 + import { persistedFetchExchange } from '@urql/exchange-persisted-fetch'; 52 + 53 + const client = createClient({ 54 + url: 'http://localhost:1234/graphql', 55 + exchanges: [ 56 + dedupExchange, 57 + cacheExchange, 58 + persistedFetchExchange({ 59 + generateHash: (_, document) => document.documentId, 60 + }), 61 + fetchExchange, 62 + ], 63 + }); 64 + ```
+10 -1
exchanges/persisted-fetch/src/persistedFetchExchange.test.ts
··· 205 205 json: () => expected, 206 206 }); 207 207 208 - const hashFn = () => Promise.resolve('hello'); 208 + const hashFn = jest.fn(() => Promise.resolve('hello')); 209 209 210 210 await pipe( 211 211 fromValue(queryOperation), ··· 225 225 }, 226 226 }, 227 227 }); 228 + const queryString = `query getUser($name: String) { 229 + user(name: $name) { 230 + id 231 + firstName 232 + lastName 233 + } 234 + } 235 + `; 236 + expect(hashFn).toBeCalledWith(queryString, queryOperation.query); 228 237 });
+3 -2
exchanges/persisted-fetch/src/persistedFetchExchange.ts
··· 27 27 makeFetchOptions, 28 28 makeFetchSource, 29 29 } from '@urql/core/internal'; 30 + import { DocumentNode } from 'graphql'; 30 31 31 32 import { hash } from './sha256'; 32 33 33 34 interface PersistedFetchExchangeOptions { 34 35 preferGetForPersistedQueries?: boolean; 35 - generateHash?: (query: string) => Promise<string>; 36 + generateHash?: (query: string, document: DocumentNode) => Promise<string>; 36 37 } 37 38 38 39 export const persistedFetchExchange = ( ··· 68 69 69 70 return pipe( 70 71 // Hash the given GraphQL query 71 - fromPromise(hashFn(query)), 72 + fromPromise(hashFn(query, operation.query)), 72 73 mergeMap(sha256Hash => { 73 74 // Attach SHA256 hash and remove query from body 74 75 body.query = undefined;
+6
packages/core/src/utils/typenames.test.ts
··· 49 49 expect(expectedKey).toBe(actualKey); 50 50 }); 51 51 52 + it('preserves custom properties', () => { 53 + const doc = parse(`{ id todos { id } }`) as any; 54 + doc.documentId = '123'; 55 + expect((formatDocument(doc) as any).documentId).toBe(doc.documentId); 56 + }); 57 + 52 58 it('adds typenames to a query string', () => { 53 59 expect(formatTypeNames(`{ todos { id } }`)).toMatchInlineSnapshot(` 54 60 "{