Mirror: The highly customizable and versatile GraphQL client with which you add on features like normalized caching as you grow.
fix: ignore empty relay pagination pages (#2431)
* add failing test
* fix: #2430 ignore empty pages in relayPagination
* add test covering && typename branch of conditional
* Create fluffy-toys-live.md
Co-authored-by: Jovi De Croock <decroockjovi@gmail.com>
authored by
Tim Griesser
Jovi De Croock
and committed by
GitHub
6b691388
a0ca786b
+167
+5
.changeset/fluffy-toys-live.md
+5
.changeset/fluffy-toys-live.md
+159
exchanges/graphcache/src/extras/relayPagination.test.ts
+159
exchanges/graphcache/src/extras/relayPagination.test.ts
···
1319
1319
expect(res.partial).toBe(false);
1320
1320
expect(res.data).toEqual(pageTwo);
1321
1321
});
1322
+
1323
+
it('ignores empty pages when paginating', () => {
1324
+
const PaginationForward = gql`
1325
+
query($first: Int!, $after: String) {
1326
+
__typename
1327
+
items(first: $first, after: $after) {
1328
+
__typename
1329
+
nodes {
1330
+
__typename
1331
+
id
1332
+
}
1333
+
pageInfo {
1334
+
__typename
1335
+
startCursor
1336
+
endCursor
1337
+
}
1338
+
}
1339
+
}
1340
+
`;
1341
+
const PaginationBackward = gql`
1342
+
query($last: Int!, $before: String) {
1343
+
__typename
1344
+
items(last: $last, before: $before) {
1345
+
__typename
1346
+
nodes {
1347
+
__typename
1348
+
id
1349
+
}
1350
+
pageInfo {
1351
+
__typename
1352
+
startCursor
1353
+
endCursor
1354
+
}
1355
+
}
1356
+
}
1357
+
`;
1358
+
1359
+
const store = new Store({
1360
+
resolvers: {
1361
+
Query: {
1362
+
items: relayPagination(),
1363
+
},
1364
+
},
1365
+
});
1366
+
1367
+
const forwardOne = {
1368
+
__typename: 'Query',
1369
+
items: {
1370
+
__typename: 'ItemsConnection',
1371
+
nodes: [itemNode(1), itemNode(2)],
1372
+
pageInfo: {
1373
+
__typename: 'PageInfo',
1374
+
startCursor: '1',
1375
+
endCursor: '2',
1376
+
},
1377
+
},
1378
+
};
1379
+
const forwardAfter = {
1380
+
__typename: 'Query',
1381
+
items: {
1382
+
__typename: 'ItemsConnection',
1383
+
nodes: [],
1384
+
pageInfo: {
1385
+
__typename: 'PageInfo',
1386
+
startCursor: null,
1387
+
endCursor: null,
1388
+
},
1389
+
},
1390
+
};
1391
+
const backwardBefore = {
1392
+
__typename: 'Query',
1393
+
items: {
1394
+
__typename: 'ItemsConnection',
1395
+
nodes: [],
1396
+
pageInfo: {
1397
+
__typename: 'PageInfo',
1398
+
startCursor: null,
1399
+
endCursor: null,
1400
+
},
1401
+
},
1402
+
};
1403
+
1404
+
write(
1405
+
store,
1406
+
{ query: PaginationForward, variables: { first: 2 } },
1407
+
forwardOne
1408
+
);
1409
+
write(
1410
+
store,
1411
+
{ query: PaginationBackward, variables: { last: 1, before: '1' } },
1412
+
backwardBefore
1413
+
);
1414
+
1415
+
const res = query(store, {
1416
+
query: PaginationForward,
1417
+
variables: { first: 2 },
1418
+
});
1419
+
1420
+
expect(res.partial).toBe(false);
1421
+
expect(res.data).toEqual(forwardOne);
1422
+
write(
1423
+
store,
1424
+
{ query: PaginationForward, variables: { first: 1, after: '2' } },
1425
+
forwardAfter
1426
+
);
1427
+
1428
+
expect(res.partial).toBe(false);
1429
+
expect(res.data).toEqual(forwardOne);
1430
+
});
1431
+
1432
+
it('allows for an empty page when this is the only result', () => {
1433
+
const Pagination = gql`
1434
+
query($first: Int!, $after: String) {
1435
+
__typename
1436
+
items(first: $first, after: $after) {
1437
+
__typename
1438
+
nodes {
1439
+
__typename
1440
+
id
1441
+
}
1442
+
pageInfo {
1443
+
__typename
1444
+
startCursor
1445
+
endCursor
1446
+
}
1447
+
}
1448
+
}
1449
+
`;
1450
+
1451
+
const store = new Store({
1452
+
resolvers: {
1453
+
Query: {
1454
+
items: relayPagination(),
1455
+
},
1456
+
},
1457
+
});
1458
+
1459
+
const pageOne = {
1460
+
__typename: 'Query',
1461
+
items: {
1462
+
__typename: 'ItemsConnection',
1463
+
nodes: [],
1464
+
pageInfo: {
1465
+
__typename: 'PageInfo',
1466
+
startCursor: null,
1467
+
endCursor: null,
1468
+
},
1469
+
},
1470
+
};
1471
+
1472
+
write(store, { query: Pagination, variables: { first: 2 } }, pageOne);
1473
+
const res = query(store, {
1474
+
query: Pagination,
1475
+
variables: { first: 2 },
1476
+
});
1477
+
1478
+
expect(res.partial).toBe(false);
1479
+
expect(res.data).toEqual(pageOne);
1480
+
});