Merge pull request #2791 from Shopify/dep-update-jn-11

Update typescript, eslint, and prettier
Shopify · Jun 18, 2024 · a098a21 · a098a21
2 parents 7d9ff92 + d691952
commit a098a21
Show file tree

Hide file tree

Showing 53 changed files with 1,614 additions and 1,743 deletions.
diff --git a/.changeset/sour-spoons-invent.md b/.changeset/sour-spoons-invent.md
@@ -0,0 +1,28 @@
+---
+'graphql-typescript-definitions': minor
+'graphql-validate-fixtures': minor
+'graphql-mini-transforms': minor
+'graphql-fixtures': minor
+'@shopify/react-form-state': minor
+'@shopify/graphql-testing': minor
+'@shopify/koa-performance': minor
+'@shopify/jest-dom-mocks': minor
+'@shopify/jest-koa-mocks': minor
+'graphql-typed': minor
+'@shopify/react-graphql': minor
+'@shopify/react-network': minor
+'@shopify/react-testing': minor
+'@shopify/react-effect': minor
+'@shopify/react-server': minor
+'@shopify/useful-types': minor
+'@shopify/koa-metrics': minor
+'@shopify/react-async': minor
+'@shopify/react-hooks': minor
+'@shopify/react-form': minor
+'@shopify/react-html': minor
+'@shopify/react-i18n': minor
+'@shopify/web-worker': minor
+'@shopify/name': minor
+---
+
+Update typescript, eslint, and prettier
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -55,6 +55,10 @@ module.exports = {
     {
       files: ['**/*.ts', '**/*.tsx'],
       rules: {
+        '@typescript-eslint/consistent-indexed-object-style': [
+          'error',
+          'index-signature',
+        ],
         // Enforce camelCase naming convention and PascalCase class and interface names
         '@typescript-eslint/naming-convention': [
           'error',

diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v18.16.0
+v18.20.0
diff --git a/config/typescript/tsconfig.base.json b/config/typescript/tsconfig.base.json
@@ -11,6 +11,8 @@
     "lib": ["dom", "dom.iterable", "es2022"],
     "module": "es2022",
     "jsx": "react",
+    "target": "es2022",
+    "moduleResolution": "node",
 
     // Strictness
     // Strict mode enables these options.

diff --git a/dev.yml b/dev.yml
@@ -2,8 +2,8 @@ name: quilt
 type: node
 up:
   - node:
-      version: v18.16.0
-      yarn: v1.22.15
+      version: v18.20.0
+      yarn: v1.22.22
 commands:
   __default__: start
   build: yarnpkg build

diff --git a/package.json b/package.json
@@ -38,17 +38,17 @@
     "@babel/preset-env": "^7.24.7",
     "@babel/preset-react": "^7.16.0",
     "@babel/preset-typescript": "^7.16.0",
-    "@changesets/changelog-github": "^0.4.7",
-    "@changesets/cli": "^2.25.0",
+    "@changesets/changelog-github": "^0.5.0",
+    "@changesets/cli": "^2.27.5",
     "@faker-js/faker": "^8.0.0",
     "@rollup/plugin-babel": "^5.3.0",
     "@rollup/plugin-commonjs": "^19.0.0",
     "@rollup/plugin-node-resolve": "^13.0.0",
     "@shopify/app-bridge": "^2.0.3",
-    "@shopify/eslint-plugin": "^42.0.1",
-    "@tsconfig/node-lts": "^18.12.1",
+    "@shopify/eslint-plugin": "^45.0.0",
+    "@tsconfig/node-lts": "^20.1.3",
     "@tsconfig/strictest": "^2.0.0",
-    "@tsd/typescript": "^4.9.5",
+    "@tsd/typescript": "^5.4.5",
     "@types/babel__core": "^7.1.7",
     "@types/jest": "^29.4.0",
     "@types/react": "^18.0.0",
@@ -57,7 +57,7 @@
     "babel-loader": "^8.0.6",
     "core-js": "^3.14.0",
     "cross-fetch": "^3.0.4",
-    "eslint": "^8.9.0",
+    "eslint": "^8.57.0",
     "fs-extra": "^9.1.0",
     "get-port": "^5.0.0",
     "glob": "^7.1.6",
@@ -70,7 +70,7 @@
     "jest-watch-typeahead": "^2.2.2",
     "npm-run-all": "^4.1.5",
     "plop": "^2.6.0",
-    "prettier": "~2.8.6",
+    "prettier": "~3.3.2",
     "puppeteer": "^13.2.0",
     "react": "^18.1.0",
     "react-dom": "^18.1.0",
@@ -79,7 +79,7 @@
     "rimraf": "^2.6.2",
     "rollup": "^2.60.1",
     "rollup-plugin-node-externals": "^2.2.0",
-    "typescript": "~5.0.2",
+    "typescript": "~5.4.5",
     "yalc": "^1.0.0-pre.50"
   },
   "resolutions": {

diff --git a/packages/graphql-fixtures/src/fill.ts b/packages/graphql-fixtures/src/fill.ts
@@ -76,31 +76,32 @@ export type DeepThunk<Request, T> =
 export type GraphQLFillerData<
   Operation extends GraphQLOperation,
   Request = undefined,
-> = Operation extends GraphQLOperation<
-  infer Data,
-  infer Variables,
-  infer PartialData
->
-  ? Thunk<
-      undefined extends Request
-        ? GraphQLRequest<
-            Data,
-            undefined extends Variables ? {} : Variables,
-            PartialData
-          >
-        : Request,
-      DeepThunk<
+> =
+  Operation extends GraphQLOperation<
+    infer Data,
+    infer Variables,
+    infer PartialData
+  >
+    ? Thunk<
         undefined extends Request
           ? GraphQLRequest<
               Data,
               undefined extends Variables ? {} : Variables,
               PartialData
             >
           : Request,
-        PartialData
+        DeepThunk<
+          undefined extends Request
+            ? GraphQLRequest<
+                Data,
+                undefined extends Variables ? {} : Variables,
+                PartialData
+              >
+            : Request,
+          PartialData
+        >
       >
-    >
-  : never;
+    : never;
 
 export interface Options<
   Request extends GraphQLRequest<any, any, any> | null = GraphQLRequest<

diff --git a/packages/graphql-mini-transforms/src/webpack-loader.ts b/packages/graphql-mini-transforms/src/webpack-loader.ts
@@ -83,11 +83,11 @@ async function loadDocument(
       const source = await new Promise<string>((resolve, reject) => {
         loader.fs.readFile(
           resolvedPath,
-          (error: Error | null, result: string) => {
+          (error: Error | null, result?: Buffer) => {
             if (error) {
               reject(error);
             } else {
-              resolve(result);
+              resolve(result ? result.toString() : '');
             }
           },
         );

diff --git a/packages/graphql-testing/src/tests/e2e.test.tsx b/packages/graphql-testing/src/tests/e2e.test.tsx
@@ -359,7 +359,7 @@ describe('graphql-testing', () => {
           {cursor: 'd', node: {__typename: 'Cat', name: 'Not Odie'}},
         ].map((item) => ({__typename: 'Edge', ...item}));
 
-        // eslint-disable-next-line jest/no-if
+        // eslint-disable-next-line jest/no-conditional-in-test
         const startPosition = after
           ? fullData.findIndex((item) => item.cursor === after) + 1
           : 0;
@@ -571,6 +571,7 @@ describe('graphql-testing', () => {
         );
 
         useEffect(() => {
+          /* eslint-disable jest/no-conditional-in-test */
           if (petData?.pet) {
             (async () => {
               const personData = await client.query({
@@ -580,6 +581,7 @@ describe('graphql-testing', () => {
               setPersonData(personData.data.person);
             })();
           }
+          /* eslint-enable jest/no-conditional-in-test */
         }, [client, petData?.pet]);
 
         return <div>{personData?.name}</div>;

diff --git a/packages/graphql-typed/src/index.ts b/packages/graphql-typed/src/index.ts
@@ -27,25 +27,14 @@ export interface SimpleDocument<Data = {}, Variables = {}, DeepPartial = {}>
   readonly source: string;
 }
 
-export type GraphQLData<T> = T extends GraphQLOperation<infer Data, any, any>
-  ? Data
-  : never;
+export type GraphQLData<T> =
+  T extends GraphQLOperation<infer Data, any, any> ? Data : never;
 
-export type GraphQLVariables<T> = T extends GraphQLOperation<
-  any,
-  infer Variables,
-  any
->
-  ? Variables
-  : never;
+export type GraphQLVariables<T> =
+  T extends GraphQLOperation<any, infer Variables, any> ? Variables : never;
 
-export type GraphQLDeepPartial<T> = T extends GraphQLOperation<
-  any,
-  any,
-  infer DeepPartial
->
-  ? DeepPartial
-  : never;
+export type GraphQLDeepPartial<T> =
+  T extends GraphQLOperation<any, any, infer DeepPartial> ? DeepPartial : never;
 
 export const parse: <Data = {}, Variables = {}, DeepPartial = {}>(
   source: string | Source,

diff --git a/packages/graphql-typescript-definitions/src/index.ts b/packages/graphql-typescript-definitions/src/index.ts
@@ -408,9 +408,8 @@ export class Builder extends EventEmitter {
     filesystem: GraphQLFilesystem,
     projectConfig: GraphQLProjectConfig,
   ) {
-    const filePaths = await filesystem.getGraphQLProjectIncludedFilePaths(
-      projectConfig,
-    );
+    const filePaths =
+      await filesystem.getGraphQLProjectIncludedFilePaths(projectConfig);
 
     return Promise.all(
       filePaths.map((filePath) =>

diff --git a/packages/graphql-validate-fixtures/src/index.ts b/packages/graphql-validate-fixtures/src/index.ts
@@ -51,9 +51,8 @@ export async function evaluateFixtures(
 async function getOperationsForProject(
   projectConfig: GraphQLProjectConfig,
 ): Promise<GraphQLProjectAST> {
-  const operationPaths = await getGraphQLProjectIncludedFilePaths(
-    projectConfig,
-  );
+  const operationPaths =
+    await getGraphQLProjectIncludedFilePaths(projectConfig);
 
   const operationSources = await Promise.all(
     operationPaths.map(loadOperationSource),

diff --git a/packages/jest-dom-mocks/src/intersection-observer.ts b/packages/jest-dom-mocks/src/intersection-observer.ts
@@ -47,9 +47,8 @@ export default class IntersectionObserverMock {
       (this.observers = setter(this.observers));
 
     /* eslint-disable @typescript-eslint/no-extraneous-class */
-    (
-      global as any
-    ).IntersectionObserverEntry = class IntersectionObserverEntry {};
+    (global as any).IntersectionObserverEntry =
+      class IntersectionObserverEntry {};
     /* eslint-enable @typescript-eslint/no-extraneous-class */
     Object.defineProperty(
       IntersectionObserverEntry.prototype,

diff --git a/packages/jest-dom-mocks/src/tests/dimension.test.ts b/packages/jest-dom-mocks/src/tests/dimension.test.ts
@@ -71,6 +71,7 @@ describe('Dimension mocks', () => {
 
       dimension.mock({
         scrollWidth(element) {
+          /* eslint-disable-next-line jest/no-conditional-in-test */
           return element.id === 'testId' ? 200 : 0;
         },
       });

diff --git a/packages/jest-koa-mocks/package.json b/packages/jest-koa-mocks/package.json
@@ -27,7 +27,7 @@
     "node-mocks-http": "^1.11.0"
   },
   "devDependencies": {
-    "@types/express": "^4.11.1",
+    "@types/express": "^4.17.21",
     "@types/koa": "^2.0.0"
   },
   "sideEffects": false,

diff --git a/packages/jest-koa-mocks/src/create-mock-context/create-mock-context.ts b/packages/jest-koa-mocks/src/create-mock-context/create-mock-context.ts
@@ -103,7 +103,8 @@ export default function createContext<
 
   res.set = undefined as any;
 
-  const context = app.createContext(req, res) as MockContext & CustomProperties;
+  const context = app.createContext(req, res as any) as MockContext &
+    CustomProperties;
   Object.assign(context, extensions);
   context.cookies = createMockCookies(cookies);
 

diff --git a/packages/koa-metrics/src/tests/middleware.test.ts b/packages/koa-metrics/src/tests/middleware.test.ts
@@ -226,9 +226,11 @@ describe('koa-metrics', () => {
         ctx.response.length = length;
         const originalGet = ctx.response.get;
         ctx.response.get = (headerName) => {
+          /* eslint-disable jest/no-conditional-in-test */
           if (headerName === 'Content-Length') {
             return String(length);
           }
+          /* eslint-enable jest/no-conditional-in-test */
           return originalGet(headerName);
         };
       });
@@ -272,9 +274,11 @@ describe('koa-metrics', () => {
         ctx.response.length = 7500;
         const originalGet = ctx.response.get;
         ctx.response.get = (headerName) => {
+          /* eslint-disable jest/no-conditional-in-test */
           if (headerName === 'Content-Length') {
             return '7500';
           }
+          /* eslint-enable jest/no-conditional-in-test */
           return originalGet(headerName);
         };
       });

diff --git a/packages/koa-performance/src/tests/middleware.test.ts b/packages/koa-performance/src/tests/middleware.test.ts
@@ -703,8 +703,8 @@ type DeepPartial<T> = {
   [K in keyof T]?: T[K] extends any[]
     ? T[K]
     : T[K] extends object
-    ? DeepPartial<T[K]>
-    : T[K];
+      ? DeepPartial<T[K]>
+      : T[K];
 };
 
 function createBody({

diff --git a/packages/name/src/tests/tryAbbreviateBusinessName.test.ts b/packages/name/src/tests/tryAbbreviateBusinessName.test.ts
@@ -69,7 +69,7 @@ describe('tryAbbreviateBusinessName()', () => {
         idealMaxLength: testCase.idealMaxLength,
       });
       // UNLESS Node version ≤ 14, in which case returns undefined as Intl.Segmenter is not available in this context
-      // eslint-disable-next-line jest/no-if
+      // eslint-disable-next-line jest/no-conditional-in-test
       if (nodeMajorVersion() <= 14) {
         // eslint-disable-next-line jest/no-conditional-expect
         expect(abbreviatedName).toBeUndefined();
@@ -112,7 +112,7 @@ describe('tryAbbreviateBusinessName()', () => {
         name: testCase.name,
       });
       // UNLESS Node version ≤ 14, in which case returns undefined as Intl.Segmenter is not available in this context
-      // eslint-disable-next-line jest/no-if
+      // eslint-disable-next-line jest/no-conditional-in-test
       if (nodeMajorVersion() <= 14) {
         // eslint-disable-next-line jest/no-conditional-expect
         expect(abbreviatedName).toBeUndefined();
@@ -143,7 +143,7 @@ describe('tryAbbreviateBusinessName()', () => {
         idealMaxLength: testCase.idealMaxLength,
       });
       // UNLESS Node version ≤ 14, in which case returns undefined as Intl.Segmenter is not available in this context
-      // eslint-disable-next-line jest/no-if
+      // eslint-disable-next-line jest/no-conditional-in-test
       if (nodeMajorVersion() <= 14) {
         // eslint-disable-next-line jest/no-conditional-expect
         expect(abbreviatedName).toBeUndefined();