+5

.changeset/mean-onions-share.md

reviewed

··· 1 1 + --- 2 2 + '@urql/exchange-graphcache': minor 3 3 + --- 4 4 + 5 5 + Allow the user to debug cache-misses by means of the new `logger` interface on the `cacheExchange`. A field miss will dispatch a `debug` log when it's not marked with `@_optional` or when it's non-nullable in the `schema`.

+76

exchanges/graphcache/src/cacheExchange.test.ts

reviewed

··· 110 110 expect(result.mock.calls[1][0].data).toBe(result.mock.calls[0][0].data); 111 111 }); 112 112 113 113 + it('logs cache misses', () => { 114 114 + const client = createClient({ 115 115 + url: 'http://0.0.0.0', 116 116 + exchanges: [], 117 117 + }); 118 118 + const op = client.createRequestOperation('query', { 119 119 + key: 1, 120 120 + query: queryOne, 121 121 + variables: undefined, 122 122 + }); 123 123 + 124 124 + const expected = { 125 125 + __typename: 'Query', 126 126 + author: { 127 127 + id: '123', 128 128 + name: 'Author', 129 129 + __typename: 'Author', 130 130 + }, 131 131 + unrelated: { 132 132 + id: 'unrelated', 133 133 + __typename: 'Unrelated', 134 134 + }, 135 135 + }; 136 136 + 137 137 + const response = vi.fn((forwardOp: Operation): OperationResult => { 138 138 + expect(forwardOp.key).toBe(op.key); 139 139 + return { ...queryResponse, operation: forwardOp, data: expected }; 140 140 + }); 141 141 + 142 142 + const { source: ops$, next } = makeSubject<Operation>(); 143 143 + const result = vi.fn(); 144 144 + const forward: ExchangeIO = ops$ => pipe(ops$, map(response), share); 145 145 + 146 146 + const messages: string[] = []; 147 147 + pipe( 148 148 + cacheExchange({ 149 149 + logger(severity, message) { 150 150 + if (severity === 'debug') { 151 151 + messages.push(message); 152 152 + } 153 153 + }, 154 154 + })({ forward, client, dispatchDebug })(ops$), 155 155 + tap(result), 156 156 + publish 157 157 + ); 158 158 + 159 159 + next(op); 160 160 + next(op); 161 161 + next({ 162 162 + ...op, 163 163 + query: gql` 164 164 + query ($id: ID!) { 165 165 + author(id: $id) { 166 166 + id 167 167 + name 168 168 + } 169 169 + } 170 170 + `, 171 171 + variables: { id: '123' }, 172 172 + }); 173 173 + expect(response).toHaveBeenCalledTimes(1); 174 174 + expect(result).toHaveBeenCalledTimes(2); 175 175 + 176 176 + expect(expected).toMatchObject(result.mock.calls[0][0].data); 177 177 + expect(result.mock.calls[1][0]).toHaveProperty( 178 178 + 'operation.context.meta.cacheOutcome', 179 179 + 'hit' 180 180 + ); 181 181 + expect(expected).toMatchObject(result.mock.calls[1][0].data); 182 182 + expect(result.mock.calls[1][0].data).toBe(result.mock.calls[0][0].data); 183 183 + expect(messages).toEqual([ 184 184 + 'No value for field "author" on entity "Query"', 185 185 + 'No value for field "author" with args {"id":"123"} on entity "Query"', 186 186 + ]); 187 187 + }); 188 188 + 113 189 it('respects cache-only operations', () => { 114 190 const client = createClient({ 115 191 url: 'http://0.0.0.0',

+24

exchanges/graphcache/src/operations/query.ts

reviewed

··· 537 537 ctx.partial = true; 538 538 dataFieldValue = null; 539 539 } else if (dataFieldValue === null && directives.required) { 540 540 + if ( 541 541 + ctx.store.logger && 542 542 + process.env.NODE_ENV !== 'production' && 543 543 + InMemoryData.currentOperation === 'read' 544 544 + ) { 545 545 + ctx.store.logger( 546 546 + 'debug', 547 547 + `Got value "null" for required field "${fieldName}"${ 548 548 + fieldArgs ? ` with args ${JSON.stringify(fieldArgs)}` : '' 549 549 + } on entity "${entityKey}"` 550 550 + ); 551 551 + } 540 552 dataFieldValue = undefined; 541 553 } else { 542 554 hasFields = hasFields || fieldName !== '__typename'; ··· 551 563 } else if (deferRef) { 552 564 hasNext = true; 553 565 } else { 566 566 + if ( 567 567 + ctx.store.logger && 568 568 + process.env.NODE_ENV !== 'production' && 569 569 + InMemoryData.currentOperation === 'read' 570 570 + ) { 571 571 + ctx.store.logger( 572 572 + 'debug', 573 573 + `No value for field "${fieldName}"${ 574 574 + fieldArgs ? ` with args ${JSON.stringify(fieldArgs)}` : '' 575 575 + } on entity "${entityKey}"` 576 576 + ); 577 577 + } 554 578 // If the field isn't deferred or partial then we have to abort and also reset 555 579 // the partial field 556 580 ctx.partial = hasPartials;