Merge branch 'main' into translate-activity

Author: hg-pyun

eslint-local-rules/__tests__/lint-markdown-code-blocks.test.js

@@ -11,12 +11,7 @@ const path = require('path');
 const {ESLint} = require('eslint');
 const plugin = require('..');
 
-const FIXTURES_DIR = path.join(
-  __dirname,
-  'fixtures',
-  'src',
-  'content'
-);
+const FIXTURES_DIR = path.join(__dirname, 'fixtures', 'src', 'content');
 const PARSER_PATH = path.join(__dirname, '..', 'parser.js');
 
 function createESLint({fix = false} = {}) {
@@ -53,11 +48,7 @@ async function lintFixture(name, {fix = false} = {}) {
 
 async function run() {
   const basicResult = await lintFixture('basic-error.md');
-  assert.strictEqual(
-    basicResult.messages.length,
-    1,
-    'expected one diagnostic'
-  );
+  assert.strictEqual(basicResult.messages.length, 1, 'expected one diagnostic');
   assert(
     basicResult.messages[0].message.includes('Calling setState during render'),
     'expected message to mention setState during render'
@@ -91,9 +82,7 @@ async function run() {
     fix: true,
   });
   assert(
-    duplicateFixed.output.includes(
-      "{expectedErrors: {'react-compiler': [4]}}"
-    ),
+    duplicateFixed.output.includes("{expectedErrors: {'react-compiler': [4]}}"),
     'expected duplicates to be rewritten to a single canonical block'
   );
   assert(
@@ -118,14 +107,12 @@ async function run() {
     fix: true,
   });
   assert(
-    malformedFixed.output.includes(
-      "{expectedErrors: {'react-compiler': [4]}}"
-    ),
+    malformedFixed.output.includes("{expectedErrors: {'react-compiler': [4]}}"),
     'expected malformed metadata to be replaced with canonical form'
   );
 }
 
-run().catch(error => {
+run().catch((error) => {
   console.error(error);
   process.exitCode = 1;
 });

eslint-local-rules/rules/metadata.js

@@ -84,15 +84,19 @@ function parseExpectedErrorsEntries(rawEntries) {
 
   if (parsed && typeof parsed === 'object') {
     for (const [key, value] of Object.entries(parsed)) {
-      entries[key] = normalizeEntryValues(Array.isArray(value) ? value.flat() : value);
+      entries[key] = normalizeEntryValues(
+        Array.isArray(value) ? value.flat() : value
+      );
     }
   }
 
   return entries;
 }
 
 function parseExpectedErrorsToken(tokenText) {
-  const match = tokenText.match(/^\{\s*expectedErrors\s*:\s*(\{[\s\S]*\})\s*\}$/);
+  const match = tokenText.match(
+    /^\{\s*expectedErrors\s*:\s*(\{[\s\S]*\})\s*\}$/
+  );
   if (!match) {
     return null;
   }
@@ -203,7 +207,9 @@ function cloneMetadata(metadata) {
 }
 
 function findExpectedErrorsToken(metadata) {
-  return metadata.tokens.find((token) => token.type === 'expectedErrors') || null;
+  return (
+    metadata.tokens.find((token) => token.type === 'expectedErrors') || null
+  );
 }
 
 function getCompilerExpectedLines(metadata) {

eslint-local-rules/rules/react-compiler.js

@@ -98,17 +98,19 @@ function runReactCompiler(code, filename) {
       continue;
     }
 
-    const loc = typeof detail.primaryLocation === 'function'
-      ? detail.primaryLocation()
-      : null;
+    const loc =
+      typeof detail.primaryLocation === 'function'
+        ? detail.primaryLocation()
+        : null;
 
     if (loc == null || typeof loc === 'symbol') {
       continue;
     }
 
-    const message = typeof detail.printErrorMessage === 'function'
-      ? detail.printErrorMessage(result.sourceCode, {eslint: true})
-      : detail.description || 'Unknown React Compiler error';
+    const message =
+      typeof detail.printErrorMessage === 'function'
+        ? detail.printErrorMessage(result.sourceCode, {eslint: true})
+        : detail.description || 'Unknown React Compiler error';
 
     diagnostics.push({detail, loc, message});
   }

next.config.js

@@ -36,6 +36,14 @@ const nextConfig = {
     // Don't bundle the shim unnecessarily.
     config.resolve.alias['use-sync-external-store/shim'] = 'react';
 
+    // ESLint depends on the CommonJS version of esquery,
+    // but Webpack loads the ESM version by default. This
+    // alias ensures the correct version is used.
+    //
+    // More info:
+    // https://github.com/reactjs/react.dev/pull/8115
+    config.resolve.alias['esquery'] = 'esquery/dist/esquery.min.js';
+
     const {IgnorePlugin, NormalModuleReplacementPlugin} = require('webpack');
     config.plugins.push(
       new NormalModuleReplacementPlugin(

src/components/MDX/Sandpack/runESLint.tsx

@@ -21,13 +21,6 @@ const getCodeMirrorPosition = (
 
 const linter = new Linter();
 
-// HACK! Eslint requires 'esquery' using `require`, but there's no commonjs interop.
-// because of this it tries to run `esquery.parse()`, while there's only `esquery.default.parse()`.
-// This hack places the functions in the right place.
-const esquery = require('esquery');
-esquery.parse = esquery.default?.parse;
-esquery.matches = esquery.default?.matches;
-
 const reactRules = require('eslint-plugin-react-hooks').rules;
 linter.defineRules({
   'react-hooks/rules-of-hooks': reactRules['rules-of-hooks'],