@servicetitan/startup 31.3.2 → 31.5.0

package/src/cli/utils/bundle.ts

@@ -10,15 +10,21 @@ import {
     getPackageName,
     hasHeadlessBundle,
     isDevServerDisabled,
+    isExposeSharedDependencies,
     isWebComponent,
     log,
+    pick,
 } from '../../utils';
 import { Overrides, createWebpackConfig } from '../../webpack';
+import { stringifyConfig } from '../../webpack/utils';
 
 interface Options {
     buildStat?: boolean;
     codeCoverage?: boolean;
     config?: string;
+    emitExposedDependencies?: boolean | Pick<Configuration, 'output'>;
+    useWatchConfig?: boolean;
+    watch?: boolean;
 }
 
 function getName() {
@@ -34,72 +40,88 @@ export const webpackDevConfigFileName = 'webpack.dev.config.js';
 export const webpackProdConfigFileName = 'webpack.prod.config.js';
 
 export async function bundle(options: Options = {}) {
-    log.info('Bundling the package...');
+    const { emitExposedDependencies, useWatchConfig, watch } = options;
+    if (emitExposedDependencies) {
+        if (watch) {
+            throw new Error('cannot bundle exposed dependencies in watch mode');
+        }
+        if (!isExposeSharedDependencies()) {
+            return;
+        }
+    }
+
+    log.info(`Bundling ${emitExposedDependencies ? 'exposed dependencies' : 'package'}...`);
 
-    const name = getName();
-    const mode = 'production';
-    const fallback = `./${webpackProdConfigFileName}`;
-    const config = readWebpackConfig({ ...options, fallback });
-    const { buildStat, codeCoverage } = options;
-    const webpackOptions = { name, buildStat, codeCoverage };
+    const mode = watch ? 'development' : 'production';
+    const fallback = watch || useWatchConfig ? webpackDevConfigFileName : webpackProdConfigFileName;
+    const customConfig = readWebpackConfig({ ...options, fallback });
+    const webpackOptions = getWebpackOptions(options, customConfig);
+
+    log.debug('custom-webpack-config', () => stringifyConfig(customConfig));
 
     if (isWebComponent()) {
-        const webpackConfig: Overrides = {
-            configuration: { ...config?.configuration, mode },
-            plugins: config?.plugins,
-        };
-
-        const bundles = [
-            run(createWebpackConfig(webpackConfig, { embed: true, ...webpackOptions })),
-            run(createWebpackConfig(webpackConfig, webpackOptions)),
-        ];
-
-        if (hasHeadlessBundle()) {
-            bundles.push(
-                run(createWebpackConfig(webpackConfig, { ...webpackOptions, headless: true }))
-            );
-        }
+        return bundleWebComponent({ customConfig, mode, watch, webpackOptions });
+    }
 
-        return Promise.all(bundles);
+    const config =
+        customConfig && !emitExposedDependencies
+            ? customConfig
+            : createWebpackConfig({ configuration: { mode } }, webpackOptions);
+
+    if (watch) {
+        return isDevServerDisabled() ? runWatch(config) : runServe(config);
     }
 
-    return run(config ?? createWebpackConfig({ configuration: { mode } }, webpackOptions));
+    return run(config);
 }
 
-export async function bundleWatch(options: Options = {}) {
-    log.info('Bundling the package...');
-
-    const name = getName();
-    const mode = 'development';
-    const config = readWebpackConfig({ ...options, fallback: `./${webpackDevConfigFileName}` });
-    const configOverrides = { codeCoverage: options.codeCoverage, name };
+function bundleWebComponent({
+    customConfig,
+    mode,
+    watch,
+    webpackOptions,
+}: {
+    customConfig: ReturnType<typeof readWebpackConfig>;
+    mode: 'development' | 'production';
+    watch?: boolean;
+    webpackOptions: ReturnType<typeof getWebpackOptions>;
+}) {
+    const overrides: Overrides = {
+        configuration: { ...customConfig?.configuration, mode },
+        plugins: customConfig?.plugins,
+    };
+
+    const fullConfig = createWebpackConfig(overrides, webpackOptions);
+    const lightConfig = createWebpackConfig(overrides, { ...webpackOptions, embed: true });
+    const headlessConfig = hasHeadlessBundle()
+        ? createWebpackConfig(overrides, {
+              ...webpackOptions,
+              headless: true,
+          })
+        : undefined;
+
+    const promises = watch
+        ? [
+              runWatch(lightConfig),
+              isDevServerDisabled() ? runWatch(fullConfig) : runServe(fullConfig),
+              headlessConfig && runWatch(headlessConfig),
+          ]
+        : [run(lightConfig), run(fullConfig), headlessConfig && run(headlessConfig)];
+
+    return Promise.all(promises.filter(promise => !!promise));
+}
 
-    if (isWebComponent()) {
-        const webpackConfig: Overrides = {
-            configuration: { ...config?.configuration, mode },
-            plugins: config?.plugins,
-        };
-
-        const bundles = [
-            runWatch(createWebpackConfig(webpackConfig, { embed: true, ...configOverrides })),
-            isDevServerDisabled()
-                ? runWatch(createWebpackConfig(webpackConfig, configOverrides))
-                : runServe(createWebpackConfig(webpackConfig, configOverrides)),
-        ];
-
-        if (hasHeadlessBundle()) {
-            bundles.push(
-                runWatch(createWebpackConfig(webpackConfig, { ...configOverrides, headless: true }))
-            );
-        }
+function getWebpackOptions(options: Options, customConfig?: Record<string, any>) {
+    const result = {
+        name: getName(),
+        ...pick(options, ['buildStat', 'codeCoverage', 'emitExposedDependencies']),
+    };
 
-        return Promise.all(bundles);
+    if (result.emitExposedDependencies && customConfig) {
+        result.emitExposedDependencies = { output: customConfig.output };
     }
 
-    const webpackConfig =
-        config ?? createWebpackConfig({ configuration: { mode } }, configOverrides);
-
-    return isDevServerDisabled() ? runWatch(webpackConfig) : runServe(webpackConfig);
+    return result;
 }
 
 function readWebpackConfig({ config, fallback }: Options & { fallback: string }) {

package/src/cli/utils/cli-os.ts

@@ -31,7 +31,7 @@ export const runCommand = (
         }
 
         if (!quiet) {
-            log.info(`run command ${fullCommand}`);
+            log.info(`Running: ${fullCommand}`);
         }
 
         const proc = spawn(commandName, commandArray, {
@@ -78,7 +78,7 @@ export const runCommandOutput = (
     }
 
     if (!quiet) {
-        log.info(`run command ${fullCommand}`);
+        log.info(`Running: ${fullCommand}`);
     }
 
     const result = execSync(fullCommand, execSyncOptions).toString();

package/src/utils/__tests__/get-configuration.test.ts

@@ -277,7 +277,7 @@ describe('[startup] Utils', () => {
                 beforeEach(() => fs.rmSync(configPath));
 
                 test('logs warning and returns undefined', () => {
-                    const logSpy = jest.spyOn(log, 'warning');
+                    const logSpy = jest.spyOn(log, 'warning').mockImplementation(jest.fn());
 
                     expect(subject()).toBeUndefined();
 

package/src/utils/find-packages.ts

@@ -1,6 +1,7 @@
 import { globSync } from 'glob';
 import multimatch from 'multimatch';
 import path from 'path';
+import { findUp } from './find-up';
 import { readJsonSafe } from './read-json';
 import { log } from './log';
 
@@ -36,8 +37,7 @@ export function findPackages(): ProjectPackage[] {
 }
 
 function findWorkspaces() {
-    let directory = path.resolve('./');
-    do {
+    return findUp(directory => {
         const packageJson = path.resolve(path.join(directory, 'package.json'));
 
         log.debug('find-packages', `reading: ${packageJson}`);
@@ -61,7 +61,5 @@ function findWorkspaces() {
             log.debug('find-packages', () => `found workspaces: ${JSON.stringify(workspaces)}`);
             return workspaces;
         }
-
-        directory = path.resolve(path.join(directory, '../'));
-    } while (path.parse(directory).name);
+    });
 }

package/src/utils/find-up.ts

@@ -0,0 +1,12 @@
+import path from 'path';
+
+export function findUp<T>(callback: (directory: string) => T | undefined) {
+    let directory = path.resolve('./');
+    do {
+        const result = callback(directory);
+        if (result) {
+            return result;
+        }
+        directory = path.resolve(path.join(directory, '../'));
+    } while (path.parse(directory).name);
+}

package/src/utils/get-configuration.ts

@@ -77,11 +77,13 @@ export enum CommandName {
     'styles-check' = 'styles-check',
     'test' = 'test',
     'task' = 'task',
+    'upload-sourcemaps' = 'upload-sourcemaps',
 }
 /* eslint-enable @typescript-eslint/naming-convention */
 
 export interface WebComponentBranchConfigs {
     publishTag?: string;
+    uploadSourcemaps?: boolean;
 }
 
 interface WebComponentOptions {

package/src/utils/index.ts

@@ -1,4 +1,5 @@
 export * from './find-packages';
+export * from './find-up';
 export * from './format-duration';
 export * from './get-configuration';
 export * from './get-destination-folders';

package/src/webpack/__mocks__/style-rules.ts

@@ -6,7 +6,7 @@ export type StyleRule = RuleSetRule & { use: (string | object)[] };
 export const styleRules: Record<string, StyleRule> = {
     '.css': {
         test: /(\.css)$/,
-        exclude: expect.any(Function),
+        exclude: /\.module.css$/,
         use: ['style-loader', 'css-loader'],
     },
     '.scss': {

package/src/webpack/__tests__/create-webpack-config-shared-dependencies.test.ts

@@ -1,5 +1,13 @@
+import { fs, vol } from 'memfs';
+import * as mockFS from 'fs';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+import HtmlWebpackTagsPlugin from 'html-webpack-tags-plugin';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
-import { DefinePlugin } from 'webpack';
+import path from 'path';
+import { DefinePlugin, EntryObject } from 'webpack';
+import { WebpackAssetsManifest } from 'webpack-assets-manifest';
+import RemoveEmptyScriptsPlugin from 'webpack-remove-empty-scripts';
+import VirtualModulesPlugin from 'webpack-virtual-modules';
 import {
     getFolders,
     getPackageData,
@@ -9,12 +17,18 @@ import {
     isCustomStyleRules,
     isExposeSharedDependencies,
     loadSharedDependencies,
+    log,
+    pick,
 } from '../../utils';
+import { styleRules } from '../__mocks__';
 import { getLaunchDarklySdkVersion } from '../configs/utils/get-launchdarkly-sdk-version';
 import { getModuleEntryPath } from '../utils';
 
 import { createWebpackConfig } from '../index';
 
+jest.mock('fs', () => fs);
+jest.mock('html-webpack-plugin', () => jest.fn());
+jest.mock('html-webpack-tags-plugin', () => jest.fn());
 jest.mock('mini-css-extract-plugin', () =>
     Object.assign(jest.fn(), { loader: 'MiniCssExtractPlugin.loader' })
 );
@@ -23,6 +37,9 @@ jest.mock('webpack', () => ({
     ...jest.requireActual('webpack'),
     DefinePlugin: jest.fn(),
 }));
+jest.mock('webpack-assets-manifest', () => ({ WebpackAssetsManifest: jest.fn() }));
+jest.mock('webpack-remove-empty-scripts', () => jest.fn());
+jest.mock('webpack-virtual-modules', () => jest.fn());
 
 jest.mock('../../utils', () => ({
     ...jest.requireActual('../../utils'),
@@ -56,22 +73,40 @@ describe(`[startup] ${createWebpackConfig.name}`, () => {
     };
 
     let overrides: Parameters<typeof createWebpackConfig>[0];
+    let options: Parameters<typeof createWebpackConfig>[1];
 
     function mockPlugIn(name: string) {
         return (options: Record<string, any>): any => ({ [name]: options });
     }
 
+    function volumeFromJSON(overrides: Record<string, any> = {}) {
+        return vol.fromJSON({
+            'package.json': JSON.stringify({}),
+            ...Object.fromEntries(
+                Object.entries(overrides).map(([key, value]) => [key, JSON.stringify(value)])
+            ),
+        });
+    }
+
     beforeEach(() => {
         overrides = { plugins: {} };
+        options = { name: 'app' };
 
         jest.resetAllMocks();
-        jest.mocked(MiniCssExtractPlugin).mockImplementation(mockPlugIn('MiniCssExtractPlugin'));
         jest.mocked(DefinePlugin).mockImplementation(mockPlugIn('DefinePlugin'));
+        jest.mocked(HtmlWebpackPlugin).mockImplementation(mockPlugIn('HtmlWebpackPlugin'));
+        jest.mocked(HtmlWebpackTagsPlugin).mockImplementation(mockPlugIn('HtmlWebpackTagsPlugin'));
+        jest.mocked(MiniCssExtractPlugin).mockImplementation(mockPlugIn('MiniCssExtractPlugin'));
+        jest.mocked(VirtualModulesPlugin).mockImplementation(mockPlugIn('VirtualModulesPlugin'));
+        jest.mocked(WebpackAssetsManifest).mockImplementation(mockPlugIn('WebpackAssetsManifest'));
+        jest.mocked(RemoveEmptyScriptsPlugin).mockImplementation(
+            mockPlugIn('WebpackRemoveEmptyScriptsPlugin')
+        );
 
         jest.mocked(getFolders).mockReturnValue({ source, destination });
         jest.mocked(getModuleEntryPath).mockImplementation(name => `${name}/entryPath`);
         jest.mocked(getPackageData).mockReturnValue({
-            name: '',
+            name: options.name!,
             version: '',
             dependencies,
             sharedDependencies,
@@ -82,9 +117,13 @@ describe(`[startup] ${createWebpackConfig.name}`, () => {
         jest.mocked(getPackages).mockReturnValue([]);
         jest.mocked(getTsConfig).mockReturnValue(tsConfig);
         jest.mocked(loadSharedDependencies).mockReturnValue(sharedDependencies);
+
+        volumeFromJSON();
     });
 
-    const subject = () => createWebpackConfig(overrides);
+    afterEach(() => vol.reset());
+
+    const subject = () => createWebpackConfig(overrides, options);
 
     describe('when package exposes shared dependencies', () => {
         const launchDarklySdkVersion = '3.0';
@@ -94,25 +133,6 @@ describe(`[startup] ${createWebpackConfig.name}`, () => {
             jest.mocked(getLaunchDarklySdkVersion).mockReturnValue(launchDarklySdkVersion);
         });
 
-        test('configures "optimization.splitChunks.cacheGroups.design-system"', () => {
-            expect(
-                (subject().optimization?.splitChunks as any).cacheGroups['design-system']
-            ).toEqual({
-                test: /[\\/]node_modules[\\/]@servicetitan[\\/](tokens|anvil-fonts|design-system)[\\/].*\.css$/,
-                name: 'design-system',
-                chunks: 'all',
-                enforce: true,
-            });
-        });
-
-        test('configures shared dependency entry points', () => {
-            expect(subject().entry).toEqual({
-                main: expect.arrayContaining(
-                    Object.keys(sharedDependencies).map(getModuleEntryPath)
-                ),
-            });
-        });
-
         test('configures shared dependencies to use expose-loader', () => {
             Object.entries(sharedDependencies).forEach(([name, value]) => {
                 expect(subject().module?.rules).toContainEqual({
@@ -124,6 +144,17 @@ describe(`[startup] ${createWebpackConfig.name}`, () => {
             });
         });
 
+        test('configures "externals"', () => {
+            expect(subject().externals).toEqual(
+                Object.fromEntries(
+                    Object.entries(sharedDependencies).map(([name, value]) => [
+                        name,
+                        `${value}['${options!.name}']`,
+                    ])
+                )
+            );
+        });
+
         test('configures EXPOSE_DEPENDENCIES', () => {
             const exposedDependencies = Object.fromEntries(
                 Object.entries(sharedDependencies).map(([name, variable]) => [
@@ -153,39 +184,237 @@ describe(`[startup] ${createWebpackConfig.name}`, () => {
             );
         });
 
-        test('configures "design-system.css" rules', () => {
-            expect(subject().module?.rules).toContainEqual({
-                test: /design-system\.css$/,
-                use: [MiniCssExtractPlugin.loader, 'css-loader'],
-            });
-        });
+        test('configures rule that reports fatal error when app imports design-system.css', () => {
+            const mockError = jest.spyOn(log, 'error').mockImplementation(jest.fn());
+            const mockExit = jest.spyOn(process, 'exit').mockImplementation(jest.fn() as any);
+            const rule: any = subject().module?.rules?.find(
+                rule => typeof rule === 'object' && typeof rule?.use === 'function'
+            );
 
-        test('configures anvil2 css" rules', () => {
-            expect(subject().module?.rules).toContainEqual({
-                test: /@servicetitan[\\/]anvil2[\\/].*\.css$/,
-                use: [MiniCssExtractPlugin.loader, 'css-loader'],
-            });
-        });
+            rule.use({ issuer: './foo.js' });
 
-        test('configures ".css" rule to also exclude design-system.css', () => {
-            const cssRule: any = subject().module?.rules?.find(({ test }: { test: RegExp }) =>
-                '.css'.match(test)
+            expect(rule).toEqual({ test: /[\\/]design-system.css$/, use: expect.any(Function) });
+            expect(mockError).toHaveBeenCalledWith(
+                expect.stringMatching(/do not import design-system.css/)
             );
-            expect(
-                ['design-system.css', 'foo.module.css', 'foo.css'].filter(path =>
-                    cssRule.exclude(path)
-                )
-            ).toEqual(['design-system.css', 'foo.module.css']);
+            expect(mockExit).toHaveBeenCalledWith(1);
         });
 
         describe('when package has custom style rules', () => {
             beforeEach(() => jest.mocked(isCustomStyleRules).mockReturnValue(true));
 
-            test('does not configure MiniCssExtractPlugIn plugin', () => {
+            test('does not configure MiniCssExtractPlugin plugin', () => {
                 expect(subject().plugins).not.toContainEqual(
-                    expect.objectContaining({ MiniCssExtractPlugIn: expect.anything() })
+                    expect.objectContaining({ MiniCssExtractPlugin: expect.anything() })
+                );
+            });
+
+            describe('when emitting exposed dependencies', () => {
+                beforeEach(() => (options = { emitExposedDependencies: true }));
+
+                test('configures MiniCssExtractPlugin plugin', () => {
+                    expect(subject().plugins).toContainEqual(
+                        expect.objectContaining({ MiniCssExtractPlugin: expect.anything() })
+                    );
+                });
+
+                Object.entries(styleRules).forEach(([extension, rule]) => {
+                    test(`configures "${extension}" rules`, () => {
+                        expect(subject().module?.rules).toContainEqual(rule);
+                    });
+                });
+            });
+        });
+
+        describe('when in production', () => {
+            beforeEach(() => (overrides.configuration = { mode: 'production' }));
+
+            test('configures "output.clean" to keep shared dependencies', () => {
+                expect(subject().output?.clean).toEqual({ keep: /shared/ });
+            });
+        });
+
+        describe('with bundled exposed dependencies', () => {
+            const entryPointsPath = `${destination}/bundle/shared/entrypoints.json`;
+            const entryPoints = {
+                css: ['anvil2.bundle.css', 'design-system.bundle.css'],
+                js: ['anvil2.bundle.js', 'shared.bundle.js', 'design-system..bundle.js'],
+            };
+
+            beforeEach(() => {
+                volumeFromJSON({
+                    [`${destination}/exposed-dependencies-metadata.json`]: { entryPointsPath },
+                    [entryPointsPath]: entryPoints,
+                });
+            });
+
+            test('configures HtmlWebpackTagsPlugin plug', () => {
+                expect(subject().plugins).toContainEqual(
+                    new HtmlWebpackTagsPlugin({
+                        tags: [...entryPoints.css, ...entryPoints.js].map(name => `shared/${name}`),
+                        append: false,
+                    })
+                );
+            });
+        });
+
+        describe('when emitting exposed dependencies', () => {
+            beforeEach(() => (options = { ...options, emitExposedDependencies: true }));
+
+            test('configures shared dependencies entry points', () => {
+                expect(subject().entry).toEqual(
+                    expect.objectContaining({
+                        shared: expect.arrayContaining(
+                            Object.keys(sharedDependencies).map(getModuleEntryPath)
+                        ),
+                    })
+                );
+            });
+
+            test('configures design-system.css entry point', () => {
+                const { entry, plugins } = subject();
+
+                expect(entry).toEqual(
+                    expect.objectContaining({
+                        'design-system': expect.stringMatching(/design-system.css/),
+                    })
+                );
+                expect(plugins).toContainEqual(
+                    new VirtualModulesPlugin({
+                        [(entry as EntryObject)?.['design-system'] as string]: [
+                            `@import '~@servicetitan/tokens/core/tokens.css';`,
+                            `@import '~@servicetitan/anvil-fonts/dist/css/anvil-fonts.css';`,
+                            `@import '~@servicetitan/design-system/dist/system.min.css';`,
+                        ].join('\n'),
+                    })
                 );
             });
+
+            describe('when application does not share design system', () => {
+                beforeEach(() => {
+                    jest.mocked(loadSharedDependencies).mockReturnValue(
+                        pick(sharedDependencies, ['react'])
+                    );
+                });
+
+                test('omits design-system.css entry point', () => {
+                    expect((subject().entry as EntryObject)?.['design-system']).toBeUndefined();
+                });
+            });
+
+            test('configures "optimization.splitChunks.cacheGroups.anvil2"', () => {
+                expect((subject().optimization?.splitChunks as any).cacheGroups.anvil2).toEqual({
+                    test: /@servicetitan[\\/]anvil2[\\/].*\.css$/,
+                    name: 'anvil2',
+                    chunks: 'all',
+                    enforce: true,
+                });
+            });
+
+            test('configures "output.chunkLoadingGlobal"', () => {
+                expect(subject().output?.chunkLoadingGlobal).toBe(`sharedChunk${options!.name}`);
+            });
+
+            test('configures "output.path"', () => {
+                expect(subject().output?.path).toBe(
+                    path.join(process.cwd(), destination, 'bundle', 'shared')
+                );
+            });
+
+            describe('with custom "output.path"', () => {
+                const output = { path: path.resolve(process.cwd(), 'foo') };
+
+                beforeEach(() => (options = { emitExposedDependencies: { output } }));
+
+                test('use custom "output.path"', () => {
+                    expect(subject().output?.path).toBe(path.join(output.path, 'shared'));
+                });
+            });
+
+            test('configures WebpackAssetsManifest plugin', () => {
+                expect(subject().plugins).toContainEqual(
+                    new WebpackAssetsManifest({
+                        entrypoints: true,
+                        output: 'entrypoints.json',
+                        transform: expect.any(Function),
+                        done: expect.any(Function),
+                    })
+                );
+            });
+
+            test('generates exposed-dependencies-metadata.json when WebpackAssetsManifest plugin is done', () => {
+                const entryPointsPath = path.join(process.cwd(), destination, 'entrypoints.json');
+                const manifest = { getOutputPath: () => entryPointsPath };
+
+                subject();
+                const done: any = jest.mocked(WebpackAssetsManifest).mock.calls[0][0]?.done;
+                done(manifest);
+
+                const metadataPath = `${destination}/exposed-dependencies-metadata.json`;
+                const metadata = JSON.parse(mockFS.readFileSync(metadataPath, 'utf-8'));
+                expect(metadata).toEqual({ entryPointsPath });
+            });
+
+            test('configures RemoveEmptyScriptsPlugin plugin', () => {
+                expect(subject().plugins).toContainEqual(new RemoveEmptyScriptsPlugin());
+            });
+
+            test('configures "cache"', () => {
+                expect(subject().cache).toEqual({
+                    type: 'filesystem',
+                    version: expect.any(String),
+                });
+            });
+
+            describe('with package-lock.json', () => {
+                beforeEach(() => volumeFromJSON({ '../package-lock.json': {} }));
+
+                test('configures "cache.buildDependencies"', () => {
+                    expect(subject().cache).toEqual(
+                        expect.objectContaining({
+                            buildDependencies: {
+                                packageLock: [path.resolve('../package-lock.json')],
+                            },
+                        })
+                    );
+                });
+            });
+
+            test('configures "infrastructureLogging', () => {
+                expect(subject().infrastructureLogging).toEqual({ level: 'error' });
+            });
+
+            test('sets "optimization.runtimeChunk" to false', () => {
+                expect(subject().optimization?.runtimeChunk).toBe(false);
+            });
+
+            test('omits "devServer" configuration', () => {
+                expect(subject().devServer).toBeUndefined();
+            });
+
+            test('omits "externals" configuration', () => {
+                expect(subject().externals).toBeUndefined();
+            });
+
+            test('omits EXPOSED_* globals ', () => {
+                subject();
+
+                expect(DefinePlugin).not.toHaveBeenCalled();
+            });
+
+            test('omits HtmlWebpackPlugin plugin', () => {
+                subject();
+
+                expect(HtmlWebpackPlugin).not.toHaveBeenCalled();
+            });
+
+            describe('when in production', () => {
+                beforeEach(() => (overrides.configuration = { mode: 'production' }));
+
+                test('configures "output.clean" to true', () => {
+                    expect(subject().output?.clean).toBe(true);
+                });
+            });
         });
     });
 });