refactor(mdx-loader): make loader setup synchronous (AI-assisted) (facebook#12461)

Author: slorber

packages/docusaurus-mdx-loader/package.json

@@ -35,7 +35,7 @@
     "remark-emoji": "^5.0.2",
     "remark-frontmatter": "^5.0.0",
     "remark-gfm": "^4.0.1",
-    "stringify-object": "^6.0.0",
+    "stringify-object": "^7.0.0",
     "tslib": "^2.8.1",
     "unified": "^11.0.5",
     "unist-util-visit": "^5.1.0",
@@ -48,7 +48,6 @@
     "@types/escape-html": "^1.0.4",
     "@types/estree": "^1.0.9",
     "@types/mdast": "^4.0.4",
-    "@types/stringify-object": "^3.3.1",
     "@types/unist": "^3.0.3",
     "lodash": "^4.18.1",
     "mdast-util-directive": "3.1.0",

packages/docusaurus-mdx-loader/src/__tests__/processor.test.ts

@@ -69,6 +69,32 @@ describe('MDX processor', () => {
       const result = await processContent('## Heading', options);
       expect(result.content).toMatchSnapshot();
     });
+
+    it('reuses the processor when compiling files concurrently', async () => {
+      let pluginInitializations = 0;
+      const asyncPlugin: Plugin<[], Root> = () => {
+        pluginInitializations += 1;
+        return async (_tree, file) => {
+          await new Promise<void>((resolve) => setImmediate(resolve));
+          file.data.asyncPluginContent = file.toString();
+        };
+      };
+      const options = createOptions({
+        markdownConfig: {format},
+        remarkPlugins: [asyncPlugin],
+      });
+
+      const results = await Promise.all([
+        processContent('First document', options),
+        processContent('Second document', options),
+      ]);
+
+      expect(pluginInitializations).toBe(1);
+      expect(results.map((result) => result.data.asyncPluginContent)).toEqual([
+        'First document',
+        'Second document',
+      ]);
+    });
   });
 
   it.each([true, false])('supports emoji=%s', async (emoji) => {

packages/docusaurus-mdx-loader/src/createMDXLoader.ts

@@ -13,9 +13,7 @@ type CreateOptions = {
   useCrossCompilerCache?: boolean;
 };
 
-async function normalizeOptions(
-  optionsInput: Options & CreateOptions,
-): Promise<Options> {
+function normalizeOptions(optionsInput: Options & CreateOptions): Options {
   // Skip eager processor creation in tests
   if (process.env.NODE_ENV === 'test' || process.env.VITEST) {
     return optionsInput;
@@ -26,7 +24,7 @@ async function normalizeOptions(
   // We create the processor earlier here, to avoid the lazy processor creating
   // Lazy creation messes-up with Rsdoctor ability to measure mdx-loader perf
   if (!options.processors) {
-    options = {...options, processors: await createProcessors({options})};
+    options = {...options, processors: createProcessors({options})};
   }
 
   // Cross-compiler cache permits to compile client/server MDX only once
@@ -43,25 +41,25 @@ async function normalizeOptions(
   return options;
 }
 
-export async function createMDXLoaderItem(
+export function createMDXLoaderItem(
   options: Options & CreateOptions,
-): Promise<RuleSetUseItem> {
+): RuleSetUseItem {
   return {
     loader: require.resolve('./index'),
-    options: await normalizeOptions(options),
+    options: normalizeOptions(options),
   };
 }
 
-export async function createMDXLoaderRule({
+export function createMDXLoaderRule({
   include,
   options,
 }: {
   include: RuleSetRule['include'];
   options: Options & CreateOptions;
-}): Promise<RuleSetRule> {
+}): RuleSetRule {
   return {
     test: /\.mdx?$/i,
     include,
-    use: [await createMDXLoaderItem(options)],
+    use: [createMDXLoaderItem(options)],
   };
 }

packages/docusaurus-mdx-loader/src/loader.ts

@@ -21,13 +21,7 @@ import {
 import type {WebpackCompilerName} from '@docusaurus/utils';
 import type {Options} from './options';
 import type {LoaderContext} from 'webpack';
-
-// TODO as of April 2023, no way to import/re-export this ESM type easily :/
-// This might change soon, likely after TS 5.2
-// See https://github.com/microsoft/TypeScript/issues/49721#issuecomment-1517839391
-type Pluggable = any; // TODO fix this asap
-
-export type MDXPlugin = Pluggable;
+export type {MDXPlugin} from './processor';
 
 async function loadMDX({
   fileContent,