From 712dbbc2d55e8614b16fbca55d3a38dcf2e3bd72 Mon Sep 17 00:00:00 2001
From: Jack Hsu <jack.hsu@gmail.com>
Date: Thu, 8 Aug 2024 11:29:55 -0400
Subject: [PATCH] fix(webpack): return proper webpack plugin from
 useLegacyNxPlugin function (#27340)

The current `useLegacyNxPlugin` has two issues:
1. It doesn't pass the configuration object, but rather the compiler
instance.
2. It doesn't handle async correctly

This PR resolves both issues.

<!-- If this is a particularly complex change or feature addition, you
can request a dedicated Nx release for this pull request branch. Mention
someone from the Nx team or the `@nrwl/nx-pipelines-reviewers` and they
will confirm if the PR warrants its own release for testing purposes,
and generate it for you if appropriate. -->

## Current Behavior
Legacy plugins don't actually work.

## Expected Behavior
Legacy plugins work.

## Related Issue(s)
<!-- Please link the issue being fixed so it gets closed when this is
merged. -->

Fixes #
---
 .../use-legacy-nx-plugin.ts                   | 34 +++++++++++++------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/packages/webpack/src/plugins/use-legacy-nx-plugin/use-legacy-nx-plugin.ts b/packages/webpack/src/plugins/use-legacy-nx-plugin/use-legacy-nx-plugin.ts
index 3c5003fda7..b3f5c424b4 100644
--- a/packages/webpack/src/plugins/use-legacy-nx-plugin/use-legacy-nx-plugin.ts
+++ b/packages/webpack/src/plugins/use-legacy-nx-plugin/use-legacy-nx-plugin.ts
@@ -1,7 +1,7 @@
-import { ExecutorContext, readCachedProjectGraph } from '@nx/devkit';
-import { NxWebpackExecutionContext } from '../../utils/config';
-import { NxAppWebpackPluginOptions } from '../nx-webpack-plugin/nx-app-webpack-plugin-options';
-import { Configuration } from 'webpack';
+import { type ExecutorContext, readCachedProjectGraph } from '@nx/devkit';
+import type { NxWebpackExecutionContext } from '../../utils/config';
+import type { NxAppWebpackPluginOptions } from '../nx-webpack-plugin/nx-app-webpack-plugin-options';
+import type { Compiler, Configuration } from 'webpack';
 import { normalizeOptions } from '../nx-webpack-plugin/lib/normalize-options';
 
 /**
@@ -57,12 +57,24 @@ export async function useLegacyNxPlugin(
   };
 
   const configuration = process.env.NX_TASK_TARGET_CONFIGURATION;
-  return async (config: Configuration) => {
-    const ctx: NxWebpackExecutionContext = {
-      context,
-      options: options as NxWebpackExecutionContext['options'],
-      configuration,
-    };
-    return await fn(config, ctx);
+  const ctx: NxWebpackExecutionContext = {
+    context,
+    options: options as NxWebpackExecutionContext['options'],
+    configuration,
+  };
+  return {
+    apply(compiler: Compiler) {
+      compiler.hooks.beforeCompile.tapPromise('NxLegacyAsyncPlugin', () => {
+        return new Promise<void>((resolve) => {
+          fn(compiler.options as Configuration, ctx).then((updated) => {
+            // Merge options back shallowly since it's a fully functional configuration.
+            // Most likely, the user modified the config in place, but this guarantees that updates are applied if users did something like:
+            // `return { ...config, plugins: [...config.plugins, new MyPlugin()] }`
+            Object.assign(compiler.options, updated);
+            resolve();
+          });
+        });
+      });
+    },
   };
 }