@servicetitan/startup 36.0.0 → 36.1.1-beta.1

package/src/cli/commands/__tests__/bundle-vite.test.ts

@@ -0,0 +1,228 @@
+import { build, createServer, preview as previewServer } from 'vite';
+import { getBuildName, stringifyConfig } from '../../../core';
+import { hasHeadlessBundle, isExposeSharedDependencies, isWebComponent, log } from '../../../utils';
+import { buildSharedDependencies } from '../../../vite/build-shared-dependencies';
+import { createViteConfig } from '../../../vite/config';
+import { validateViteSharedDependencies } from '../../../vite/validate-shared-dependencies';
+import { BundleVite } from '../bundle-vite';
+
+jest.mock('vite', () => ({
+    build: jest.fn(),
+    createServer: jest.fn(),
+    preview: jest.fn(),
+}));
+jest.mock('../../../core', () => ({
+    ...jest.requireActual('../../../core'),
+    getBuildName: jest.fn(() => 'test-app'),
+    stringifyConfig: jest.fn(() => 'config-string'),
+}));
+jest.mock('../../../utils', () => ({
+    ...jest.requireActual('../../../utils'),
+    hasHeadlessBundle: jest.fn(() => false),
+    isExposeSharedDependencies: jest.fn(() => true),
+    isWebComponent: jest.fn(() => false),
+    log: { text: jest.fn() },
+}));
+jest.mock('../../../vite/build-shared-dependencies', () => ({
+    buildSharedDependencies: jest.fn(),
+}));
+jest.mock('../../../vite/config', () => ({
+    createViteConfig: jest.fn(),
+}));
+jest.mock('../../../vite/validate-shared-dependencies', () => ({
+    validateViteSharedDependencies: jest.fn(),
+}));
+
+describe(BundleVite.name, () => {
+    let args: ConstructorParameters<typeof BundleVite>[0];
+    let viteConfig: any;
+    let mockServer: any;
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+        args = {};
+        viteConfig = { server: { port: 8080 } };
+        jest.mocked(createViteConfig).mockResolvedValue(viteConfig);
+        mockServer = {
+            listen: jest.fn(),
+            printUrls: jest.fn(),
+            bindCLIShortcuts: jest.fn(),
+        };
+        jest.mocked(createServer).mockResolvedValue(mockServer);
+        jest.mocked(previewServer).mockResolvedValue(mockServer);
+    });
+
+    const subject = () => new BundleVite(args).execute();
+
+    const itServesApp = () => {
+        test('starts server', async () => {
+            await subject();
+
+            expect(mockServer.listen).toHaveBeenCalled();
+            expect(mockServer.printUrls).toHaveBeenCalled();
+            expect(mockServer.bindCLIShortcuts).toHaveBeenCalledWith({ print: true });
+        });
+    };
+
+    test('validates shared dependencies', async () => {
+        await subject();
+
+        expect(validateViteSharedDependencies).toHaveBeenCalled();
+    });
+
+    test('builds with vite', async () => {
+        await subject();
+
+        expect(createViteConfig).toHaveBeenCalledWith(
+            expect.objectContaining({ name: getBuildName() })
+        );
+        expect(build).toHaveBeenCalledWith(viteConfig);
+    });
+
+    describe('with "printConfig"', () => {
+        beforeEach(() => (args.printConfig = true));
+
+        test('only prints config', async () => {
+            await subject();
+
+            const configString = jest.mocked(stringifyConfig).mock.results[0].value;
+            expect(log.text).toHaveBeenCalledWith(configString);
+            expect(build).not.toHaveBeenCalled();
+        });
+    });
+
+    describe('with "exposedDependencies"', () => {
+        beforeEach(() => (args.exposedDependencies = true));
+
+        test('only builds shared dependencies', async () => {
+            await subject();
+
+            expect(buildSharedDependencies).toHaveBeenCalledWith(
+                expect.objectContaining({ name: getBuildName() })
+            );
+            expect(build).not.toHaveBeenCalled();
+        });
+
+        describe('when not exposing shared dependencies', () => {
+            beforeEach(() => jest.mocked(isExposeSharedDependencies).mockReturnValue(false));
+
+            test('skips build', async () => {
+                await subject();
+
+                expect(buildSharedDependencies).not.toHaveBeenCalled();
+            });
+        });
+
+        describe('with "watch"', () => {
+            beforeEach(() => (args.watch = true));
+
+            test('throws error', async () => {
+                await expect(subject()).rejects.toThrow(
+                    'cannot bundle exposed dependencies in watch mode'
+                );
+            });
+        });
+    });
+
+    describe('with "watch"', () => {
+        beforeEach(() => (args.watch = true));
+
+        test('starts dev server', async () => {
+            await subject();
+
+            expect(createServer).toHaveBeenCalledWith(viteConfig);
+        });
+
+        itServesApp();
+
+        test('sets non-production mode', async () => {
+            await subject();
+
+            expect(createViteConfig).toHaveBeenCalledWith(
+                expect.objectContaining({ isProduction: false })
+            );
+        });
+
+        describe('when server omits listen', () => {
+            beforeEach(() => {
+                jest.mocked(createServer).mockResolvedValue({
+                    printUrls: mockServer.printUrls,
+                    bindCLIShortcuts: mockServer.bindCLIShortcuts,
+                } as any);
+            });
+
+            test('skips listen', async () => {
+                await subject();
+
+                expect(mockServer.listen).not.toHaveBeenCalled();
+            });
+        });
+    });
+
+    describe('with "useWatchConfig"', () => {
+        beforeEach(() => (args.useWatchConfig = true));
+
+        test('sets non-production mode', async () => {
+            await subject();
+
+            expect(createViteConfig).toHaveBeenCalledWith(
+                expect.objectContaining({ isProduction: false })
+            );
+        });
+    });
+
+    describe('with "preview"', () => {
+        beforeEach(() => (args.preview = true));
+
+        test('builds then starts preview server', async () => {
+            await subject();
+
+            expect(build).toHaveBeenCalledWith(viteConfig);
+            expect(previewServer).toHaveBeenCalledWith({
+                ...viteConfig,
+                preview: { port: viteConfig.server?.port, open: true },
+            });
+        });
+
+        itServesApp();
+
+        describe('when config has no server', () => {
+            beforeEach(() => {
+                viteConfig = {};
+                jest.mocked(createViteConfig).mockResolvedValue(viteConfig);
+            });
+
+            test('sets preview port to undefined', async () => {
+                await subject();
+
+                expect(previewServer).toHaveBeenCalledWith(
+                    expect.objectContaining({
+                        preview: { port: undefined, open: true },
+                    })
+                );
+            });
+        });
+    });
+
+    describe('when web component', () => {
+        beforeEach(() => jest.mocked(isWebComponent).mockReturnValue(true));
+
+        test('builds light bundle', async () => {
+            await subject();
+
+            expect(createViteConfig).toHaveBeenCalledWith(expect.objectContaining({ light: true }));
+        });
+
+        describe('with headless bundle', () => {
+            beforeEach(() => jest.mocked(hasHeadlessBundle).mockReturnValue(true));
+
+            test('builds headless bundle', async () => {
+                await subject();
+
+                expect(createViteConfig).toHaveBeenCalledWith(
+                    expect.objectContaining({ headless: true })
+                );
+            });
+        });
+    });
+});

package/src/cli/commands/__tests__/{bundle-package.test.ts → bundle-webpack.test.ts}

@@ -1,7 +1,7 @@
 import { fs, vol } from 'memfs';
 import { log } from '../../../utils';
-import { bundle } from '../../utils';
-import { BundlePackage } from '../bundle-package';
+import { bundleWebpack } from '../../../webpack';
+import { BundleWebpack } from '../bundle-webpack';
 
 jest.mock('fs', () => fs);
 
@@ -9,30 +9,31 @@ jest.mock('../../../utils', () => ({
     ...jest.requireActual('../../../utils'),
     log: { warning: jest.fn() },
 }));
-jest.mock('../../utils', () => ({
-    ...jest.requireActual('../../utils'),
-    bundle: jest.fn().mockResolvedValue(undefined),
+jest.mock('../../../webpack', () => ({
+    ...jest.requireActual('../../../webpack'),
+    bundleWebpack: jest.fn().mockResolvedValue(undefined),
 }));
 
-describe(`[startup] ${BundlePackage.name}`, () => {
-    let args: ConstructorParameters<typeof BundlePackage>[0];
+describe(`[startup] ${BundleWebpack.name}`, () => {
+    let args: ConstructorParameters<typeof BundleWebpack>[0];
 
     beforeEach(() => {
         args = {};
         jest.resetAllMocks();
         vol.fromJSON({
+            'package.json': JSON.stringify({ name: 'test' }),
             'tsconfig.json': JSON.stringify({ compilerOptions: { module: 'esnext' } }),
         });
     });
 
     afterEach(() => vol.reset());
 
-    const subject = async () => new BundlePackage(args).execute();
+    const subject = async () => new BundleWebpack(args).execute();
 
     test('bundles the package', async () => {
         await subject();
 
-        expect(bundle).toHaveBeenCalledWith({ buildStat: false, config: undefined });
+        expect(bundleWebpack).toHaveBeenCalledWith({ buildStat: false, config: undefined });
     });
 
     describe('with "stat"', () => {
@@ -41,7 +42,9 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('generates bundle report', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(expect.objectContaining({ buildStat: true }));
+            expect(bundleWebpack).toHaveBeenCalledWith(
+                expect.objectContaining({ buildStat: true })
+            );
         });
     });
 
@@ -51,7 +54,9 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('bundles with code coverage', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(expect.objectContaining({ codeCoverage: true }));
+            expect(bundleWebpack).toHaveBeenCalledWith(
+                expect.objectContaining({ codeCoverage: true })
+            );
         });
     });
 
@@ -61,7 +66,9 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('uses specified config file', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(expect.objectContaining({ config: args.config }));
+            expect(bundleWebpack).toHaveBeenCalledWith(
+                expect.objectContaining({ config: args.config })
+            );
         });
 
         describe('with "exposed-dependencies"', () => {
@@ -70,7 +77,7 @@ describe(`[startup] ${BundlePackage.name}`, () => {
             test('ignores config file', async () => {
                 await subject();
 
-                expect(bundle).not.toHaveBeenCalledWith(
+                expect(bundleWebpack).not.toHaveBeenCalledWith(
                     expect.objectContaining({ config: args.config })
                 );
             });
@@ -83,7 +90,7 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('bundles exposed dependencies', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(
+            expect(bundleWebpack).toHaveBeenCalledWith(
                 expect.objectContaining({ emitExposedDependencies: true })
             );
         });
@@ -95,7 +102,7 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('bundles package in watch mode', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(expect.objectContaining({ watch: true }));
+            expect(bundleWebpack).toHaveBeenCalledWith(expect.objectContaining({ watch: true }));
         });
 
         describe('with "config"', () => {
@@ -104,7 +111,7 @@ describe(`[startup] ${BundlePackage.name}`, () => {
             test('uses specified config file', async () => {
                 await subject();
 
-                expect(bundle).toHaveBeenCalledWith(
+                expect(bundleWebpack).toHaveBeenCalledWith(
                     expect.objectContaining({ config: args.config, watch: true })
                 );
             });
@@ -117,7 +124,9 @@ describe(`[startup] ${BundlePackage.name}`, () => {
         test('bundles package with useWatchConfig', async () => {
             await subject();
 
-            expect(bundle).toHaveBeenCalledWith(expect.objectContaining({ useWatchConfig: true }));
+            expect(bundleWebpack).toHaveBeenCalledWith(
+                expect.objectContaining({ useWatchConfig: true })
+            );
         });
     });
 

package/src/cli/commands/__tests__/install.test.ts

@@ -1,12 +1,16 @@
 import { execSync } from 'child_process';
-import { getStartupVersion, log } from '../../../utils';
+import { getStartupVersion } from '../../../core';
+import { log } from '../../../utils';
 import { Install } from '../install';
 import { entry } from '../registry/install';
 
 jest.mock('child_process', () => ({ execSync: jest.fn() }));
+jest.mock('../../../core', () => ({
+    ...jest.requireActual('../../../core'),
+    getStartupVersion: jest.fn(),
+}));
 jest.mock('../../../utils', () => ({
     ...jest.requireActual('../../../utils'),
-    getStartupVersion: jest.fn(),
     log: { debug: jest.fn(), info: jest.fn() }, // suppress log output
 }));
 

package/src/cli/commands/__tests__/mfe-generate-metadata.test.ts

@@ -1,8 +1,11 @@
 import { fs, vol } from 'memfs';
 import path from 'node:path';
-import { getPackageData, getStartupVersion, loadSharedDependencies, log } from '../../../utils';
-import { getLaunchDarklySdkVersion } from '../../../webpack/configs/utils/get-launchdarkly-sdk-version';
-import { getWebComponentsVersion } from '../../../webpack/configs/utils/get-web-components-version';
+import {
+    getLaunchDarklySdkVersion,
+    getStartupVersion,
+    getWebComponentsVersion,
+} from '../../../core';
+import { getPackageData, loadSharedDependencies, log } from '../../../utils';
 import { MfeGenerateMetadata } from '../mfe-generate-metadata';
 import { entry } from '../registry/mfe-generate-metadata';
 
@@ -11,14 +14,14 @@ jest.mock('../../../utils', () => ({
     ...jest.requireActual('../../../utils'),
     log: { info: jest.fn() },
 }));
-jest.mock('../../../webpack/configs/utils/get-web-components-version', () => ({
-    getWebComponentsVersion: jest.fn(() => '1.0.0'),
-}));
-jest.mock('../../../utils/get-startup-version', () => ({
-    getStartupVersion: jest.fn(() => '33.0.0'),
-}));
-jest.mock('../../../webpack/configs/utils/get-launchdarkly-sdk-version', () => ({
+/*
+ * Mock get-version (not core) because internal modules import from get-version
+ * directly. Mocking the core barrel doesn't intercept those internal imports.
+ */
+jest.mock('../../../core/get-version', () => ({
     getLaunchDarklySdkVersion: jest.fn(() => '3.4.5'),
+    getStartupVersion: jest.fn(() => '33.0.0'),
+    getWebComponentsVersion: jest.fn(() => '1.0.0'),
 }));
 
 describe(`[startup] ${MfeGenerateMetadata.name}`, () => {

package/src/cli/commands/__tests__/mfe-publish.test.ts

@@ -50,7 +50,7 @@ describe(`[startup] ${MFEPublish.name}`, () => {
         } catch {
             /* ignore */
         }
-        expect(getPackages).toHaveBeenCalledWith({ type: PackageType.Webpack });
+        expect(getPackages).toHaveBeenCalledWith({ type: PackageType.Bundle });
     });
 
     describe('with no packages', () => {
@@ -76,7 +76,7 @@ describe(`[startup] ${MFEPublish.name}`, () => {
         }
 
         beforeEach(() => {
-            packages.push(createPackage({ type: PackageType.Webpack }));
+            packages.push(createPackage({ type: PackageType.Bundle }));
             mockPackageJson(packages);
         });
 
@@ -226,12 +226,12 @@ describe(`[startup] ${MFEPublish.name}`, () => {
                 packages.push(
                     createPackage({
                         name: '@servicetitan/bar',
-                        type: PackageType.Webpack,
+                        type: PackageType.Bundle,
                         location: 'packages/bar',
                     }),
                     createPackage({
                         name: '@servicetitan/baz',
-                        type: PackageType.Webpack,
+                        type: PackageType.Bundle,
                         location: 'packages/baz',
                     })
                 );

package/src/cli/commands/__tests__/start.test.ts

@@ -121,7 +121,7 @@ describe(`[startup] ${Start.name}`, () => {
     });
 
     describe('with Webpack package', () => {
-        beforeEach(() => packages.push(createPackage({ type: PackageType.Webpack })));
+        beforeEach(() => packages.push(createPackage({ type: PackageType.Bundle })));
 
         itPreparesThePackages();
         itRunsCompileAndTypeCheck();

package/src/cli/commands/build.ts

@@ -11,7 +11,7 @@ enum BuildProcesses {
     PreparePackage,
     TypeCheck,
     BundleExposedDependencies,
-    BundlePackage,
+    Bundle,
 }
 
 export class Build extends Command<typeof entry> {
@@ -20,11 +20,13 @@ export class Build extends Command<typeof entry> {
         checkArgs(this.args, { obsolete: ['--esbuild', '--experimental-bundlers'] });
 
         const useTsc = this.args.useTsc;
+        const useVite = this.args.useVite;
+        const cmd = useVite ? 'startup bundle-vite' : 'startup bundle-package';
 
         const packages = getPackages({
             scope: this.args.scope,
             ignore: this.args.ignore,
-            type: [PackageType.TSC, PackageType.Webpack],
+            type: [PackageType.TSC, PackageType.Bundle],
         });
         if (packages.length === 0) {
             return;
@@ -35,8 +37,8 @@ export class Build extends Command<typeof entry> {
         }
 
         const scope = packages.map(({ name }) => name);
-        const webpackScope = packages
-            .filter(({ type }) => type === PackageType.Webpack)
+        const bundleScope = packages
+            .filter(({ type }) => type === PackageType.Bundle)
             .map(({ name }) => name);
         const precompileScope = packages
             .filter(({ scripts }) => !!scripts?.precompile)
@@ -72,12 +74,12 @@ export class Build extends Command<typeof entry> {
         processTree.add(
             BuildProcesses.BundleExposedDependencies,
             () => {
-                if (webpackScope.length === 0) {
+                if (bundleScope.length === 0) {
                     return Promise.resolve();
                 }
                 return lernaExec({
-                    'cmd': 'startup bundle-package',
-                    'scope': webpackScope,
+                    cmd,
+                    'scope': bundleScope,
                     'parallel': true,
                     'stream': true,
                     '--': ['--exposed-dependencies'],
@@ -92,20 +94,21 @@ export class Build extends Command<typeof entry> {
             }
         );
         processTree.add(
-            BuildProcesses.BundlePackage,
+            BuildProcesses.Bundle,
             () => {
-                if (webpackScope.length === 0) {
+                if (bundleScope.length === 0) {
                     return Promise.resolve();
                 }
 
                 return lernaExec({
-                    'cmd': 'startup bundle-package',
-                    'scope': webpackScope,
+                    cmd,
+                    'scope': bundleScope,
                     'stream': true,
                     '--': [
                         ...[this.args.config ? `--config "${this.args.config}"` : undefined],
                         ...[this.args.codeCoverage ? '--code-coverage' : undefined],
                         ...[this.args.stat ? '--stat' : undefined],
+                        ...[useVite && this.args.preview ? '--preview' : undefined],
                     ].filter(item => !!item) as string[],
                 });
             },

package/src/cli/commands/bundle-vite.ts

@@ -0,0 +1,82 @@
+import { build, createServer, preview as previewServer } from 'vite';
+import { BuildContextOptions, getBuildName, stringifyConfig } from '../../core';
+import {
+    hasHeadlessBundle,
+    isExposeSharedDependencies,
+    isWebComponent,
+    log,
+    logErrors,
+} from '../../utils';
+import { buildSharedDependencies } from '../../vite/build-shared-dependencies';
+import { createViteConfig } from '../../vite/config';
+import { validateViteSharedDependencies } from '../../vite/validate-shared-dependencies';
+import { entry } from './registry/bundle-vite';
+import { Command } from './types';
+
+export class BundleVite extends Command<typeof entry> {
+    @logErrors
+    async execute() {
+        validateViteSharedDependencies();
+
+        const { preview = false, useWatchConfig = false, watch = false } = this.args;
+        const isProduction = !(watch || useWatchConfig);
+
+        const options: BuildContextOptions = {
+            name: getBuildName(),
+            isProduction,
+        };
+
+        if (this.args.printConfig) {
+            const config = await createViteConfig(options);
+            log.text(stringifyConfig(config));
+            return;
+        }
+
+        if (this.args.exposedDependencies) {
+            if (watch) {
+                throw new Error('cannot bundle exposed dependencies in watch mode');
+            }
+            if (!isExposeSharedDependencies()) {
+                return;
+            }
+            await buildSharedDependencies(options);
+            return;
+        }
+
+        if (isWebComponent()) {
+            // Start builds sequentially to avoid I/O contention during startup
+            await buildAndServe({ ...options, light: true }, { watch });
+            if (hasHeadlessBundle()) {
+                await buildAndServe({ ...options, headless: true }, { watch });
+            }
+        }
+
+        await buildAndServe(options, { watch, preview });
+    }
+}
+
+async function buildAndServe(
+    options: BuildContextOptions,
+    { watch, preview = false }: { watch: boolean; preview?: boolean }
+): Promise<void> {
+    const config = await createViteConfig(options);
+    if (watch) {
+        await serve(config);
+        return;
+    }
+
+    await build(config);
+    if (preview) {
+        await serve({ ...config, preview: { port: config.server?.port, open: true } }, true);
+    }
+}
+
+async function serve(config: import('vite').InlineConfig, preview = false) {
+    const server = preview ? await previewServer(config) : await createServer(config);
+    if ('listen' in server) {
+        await server.listen();
+    }
+    server.printUrls();
+    server.bindCLIShortcuts({ print: true });
+    return server;
+}

package/src/cli/commands/{bundle-package.ts → bundle-webpack.ts}

@@ -1,11 +1,14 @@
-import { getTsConfig, log, logErrors } from '../../utils';
-import { bundle, getModuleType } from '../utils';
-import type { entry } from './registry/bundle-package';
+import { getTsConfig, log, logErrors, validateSharedDependencies } from '../../utils';
+import { bundleWebpack } from '../../webpack';
+import { getModuleType } from '../utils';
+import type { entry } from './registry/bundle-webpack';
 import { Command } from './types';
 
-export class BundlePackage extends Command<typeof entry> {
+export class BundleWebpack extends Command<typeof entry> {
     @logErrors
     async execute() {
+        validateSharedDependencies();
+
         const {
             config,
             codeCoverage,
@@ -21,13 +24,13 @@ export class BundlePackage extends Command<typeof entry> {
             );
         }
 
-        const options: Parameters<typeof bundle>[0] = {
+        const options: Parameters<typeof bundleWebpack>[0] = {
             ...(emitExposedDependencies ? {} : { config }),
             codeCoverage,
             emitExposedDependencies,
             useWatchConfig,
         };
 
-        await bundle({ buildStat: stat, ...options, watch });
+        await bundleWebpack({ buildStat: stat, ...options, watch });
     }
 }

package/src/cli/commands/install.ts

@@ -1,5 +1,6 @@
 import { execSync } from 'child_process';
-import { getStartupVersion, log, logErrors } from '../../utils';
+import { getStartupVersion } from '../../core';
+import { log, logErrors } from '../../utils';
 import type { entry } from './registry/install';
 import { Command } from './types';
 

package/src/cli/commands/mfe-check.ts

@@ -1,5 +1,6 @@
 import { getVersionMismatches } from '@servicetitan/startup-utils';
 import path from 'node:path';
+import { getExposedDependencies, Metadata } from '../../core';
 import {
     isWebComponent,
     loadSharedDependencies,
@@ -8,8 +9,6 @@ import {
     readJson,
     toArray,
 } from '../../utils';
-import { Metadata } from '../../webpack/configs/types';
-import { getExposedDependencies } from '../../webpack/configs/utils';
 import type { entry } from './registry/mfe-check';
 import { Command } from './types';