From 1bb8ba95495efecb456503a24741e8cc831ce795 Mon Sep 17 00:00:00 2001
From: Jack Hsu <jack.hsu@gmail.com>
Date: Fri, 27 Jan 2023 08:12:24 -0500
Subject: [PATCH] fix(react): install @nrwl/web when module federation is used

---
 .../react/src/generators/host/host.spec.ts    | 14 ++++++++++++++
 .../src/generators/remote/remote.spec.ts      | 19 +++++++++++++++++--
 .../rules/update-module-federation-project.ts |  7 ++++++-
 3 files changed, 37 insertions(+), 3 deletions(-)

diff --git a/packages/react/src/generators/host/host.spec.ts b/packages/react/src/generators/host/host.spec.ts
index e42b6f2c05ee0..4a70a53dbb4cc 100644
--- a/packages/react/src/generators/host/host.spec.ts
+++ b/packages/react/src/generators/host/host.spec.ts
@@ -28,6 +28,20 @@ describe('hostGenerator', () => {
     expect(tree.exists('apps/test/src/remotes.d.ts'));
   });
 
+  it('should install @nrwl/web for the file-server executor', async () => {
+    const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    await hostGenerator(tree, {
+      name: 'test',
+      style: 'css',
+      linter: Linter.None,
+      unitTestRunner: 'none',
+      e2eTestRunner: 'none',
+    });
+
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson.devDependencies['@nrwl/web']).toBeDefined();
+  });
+
   it('should generate host files and configs for SSR', async () => {
     await hostGenerator(tree, {
       name: 'test',
diff --git a/packages/react/src/generators/remote/remote.spec.ts b/packages/react/src/generators/remote/remote.spec.ts
index 0370c9fc38914..fc28288735677 100644
--- a/packages/react/src/generators/remote/remote.spec.ts
+++ b/packages/react/src/generators/remote/remote.spec.ts
@@ -1,12 +1,27 @@
-import { readNxJson } from '@nrwl/devkit';
+import { readJson, readNxJson } from '@nrwl/devkit';
 import { createTreeWithEmptyWorkspace } from '@nrwl/devkit/testing';
 import { Linter } from '@nrwl/linter';
 import remote from './remote';
 
 describe('remote generator', () => {
-  it('should not set the remote as the default project', async () => {
+  it('should install @nrwl/web for the file-server executor', async () => {
     const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
+    await remote(tree, {
+      name: 'test',
+      devServerPort: 4201,
+      e2eTestRunner: 'cypress',
+      linter: Linter.EsLint,
+      skipFormat: false,
+      style: 'css',
+      unitTestRunner: 'jest',
+    });
 
+    const packageJson = readJson(tree, 'package.json');
+    expect(packageJson.devDependencies['@nrwl/web']).toBeDefined();
+  });
+
+  it('should not set the remote as the default project', async () => {
+    const tree = createTreeWithEmptyWorkspace({ layout: 'apps-libs' });
     await remote(tree, {
       name: 'test',
       devServerPort: 4201,
diff --git a/packages/react/src/rules/update-module-federation-project.ts b/packages/react/src/rules/update-module-federation-project.ts
index 0448ee78d6c0a..e622c10af033d 100644
--- a/packages/react/src/rules/update-module-federation-project.ts
+++ b/packages/react/src/rules/update-module-federation-project.ts
@@ -1,8 +1,11 @@
 import {
+  addDependenciesToPackageJson,
+  GeneratorCallback,
   readProjectConfiguration,
   Tree,
   updateProjectConfiguration,
 } from '@nrwl/devkit';
+import { nxVersion } from '../utils/versions';
 
 export function updateModuleFederationProject(
   host: Tree,
@@ -11,7 +14,7 @@ export function updateModuleFederationProject(
     appProjectRoot: string;
     devServerPort?: number;
   }
-) {
+): GeneratorCallback {
   const projectConfig = readProjectConfiguration(host, options.projectName);
 
   projectConfig.targets.build.options = {
@@ -48,4 +51,6 @@ export function updateModuleFederationProject(
   };
 
   updateProjectConfiguration(host, options.projectName, projectConfig);
+
+  return addDependenciesToPackageJson(host, {}, { '@nrwl/web': nxVersion });
 }