Revert "chore(enhanced): adjust add federation init process (#2035)"

This reverts commit df3ef24

.github/workflows/build-and-test.yml

@@ -47,8 +47,8 @@ jobs:
       - name: Run Affected Test
         run: npx nx affected -t test --parallel=3 --exclude='*,!tag:package'
 
-      - name: E2E Test for Next.js
-        run: pnpm run app:next:dev & echo "done" && sleep 50 && npx nx run-many --target=test:e2e --projects=3000-home,3001-shop,3002-checkout --parallel=2 && lsof -ti tcp:3000,3001,3002 | xargs kill
+      - name: E2E Test for 3000-home
+        run: pnpm run app:next:dev & echo "done" && sleep 20 && npx nx run-many --target=test:e2e --projects=3000-home && lsof -ti tcp:3000,3001,3002 | xargs kill
 
       #      - name: E2E Test for 3001-shop
       #        run: pnpm run app:next:dev & echo "done" && sleep 20 && npx nx run-many --target=test:e2e --projects=3001-shop && lsof -ti tcp:3000,3001,3002 | xargs kill

apps/3000-home/cypress.config.ts

@@ -5,8 +5,4 @@ export default defineConfig({
   projectId: 'sa6wfn',
   e2e: nxE2EPreset(__filename, { cypressDir: 'cypress' }),
   defaultCommandTimeout: 20000,
-  retries: {
-    runMode: 2,
-    openMode: 1,
-  },
 });

apps/3000-home/cypress/e2e/app.cy.ts

@@ -31,7 +31,7 @@ describe('3000-home/', () => {
   });
 
   describe('Routing checks', () => {
-    it('check that clicking back and forwards in client side routeing still renders the content correctly', () => {
+    xit('check that clicking back and forwards in client side routeing still renders the content correctly', () => {
       cy.visit('/');
       cy.visit('/shop');
       cy.visit('/');
@@ -51,11 +51,7 @@ describe('3000-home/', () => {
   });
 
   describe('3000-home/checkout', () => {
-    beforeEach(() => {
-      cy.visit('/checkout');
-      cy.visit('/');
-      cy.visit('/checkout');
-    });
+    beforeEach(() => cy.visit('/checkout'));
 
     describe('Welcome message', () => {
       it('should display welcome message', () => {
@@ -106,8 +102,7 @@ describe('3000-home/', () => {
             cy.request(src).its('status').should('eq', 200);
           });
       });
-      it('should check that shop-webpack-png images are not 404 between route clicks', () => {
-        cy.visit('/');
+      xit('should check that shop-webpack-png images are not 404 between route clicks', () => {
         cy.visit('/shop');
         cy.url().should('include', '/shop');
         getH1().contains('Shop Page');

apps/3000-home/package.json

@@ -25,7 +25,6 @@
     "tapable": "2.2.1",
     "terser-webpack-plugin": "5.3.10",
     "typescript": "5.3.3",
-    "upath": "2.0.1",
     "url": "0.11.3",
     "util": "0.12.5",
     "webpack-sources": "3.2.3"

apps/3000-home/pages/_app.tsx

@@ -24,9 +24,7 @@ function MyApp(props) {
     }
   };
   // handle first route hit.
-  React.useEffect(() => {
-    handleRouteChange(asPath);
-  }, [asPath]);
+  React.useMemo(() => handleRouteChange(asPath), [asPath]);
 
   //handle route change
   React.useEffect(() => {

apps/3000-home/pages/_document.js

@@ -8,19 +8,15 @@ import {
 
 class MyDocument extends Document {
   static async getInitialProps(ctx) {
-    if (ctx.pathname) {
-      if (!ctx.pathname.endsWith('_error')) {
-        await revalidate().then((shouldUpdate) => {
-          if (shouldUpdate) {
-            console.log('should HMR', shouldUpdate);
-          }
-        });
-      }
-    }
-
     const initialProps = await Document.getInitialProps(ctx);
-
     const chunks = await flushChunks();
+    ctx?.res?.on('finish', () => {
+      revalidate().then((shouldUpdate) => {
+        if (shouldUpdate) {
+          console.log('should HMR', shouldUpdate);
+        }
+      });
+    });
 
     return {
       ...initialProps,

apps/3001-shop/cypress.config.ts

@@ -4,8 +4,4 @@ import { defineConfig } from 'cypress';
 export default defineConfig({
   e2e: nxE2EPreset(__filename, { cypressDir: 'cypress' }),
   defaultCommandTimeout: 10000,
-  retries: {
-    runMode: 2,
-    openMode: 1,
-  },
 });

apps/3001-shop/cypress/e2e/app.cy.ts

@@ -3,6 +3,9 @@ import { getH1, getH3 } from '../support/app.po';
 describe('3001-shop/', () => {
   beforeEach(() => {
     cy.visit('/');
+    cy.visit('/shop');
+    cy.visit('/checkout');
+    cy.visit('/');
   });
 
   describe('Welcome message', () => {

apps/3001-shop/package.json

@@ -24,7 +24,6 @@
     "tapable": "2.2.1",
     "terser-webpack-plugin": "5.3.10",
     "typescript": "5.3.3",
-    "upath": "2.0.1",
     "url": "0.11.3",
     "util": "0.12.5",
     "webpack-sources": "3.2.3"

apps/3001-shop/pages/_app.tsx

@@ -26,9 +26,7 @@ function MyApp({ Component, pageProps }) {
     }
   };
   // handle first route hit.
-  React.useEffect(() => {
-    handleRouteChange(asPath);
-  }, [asPath]);
+  React.useMemo(() => handleRouteChange(asPath), [asPath]);
 
   //handle route change
   React.useEffect(() => {

apps/3001-shop/pages/_document.js

@@ -8,18 +8,21 @@ import {
 
 class MyDocument extends Document {
   static async getInitialProps(ctx) {
-    if (ctx.pathname) {
-      if (!ctx.pathname.endsWith('_error')) {
-        await revalidate().then((shouldUpdate) => {
-          if (shouldUpdate) {
-            console.log('should HMR', shouldUpdate);
-          }
-        });
+    await revalidate().then((shouldUpdate) => {
+      if (shouldUpdate) {
+        ctx.res.writeHead(307, { Location: ctx.req.url });
+        ctx.res.end();
       }
-    }
-
+    });
     const initialProps = await Document.getInitialProps(ctx);
     const chunks = await flushChunks();
+    ctx?.res?.on('finish', () => {
+      // revalidate().then((shouldUpdate) => {
+      //   if (shouldUpdate) {
+      //     console.log('should HMR', shouldUpdate);
+      //   }
+      // });
+    });
 
     return {
       ...initialProps,

apps/3002-checkout/cypress.config.ts

@@ -4,8 +4,4 @@ import { defineConfig } from 'cypress';
 export default defineConfig({
   e2e: nxE2EPreset(__filename, { cypressDir: 'cypress' }),
   defaultCommandTimeout: 15000,
-  retries: {
-    runMode: 2,
-    openMode: 1,
-  },
 });

apps/3002-checkout/cypress/e2e/app.cy.ts

@@ -101,7 +101,7 @@ describe('3002-checkout/', () => {
             cy.request(src).its('status').should('eq', 200);
           });
       });
-      it('should check that shop-webpack-png images are not 404 between route clicks', () => {
+      xit('should check that shop-webpack-png images are not 404 between route clicks', () => {
         cy.visit('/shop');
         cy.url().should('include', '/shop');
         getH1().contains('Shop Page');

apps/3002-checkout/package.json

@@ -23,16 +23,15 @@
     "styled-jsx": "5.1.2",
     "tapable": "2.2.1",
     "terser-webpack-plugin": "5.3.10",
-    "typescript": "5.3.3",
-    "upath": "2.0.1",
     "url": "0.11.3",
     "util": "0.12.5",
-    "webpack-sources": "3.2.3"
+    "webpack-sources": "3.2.3",
+    "typescript": "5.3.3"
   },
   "devDependencies": {
     "@module-federation/nextjs-mf": "workspace:*",
-    "@module-federation/runtime": "workspace:*",
     "@module-federation/sdk": "workspace:*",
+    "@module-federation/runtime": "workspace:*",
     "@module-federation/utilities": "workspace:*"
   },
   "scripts": {

apps/3002-checkout/pages/_app.tsx

@@ -25,9 +25,7 @@ function MyApp({ Component, pageProps }) {
     }
   };
   // handle first route hit.
-  React.useEffect(() => {
-    handleRouteChange(asPath);
-  }, [asPath]);
+  React.useMemo(() => handleRouteChange(asPath), [asPath]);
 
   //handle route change
   React.useEffect(() => {

apps/3002-checkout/pages/_document.js

@@ -8,18 +8,15 @@ import {
 
 class MyDocument extends Document {
   static async getInitialProps(ctx) {
-    if (ctx.pathname) {
-      if (!ctx.pathname.endsWith('_error')) {
-        await revalidate().then((shouldUpdate) => {
-          if (shouldUpdate) {
-            console.log('should HMR', shouldUpdate);
-          }
-        });
-      }
-    }
-
     const initialProps = await Document.getInitialProps(ctx);
     const chunks = await flushChunks();
+    ctx?.res?.on('finish', () => {
+      revalidate().then((shouldUpdate) => {
+        if (shouldUpdate) {
+          console.log('should HMR', shouldUpdate);
+        }
+      });
+    });
 
     return {
       ...initialProps,

apps/modernjs/project.json

@@ -33,7 +33,7 @@
         "commands": [
           {
             "command": "cd apps/modernjs; pnpm run dev",
-            "forwardAllArgs": false
+            "forwardAllArgs": true
           }
         ]
       }
@@ -61,11 +61,11 @@
         "parallel": true,
         "commands": [
           {
-            "command": "lsof -i :8080 || nx run modernjs:serve & echo 'done'",
+            "command": "lsof -i :8080 || nx run modernjs:serve && echo 'done'",
             "forwardAllArgs": false
           },
           {
-            "command": "sleep 20 && nx run modernjs:e2e",
+            "command": "sleep 4 && nx run modernjs:e2e",
             "forwardAllArgs": true
           }
         ]

apps/node-host/src/bootstrap.js

@@ -5,23 +5,27 @@
 
 import express from 'express';
 import * as path from 'path';
-import node_local_remote from 'node_local_remote/test';
+
 const remoteMsg = import('node_remote/test').then((m) => {
   console.log('\x1b[32m%s\x1b[0m', m.default || m);
   return m.default || m;
 });
-console.log('\x1b[32m%s\x1b[0m', node_local_remote);
 
 const app = express();
 
 app.use('/assets', express.static(path.join(__dirname, 'assets')));
 
 app.get('/api', async (req, res) => {
+  const localRemoteMsg = import('node_local_remote/test').then((m) => {
+    console.log('\x1b[32m%s\x1b[0m', m.default || m);
+    return m.default || m;
+  });
+
   res.send({
     message: 'Welcome to node-host!',
     remotes: {
       node_remote: await remoteMsg,
-      node_local_remote,
+      node_local_remote: await localRemoteMsg,
     },
   });
 });

apps/node-remote/webpack.config.js

@@ -24,6 +24,7 @@ module.exports = composePlugins(withNx(), (config) => {
       exposes: {
         './test': './src/expose.js',
       },
+      experiments: {},
     }),
   );
   return config;

package.json

@@ -41,8 +41,7 @@
     "app:ts:dev": "nx run-many --target=serve -p react_ts_host,react_ts_nested_remote,react_ts_remote",
     "commitlint": "commitlint --edit",
     "prepare": "husky install",
-    "changeset": "changeset",
-    "build:packages": "npx nx affected -t build --parallel=10 --exclude='*,!tag:package'"
+    "changeset": "changeset"
   },
   "dependencies": {
     "adm-zip": "0.5.10",
@@ -68,7 +67,6 @@
     "unplugin": "1.9.0"
   },
   "devDependencies": {
-    "terser-webpack-plugin": "^5.3.10",
     "@antora/cli": "3.1.5",
     "@antora/lunr-extension": "1.0.0-alpha.8",
     "@antora/site-generator": "3.1.7",

packages/enhanced/jest.config.ts

@@ -1,5 +1,5 @@
 /* eslint-disable */
-import { readFileSync, rmdirSync, existsSync } from 'fs';
+import { readFileSync } from 'fs';
 import path from 'path';
 
 // Reading the SWC compilation config and remove the "exclude"
@@ -8,10 +8,6 @@ const { exclude: _, ...swcJestConfig } = JSON.parse(
   readFileSync(`${__dirname}/.swcrc`, 'utf-8'),
 );
 
-if (existsSync(__dirname + '/test/js')) {
-  rmdirSync(__dirname + '/test/js', { recursive: true });
-}
-
 // disable .swcrc look-up by SWC core because we're passing in swcJestConfig ourselves.
 // If we do not disable this, SWC Core will read .swcrc and won't transform our test files due to "exclude"
 if (swcJestConfig.swcrc === undefined) {

packages/enhanced/src/lib/container/ContainerEntryModule.ts

@@ -189,6 +189,7 @@ class ContainerEntryModule extends Module {
       // @ts-ignore
       new EntryDependency(this._injectRuntimeEntry),
     );
+
     callback();
   }