[ESLint] enable promise/prefer-await-to-then for non React packages (#3120)

Co-authored-by: Ted Thibodeau Jr <tthibodeau@openlinksw.com>

Author: dimaMachina

.changeset/tasty-glasses-report.md

@@ -0,0 +1,9 @@
+---
+'@graphiql/toolkit': patch
+'graphql-language-service-server': patch
+'monaco-graphql': patch
+'vscode-graphql': patch
+'vscode-graphql-execution': patch
+---
+
+prefer await to then

.eslintrc.js

@@ -366,5 +366,13 @@ module.exports = {
         'import/no-unresolved': ['error', { ignore: ['^node:', 'vscode'] }],
       },
     },
+    {
+      files: ['packages/**'],
+      // ignore React packages because it's ugly to have `async IIFE` inside `useEffect`
+      excludedFiles: ['packages/graphiql/**', 'packages/graphiql-react/**'],
+      rules: {
+        'promise/prefer-await-to-then': 'error',
+      },
+    },
   ],
 };

packages/graphiql-toolkit/src/async-helpers/index.ts

@@ -52,42 +52,34 @@ export function isAsyncIterable(
   );
 }
 
-function asyncIterableToPromise<T>(
+async function asyncIterableToPromise<T>(
   input: AsyncIterable<T> | AsyncIterableIterator<T>,
 ): Promise<T> {
-  return new Promise((resolve, reject) => {
-    // Also support AsyncGenerator on Safari iOS.
-    // As mentioned in the isAsyncIterable function there is no Symbol.asyncIterator available
-    // so every AsyncIterable must be implemented using AsyncGenerator.
-    const iteratorReturn = (
-      'return' in input ? input : input[Symbol.asyncIterator]()
-    ).return?.bind(input);
-    const iteratorNext = (
-      'next' in input ? input : input[Symbol.asyncIterator]()
-    ).next.bind(input);
+  // Also support AsyncGenerator on Safari iOS.
+  // As mentioned in the isAsyncIterable function, there is no Symbol.asyncIterator available,
+  // so every AsyncIterable must be implemented using AsyncGenerator.
+  const iteratorReturn = (
+    'return' in input ? input : input[Symbol.asyncIterator]()
+  ).return?.bind(input);
+  const iteratorNext = (
+    'next' in input ? input : input[Symbol.asyncIterator]()
+  ).next.bind(input);
 
-    iteratorNext()
-      .then(result => {
-        resolve(result.value);
-        // ensure cleanup
-        void iteratorReturn?.();
-      })
-      .catch(err => {
-        reject(err);
-      });
-  });
+  const result = await iteratorNext();
+  // ensure cleanup
+  void iteratorReturn?.();
+  return result.value;
 }
 
-export function fetcherReturnToPromise(
+export async function fetcherReturnToPromise(
   fetcherResult: FetcherReturnType,
 ): Promise<FetcherResult> {
-  return Promise.resolve(fetcherResult).then(result => {
-    if (isAsyncIterable(result)) {
-      return asyncIterableToPromise(result);
-    }
-    if (isObservable(result)) {
-      return observableToPromise(result);
-    }
-    return result;
-  });
+  const result = await fetcherResult;
+  if (isAsyncIterable(result)) {
+    return asyncIterableToPromise(result);
+  }
+  if (isObservable(result)) {
+    return observableToPromise(result);
+  }
+  return result;
 }

packages/graphql-language-service-cli/src/cli.ts

@@ -117,21 +117,22 @@ if (command === 'server') {
   });
 
   const options: { [key: string]: any } = {};
-  if (argv?.port) {
+  if (argv.port) {
     options.port = argv.port;
   }
-  if (argv?.method) {
+  if (argv.method) {
     options.method = argv.method;
   }
-  if (argv?.configDir) {
+  if (argv.configDir) {
     options.configDir = argv.configDir;
   }
+  // eslint-disable-next-line promise/prefer-await-to-then -- don't know if I can use top level await here
   startServer(options).catch(error => {
     const logger = new Logger();
     logger.error(String(error));
   });
 } else {
-  client(command as string, argv as { [key: string]: string });
+  client(command as string, argv as Record<string, string>);
 }
 
 // Exit the process when stream closes from remote end.

packages/graphql-language-service-server/src/GraphQLCache.ts

@@ -679,33 +679,32 @@ export class GraphQLCache implements GraphQLCacheInterface {
     const responses: GraphQLFileInfo[] = [];
     while (queue.length) {
       const chunk = queue.splice(0, MAX_READS);
-      const promises = chunk.map(fileInfo =>
-        this.promiseToReadGraphQLFile(fileInfo.filePath)
-          .catch(error => {
-            // eslint-disable-next-line no-console
-            console.log('pro', error);
-            /**
-             * fs emits `EMFILE | ENFILE` error when there are too many
-             * open files - this can cause some fragment files not to be
-             * processed.  Solve this case by implementing a queue to save
-             * files failed to be processed because of `EMFILE` error,
-             * and await on Promises created with the next batch from the
-             * queue.
-             */
-            if (error.code === 'EMFILE' || error.code === 'ENFILE') {
-              queue.push(fileInfo);
-            }
-          })
-          .then((response: GraphQLFileInfo | void) => {
-            if (response) {
-              responses.push({
-                ...response,
-                mtime: fileInfo.mtime,
-                size: fileInfo.size,
-              });
-            }
-          }),
-      );
+      const promises = chunk.map(async fileInfo => {
+        try {
+          const response = await this.promiseToReadGraphQLFile(
+            fileInfo.filePath,
+          );
+          responses.push({
+            ...response,
+            mtime: fileInfo.mtime,
+            size: fileInfo.size,
+          });
+        } catch (error: any) {
+          // eslint-disable-next-line no-console
+          console.log('pro', error);
+          /**
+           * fs emits `EMFILE | ENFILE` error when there are too many
+           * open files - this can cause some fragment files not to be
+           * processed.  Solve this case by implementing a queue to save
+           * files failed to be processed because of `EMFILE` error,
+           * and await on Promises created with the next batch from the
+           * queue.
+           */
+          if (error.code === 'EMFILE' || error.code === 'ENFILE') {
+            queue.push(fileInfo);
+          }
+        }
+      });
       await Promise.all(promises); // eslint-disable-line no-await-in-loop
     }
 

packages/graphql-language-service-server/src/__tests__/MessageProcessor-test.ts

@@ -270,10 +270,10 @@ describe('MessageProcessor', () => {
     const params = { textDocument: initialDocument.textDocument, position };
 
     // Should throw because file has been deleted from cache
-    return messageProcessor
-      .handleCompletionRequest(params)
-      .then(result => expect(result).toEqual(null))
-      .catch(() => {});
+    try {
+      const result = await messageProcessor.handleCompletionRequest(params);
+      expect(result).toEqual(null);
+    } catch {}
   });
 
   // modified to work with jest.mock() of WatchmanClient

packages/graphql-language-service-server/src/startServer.ts

@@ -170,22 +170,21 @@ export default async function startServer(
 
         const { port, hostname } = options;
         const socket = net
-          .createServer(client => {
+          .createServer(async client => {
             client.setEncoding('utf8');
             reader = new SocketMessageReader(client);
             writer = new SocketMessageWriter(client);
             client.on('end', () => {
               socket.close();
               process.exit(0);
             });
-            return initializeHandlers({
+            const s = await initializeHandlers({
               reader,
               writer,
               logger,
               options: finalOptions,
-            }).then(s => {
-              s.listen();
             });
+            s.listen();
           })
           .listen(port, hostname);
         return;

packages/monaco-graphql/src/initializeMode.ts

@@ -28,6 +28,8 @@ export function initializeMode(
     api = createMonacoGraphQLAPI(LANGUAGE_ID, config);
     (<any>languages).graphql = { api };
     // export to the global monaco API
+
+    // eslint-disable-next-line promise/prefer-await-to-then -- ignore to leave initializeMode sync
     void getMode().then(mode => mode.setupMode(api));
   }
 

packages/vscode-graphql-execution/src/providers/exec-content.ts

@@ -108,11 +108,10 @@ export class GraphQLContentProvider implements TextDocumentContentProvider {
       enableScripts: true,
     };
 
-    this.loadProvider()
-      .then()
-      .catch(err => {
-        this.html = err.toString();
-      });
+    // eslint-disable-next-line promise/prefer-await-to-then -- can't use async in constructor
+    this.loadProvider().catch(err => {
+      this.html = err.toString();
+    });
   }
 
   validUrlFromSchema(pathOrUrl: string) {

packages/vscode-graphql/src/server/index.ts

@@ -6,11 +6,13 @@ import { startServer } from 'graphql-language-service-server';
 // The npm scripts are configured to only build this once before
 // watching the extension, so please restart the extension debugger for changes!
 
-const start = () => {
-  startServer({ method: 'node' }).catch(err => {
+async function start() {
+  try {
+    await startServer({ method: 'node' });
+  } catch (err) {
     // eslint-disable-next-line no-console
     console.error(err);
-  });
-};
+  }
+}
 
-start();
+void start();