- feat(module-federation): consolidate module federation utils into module-federation package - chore(module-federation): fix tests and linting <!-- Please make sure you have read the submission guidelines before posting an PR --> <!-- https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr --> <!-- Please make sure that your commit message follows our format --> <!-- Example: `fix(nx): must begin with lowercase` --> <!-- 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 <!-- This is the behavior we have today --> Our current support for Module Federation relies on utilities that are spread and duplicated across the `@nx/webpack` package and the `@nx/rspack` package. ## Expected Behavior <!-- This is the behavior we should expect with the changes in this PR --> Now that we have a `@nx/module-federation` package, dedupe the utils and consolidate them into a single package ## Todo - [x] Migrations for React + Angular to install `@nx/module-federation` and point `ModuleFederationConfig` export to that package from webpack.config and rspack.config files
335 lines
10 KiB
TypeScript
335 lines
10 KiB
TypeScript
import { createTreeWithEmptyWorkspace } from '@nx/devkit/testing';
|
|
import migrateMfImportsToNewPackage from './migrate-mf-imports-to-new-package';
|
|
|
|
jest.mock('@nx/devkit', () => {
|
|
const original = jest.requireActual('@nx/devkit');
|
|
return {
|
|
...original,
|
|
createProjectGraphAsync: jest.fn().mockResolvedValue(
|
|
Promise.resolve({
|
|
dependencies: {
|
|
shell: [
|
|
{
|
|
source: 'shell',
|
|
target: 'npm:@nx/webpack',
|
|
type: 'static',
|
|
},
|
|
],
|
|
remote: [
|
|
{
|
|
source: 'remote',
|
|
target: 'npm:@nx/webpack',
|
|
type: 'static',
|
|
},
|
|
],
|
|
},
|
|
nodes: {
|
|
shell: {
|
|
name: 'shell',
|
|
type: 'app',
|
|
data: {
|
|
root: 'apps/shell',
|
|
sourceRoot: 'shell/src',
|
|
targets: {},
|
|
},
|
|
},
|
|
remote: {
|
|
name: 'remote',
|
|
type: 'app',
|
|
data: {
|
|
root: 'apps/remote',
|
|
sourceRoot: 'remote/src',
|
|
targets: {},
|
|
},
|
|
},
|
|
},
|
|
})
|
|
),
|
|
};
|
|
});
|
|
|
|
describe('migrate-mf-imports-to-new-package', () => {
|
|
it('should update the ModuleFederationConfig import to change the import when its a single line', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
'apps/shell/webpack.config.js',
|
|
`import { ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/shell/module-federation.config.ts',
|
|
`import { ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/webpack.config.ts',
|
|
`import { ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/module-federation.config.js',
|
|
`import { ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/shell/module-federation.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/module-federation.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
});
|
|
|
|
it('should not update the ModuleFederationConfig import when its correct', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
'apps/shell/webpack.config.js',
|
|
`import { ModuleFederationConfig } from '@nx/module-federation';`
|
|
);
|
|
tree.write(
|
|
'apps/shell/module-federation.config.ts',
|
|
`import { ModuleFederationConfig } from '@nx/module-federation';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/webpack.config.ts',
|
|
`import { ModuleFederationConfig } from '@nx/module-federation';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/module-federation.config.js',
|
|
`import { ModuleFederationConfig } from '@nx/module-federation';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/shell/module-federation.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/module-federation.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
});
|
|
|
|
it('should update the ModuleFederationConfig import to change the import when its across multiple lines', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
'apps/shell/webpack.config.js',
|
|
`import {
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/shell/module-federation.config.ts',
|
|
`import {
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/webpack.config.ts',
|
|
`import {
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/module-federation.config.js',
|
|
`import {
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/shell/module-federation.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/module-federation.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
"
|
|
`);
|
|
});
|
|
|
|
it('should update the ModuleFederationConfig import to change the import when its a part of multiple imports', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
'apps/shell/webpack.config.js',
|
|
`import { something, ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/shell/module-federation.config.ts',
|
|
`import { ModuleFederationConfig, something} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/webpack.config.ts',
|
|
`import { something, ModuleFederationConfig } from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/module-federation.config.js',
|
|
`import { ModuleFederationConfig, something } from '@nx/webpack';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/shell/module-federation.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/module-federation.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
});
|
|
|
|
it('should update the ModuleFederationConfig import to change the import when its a part of multiple imports across multiple lines', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
'apps/shell/webpack.config.js',
|
|
`import {
|
|
something,
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/shell/module-federation.config.ts',
|
|
`import {
|
|
ModuleFederationConfig,
|
|
something
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/webpack.config.ts',
|
|
`import {
|
|
something,
|
|
ModuleFederationConfig
|
|
} from '@nx/webpack';`
|
|
);
|
|
tree.write(
|
|
'apps/remote/module-federation.config.js',
|
|
`import {
|
|
ModuleFederationConfig,
|
|
something
|
|
} from '@nx/webpack';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/shell/module-federation.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
expect(tree.read('apps/remote/module-federation.config.js', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { something } from '@nx/webpack';
|
|
"
|
|
`);
|
|
});
|
|
|
|
it('should not incorrectly update import when it is run twice', async () => {
|
|
// ARRANGE
|
|
const tree = createTreeWithEmptyWorkspace();
|
|
tree.write(
|
|
`apps/shell/webpack.config.ts`,
|
|
`import { composePlugins, withNx, ModuleFederationConfig } from '@nx/webpack';
|
|
import { withReact } from '@nx/react';
|
|
import { withModuleFederation } from '@nx/react/module-federation';`
|
|
);
|
|
|
|
// ACT
|
|
await migrateMfImportsToNewPackage(tree);
|
|
await migrateMfImportsToNewPackage(tree);
|
|
|
|
// ASSERT
|
|
expect(tree.read('apps/shell/webpack.config.ts', 'utf-8'))
|
|
.toMatchInlineSnapshot(`
|
|
"import { ModuleFederationConfig } from '@nx/module-federation';
|
|
import { composePlugins, withNx } from '@nx/webpack';
|
|
import { withReact } from '@nx/react';
|
|
import { withModuleFederation } from '@nx/react/module-federation';
|
|
"
|
|
`);
|
|
});
|
|
});
|