@servicetitan/startup 36.0.0 → 36.1.1-beta.1

package/src/vite/plugins/__tests__/ignore-modules-plugin.test.ts

@@ -0,0 +1,80 @@
+import { BuildContext, checkResource } from '../../../core';
+import { ignoreModulesPlugin } from '../ignore-modules-plugin';
+
+jest.mock('../../../core', () => ({
+    checkResource: jest.fn(),
+}));
+
+describe(ignoreModulesPlugin.name, () => {
+    const VIRTUAL_PREFIX = '\0IGNORE';
+    const moduleName = 'some-module';
+    const context = {} as BuildContext;
+    const checker = jest.fn();
+
+    beforeEach(() => {
+        jest.mocked(checkResource).mockReturnValue(checker);
+        checker.mockReturnValue(false);
+    });
+
+    const subject = () => ignoreModulesPlugin(context);
+
+    test('creates plugin with correct name', () => {
+        expect(subject().name).toBe('ignore-modules');
+    });
+
+    describe('resolveId', () => {
+        let importer: string | undefined;
+
+        beforeEach(() => (importer = '/importer.ts'));
+
+        const subject = () => {
+            const plugin = ignoreModulesPlugin(context);
+            return (plugin.resolveId as Function).call(plugin, moduleName, importer);
+        };
+
+        const itReturnsUndefined = () => {
+            test('returns undefined', () => {
+                expect(subject()).toBeUndefined();
+            });
+        };
+
+        itReturnsUndefined();
+
+        describe('when module is ignored', () => {
+            beforeEach(() => checker.mockReturnValue(true));
+
+            test('returns virtual id', () => {
+                expect(subject()).toBe(`${VIRTUAL_PREFIX}${moduleName}`);
+            });
+
+            describe('when importer is not provided', () => {
+                beforeEach(() => (importer = undefined));
+
+                itReturnsUndefined();
+            });
+        });
+    });
+
+    describe('load', () => {
+        let id: string;
+
+        beforeEach(() => (id = moduleName));
+
+        const subject = () => {
+            const plugin = ignoreModulesPlugin(context);
+            return (plugin.load as Function).call(plugin, id);
+        };
+
+        test('returns undefined', () => {
+            expect(subject()).toBeUndefined();
+        });
+
+        describe('when id has virtual prefix', () => {
+            beforeEach(() => (id = `${VIRTUAL_PREFIX}${moduleName}`));
+
+            test('returns empty export', () => {
+                expect(subject()).toBe('export default {}');
+            });
+        });
+    });
+});

package/src/vite/plugins/__tests__/metadata-plugin.test.ts

@@ -0,0 +1,163 @@
+import { fs, vol } from 'memfs';
+import type { OutputBundle } from 'rolldown';
+import { type BuildContext, generateMetadata } from '../../../core';
+import { metadataPlugin } from '../metadata-plugin';
+
+jest.mock('fs', () => fs);
+jest.mock('../../../core', () => ({
+    generateMetadata: jest.fn(),
+}));
+
+describe(metadataPlugin.name, () => {
+    let context: BuildContext;
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+        vol.fromJSON({});
+        context = {
+            package: { isWebComponent: true },
+        } as BuildContext;
+    });
+
+    afterEach(() => vol.reset());
+
+    const subject = () => metadataPlugin(context);
+
+    describe('when package is not a web component', () => {
+        beforeEach(() => (context.package.isWebComponent = false));
+
+        test('returns undefined', () => {
+            expect(subject()).toBeUndefined();
+        });
+    });
+
+    test('returns plugin with correct name', () => {
+        expect(subject()!.name).toBe('metadata');
+    });
+
+    const defaultAddress = { port: 3000 };
+
+    const setupServer = ({
+        outDir,
+        address = () => defaultAddress,
+    }: {
+        outDir: string;
+        address?: () => unknown;
+    }) => {
+        const plugin = subject()!;
+        (plugin.configResolved as Function).call(plugin, {
+            build: { outDir },
+        });
+
+        let listener!: Function;
+        const server: any = {
+            httpServer: {
+                once: (_event: string, cb: Function) => (listener = cb),
+                address,
+            },
+        };
+        (plugin.configureServer as Function).call(plugin, server);
+        listener();
+    };
+
+    describe('configResolved', () => {
+        const outDir = '/custom-output';
+
+        beforeEach(() => setupServer({ outDir }));
+
+        test('captures outDir for use by configureServer', () => {
+            expect(fs.existsSync(`${outDir}/entrypoints.json`)).toBe(true);
+        });
+    });
+
+    describe('configureServer', () => {
+        const outDir = '/output';
+
+        test('writes entrypoints.json', () => {
+            setupServer({ outDir });
+
+            const written = JSON.parse(
+                fs.readFileSync(`${outDir}/entrypoints.json`, 'utf8') as string
+            );
+            expect(written).toEqual({
+                module: true,
+                port: defaultAddress.port,
+                css: [],
+                js: ['@vite/client', '@id/__x00__VIRTUAL./index'],
+            });
+        });
+
+        test('calls generateMetadata', () => {
+            setupServer({ outDir });
+
+            expect(generateMetadata).toHaveBeenCalledWith(context);
+        });
+
+        describe('when address is a string', () => {
+            beforeEach(() => setupServer({ outDir, address: () => 'pipe-path' }));
+
+            test('does not write entrypoints', () => {
+                expect(fs.existsSync(`${outDir}/entrypoints.json`)).toBe(false);
+            });
+
+            test('does not generate metadata', () => {
+                expect(generateMetadata).not.toHaveBeenCalled();
+            });
+        });
+    });
+
+    describe('writeBundle', () => {
+        const bundle = {
+            'main.js': { type: 'chunk', isEntry: true, fileName: 'assets/main.js' },
+            'vendor.js': { type: 'chunk', isEntry: false, fileName: 'assets/vendor.js' },
+            'style.css': { type: 'asset', fileName: 'assets/style.css' },
+        } as unknown as OutputBundle;
+
+        let options: { dir?: string };
+
+        beforeEach(() => {
+            options = { dir: '/build' };
+            fs.mkdirSync(options.dir!, { recursive: true });
+        });
+
+        const subject = () => {
+            const plugin = metadataPlugin(context)!;
+            return (plugin.writeBundle as Function).call(plugin, options, bundle);
+        };
+
+        test('writes entrypoints.json with entry JS and CSS files', () => {
+            subject();
+
+            const entries = Object.values(bundle);
+            const expectedJs = entries
+                .filter(e => e.type === 'chunk' && e.isEntry)
+                .map(e => e.fileName);
+            const expectedCss = entries
+                .filter(e => e.type === 'asset' && e.fileName.endsWith('.css'))
+                .map(e => e.fileName);
+
+            const written = JSON.parse(
+                fs.readFileSync(`${options.dir}/entrypoints.json`, 'utf8') as string
+            );
+            expect(written).toEqual({
+                module: true,
+                css: expectedCss,
+                js: expectedJs,
+            });
+        });
+
+        test('calls generateMetadata', () => {
+            subject();
+
+            expect(generateMetadata).toHaveBeenCalledWith(context);
+        });
+
+        describe('when options.dir is not set', () => {
+            beforeEach(() => (options.dir = undefined));
+
+            test('throws error', () => {
+                expect(() => subject()).toThrow('web-component build requires output.dir');
+            });
+        });
+    });
+});

package/src/vite/plugins/__tests__/shared-dependencies-plugin.test.ts

@@ -0,0 +1,427 @@
+import path from 'path';
+import { bundleConstants, generateExposedDependenciesMetadata } from '../../../core';
+import {
+    sharedDependenciesPlugin,
+    type SharedDependenciesPluginOptions,
+} from '../shared-dependencies-plugin';
+
+jest.mock('../../../core', () => ({
+    bundleConstants: {
+        mode: { production: 'production', development: 'development' },
+    },
+    generateExposedDependenciesMetadata: jest.fn(),
+}));
+
+describe(sharedDependenciesPlugin.name, () => {
+    const CSS_VIRTUAL_PREFIX = '\0SHARED_DEPENDENCY_CSS';
+    const mockDependencies: Record<string, string> = {
+        'react': 'globalReact',
+        '@scope/lib': 'globalScopeLib',
+    };
+
+    let options: SharedDependenciesPluginOptions;
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+        options = {
+            dependencies: mockDependencies,
+        };
+    });
+
+    const subject = () => sharedDependenciesPlugin(options);
+
+    test('returns plugin with correct name', () => {
+        expect(subject().name).toBe('shared-dependencies');
+    });
+
+    test('enforces pre', () => {
+        expect(subject().enforce).toBe('pre');
+    });
+
+    describe('config', () => {
+        let mode: string;
+
+        beforeEach(() => {
+            mode = bundleConstants.mode.development;
+        });
+
+        const subject = () => {
+            const plugin = sharedDependenciesPlugin(options);
+            return (plugin.config as Function).call(plugin, {}, { mode });
+        };
+
+        test('sets base to relative path', () => {
+            expect(subject().base).toBe('./');
+        });
+
+        test('defines process.env.NODE_ENV from mode', () => {
+            expect(subject().define['process.env.NODE_ENV']).toBe(JSON.stringify(mode));
+        });
+
+        test('creates input entry for each dependency', () => {
+            const { input } = subject().build.rolldownOptions;
+
+            const expected: Record<string, string> = {};
+            for (const dependency of Object.keys(options.dependencies)) {
+                expected[dependency.replace('/', '-')] = dependency;
+            }
+            expect(input).toEqual(expected);
+        });
+
+        test('uses CJS format with named exports', () => {
+            expect(subject().build.rolldownOptions.output).toEqual(
+                expect.objectContaining({ format: 'cjs', exports: 'named' })
+            );
+        });
+
+        test('preserves entry signatures', () => {
+            expect(subject().build.rolldownOptions.preserveEntrySignatures).toBe('exports-only');
+        });
+
+        test('disables treeshake', () => {
+            expect(subject().build.rolldownOptions.treeshake).toBe(false);
+        });
+
+        test('configures entry and chunk file names', () => {
+            expect(subject().build.rolldownOptions.output).toEqual(
+                expect.objectContaining({
+                    entryFileNames: '[name].cjs.js',
+                    chunkFileNames: '_[name]-[hash].js',
+                })
+            );
+        });
+
+        describe('with CSS entries', () => {
+            beforeEach(() => {
+                options.css = { 'design-system': ['tokens.css'] };
+            });
+
+            test('adds CSS virtual inputs', () => {
+                const { input } = subject().build.rolldownOptions;
+
+                for (const name of Object.keys(options.css!)) {
+                    expect(input[name]).toBe(CSS_VIRTUAL_PREFIX + name);
+                }
+            });
+        });
+
+        describe('assetFileNames', () => {
+            let assetNames: string[];
+
+            beforeEach(() => {
+                assetNames = ['font.woff2'];
+            });
+
+            const subject = () => {
+                const plugin = sharedDependenciesPlugin(options);
+                const config = (plugin.config as Function).call(plugin, {}, { mode });
+                return config.build.rolldownOptions.output.assetFileNames({ names: assetNames });
+            };
+
+            test('generates name from asset', () => {
+                expect(subject()).toBe('font[extname]');
+            });
+
+            describe('when asset is CSS', () => {
+                beforeEach(() => (assetNames = ['styles.css']));
+
+                test('adds bundle suffix', () => {
+                    expect(subject()).toBe('styles.bundle[extname]');
+                });
+            });
+
+            describe('when asset has scope prefix', () => {
+                beforeEach(() => (assetNames = ['@scope-lib.css']));
+
+                test('strips scope prefix', () => {
+                    expect(subject()).toBe('lib.bundle[extname]');
+                });
+            });
+
+            describe('when production', () => {
+                beforeEach(() => (mode = bundleConstants.mode.production));
+
+                test('includes hash in filename', () => {
+                    expect(subject()).toBe('font.[hash][extname]');
+                });
+
+                describe('when asset is CSS', () => {
+                    beforeEach(() => (assetNames = ['styles.css']));
+
+                    test('includes hash in filename', () => {
+                        expect(subject()).toBe('styles.[hash].bundle[extname]');
+                    });
+                });
+            });
+        });
+    });
+
+    describe('resolveId', () => {
+        const knownDependency = Object.keys(mockDependencies)[0];
+
+        let source: string;
+        let importer: string | undefined;
+
+        beforeEach(() => {
+            source = knownDependency;
+            importer = '/path/to/file.ts';
+        });
+
+        const subject = () => {
+            const plugin = sharedDependenciesPlugin(options);
+            return (plugin.resolveId as Function).call(plugin, source, importer);
+        };
+
+        const itReturnsUndefined = () => {
+            test('returns undefined', () => {
+                expect(subject()).toBeUndefined();
+            });
+        };
+
+        test('marks dependency as external', () => {
+            expect(subject()).toEqual({ id: source, external: true });
+        });
+
+        describe('when source is CSS virtual module', () => {
+            beforeEach(() => (source = CSS_VIRTUAL_PREFIX + 'design-system'));
+
+            test('returns source', () => {
+                expect(subject()).toBe(source);
+            });
+        });
+
+        describe('when source is an unknown dependency', () => {
+            beforeEach(() => (source = 'unknown'));
+
+            itReturnsUndefined();
+        });
+
+        describe('when importer is not present', () => {
+            beforeEach(() => (importer = undefined));
+
+            itReturnsUndefined();
+        });
+    });
+
+    describe('load', () => {
+        const cssName = 'design-system';
+        const cssImports = ['tokens.css', 'fonts.css'];
+
+        let id: string;
+
+        beforeEach(() => {
+            id = CSS_VIRTUAL_PREFIX + cssName;
+            options.css = { [cssName]: cssImports };
+        });
+
+        const subject = () => {
+            const plugin = sharedDependenciesPlugin(options);
+            return (plugin.load as Function).call(plugin, id);
+        };
+
+        const itReturnsUndefined = () => {
+            test('returns undefined', () => {
+                expect(subject()).toBeUndefined();
+            });
+        };
+
+        test('returns import statements', () => {
+            expect(subject()).toBe(cssImports.map(p => `import '${p}';`).join('\n'));
+        });
+
+        describe('when id is not a CSS virtual module', () => {
+            beforeEach(() => (id = ''));
+
+            itReturnsUndefined();
+        });
+
+        describe('with unknown CSS module', () => {
+            beforeEach(() => (id = CSS_VIRTUAL_PREFIX + 'unknown'));
+
+            itReturnsUndefined();
+        });
+    });
+
+    describe('generateBundle', () => {
+        const sharedChunk = { fileName: '_helper-abc.js', code: 'helper code' };
+
+        let bundle: Record<string, any>;
+        let emitFile: jest.Mock;
+        let mode: string;
+
+        const entryFileName = (dependency: string) => `${dependency.replace('/', '-')}.cjs.js`;
+
+        beforeEach(() => {
+            mode = bundleConstants.mode.development;
+            emitFile = jest.fn();
+            bundle = {
+                [sharedChunk.fileName]: {
+                    type: 'chunk',
+                    isEntry: false,
+                    code: sharedChunk.code,
+                },
+                ...Object.fromEntries(
+                    Object.keys(mockDependencies).map(dependency => [
+                        entryFileName(dependency),
+                        { type: 'chunk', isEntry: true, code: `${dependency} code` },
+                    ])
+                ),
+                'styles.bundle.css': { type: 'asset' },
+            };
+        });
+
+        const subject = () => {
+            const plugin = sharedDependenciesPlugin(options);
+            (plugin.config as Function).call(plugin, {}, { mode });
+            (plugin.generateBundle as Function).call({ emitFile }, {}, bundle);
+        };
+
+        const emittedBundleCode = () => {
+            const call = emitFile.mock.calls.find((c: any) =>
+                c[0].fileName?.endsWith('.bundle.js')
+            );
+            return call[0].source as string;
+        };
+
+        const expectBundleContains = (...fragments: string[]) => {
+            const code = emittedBundleCode();
+            for (const fragment of fragments) {
+                expect(code).toContain(fragment);
+            }
+        };
+
+        test('emits shared bundle as asset', () => {
+            subject();
+
+            expect(emitFile).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    type: 'asset',
+                    fileName: 'shared.bundle.js',
+                })
+            );
+        });
+
+        test('emits entrypoints.json with CSS and JS files', () => {
+            subject();
+
+            expect(emitFile).toHaveBeenCalledWith({
+                type: 'asset',
+                fileName: 'entrypoints.json',
+                source: JSON.stringify(
+                    { css: ['styles.bundle.css'], js: ['shared.bundle.js'] },
+                    null,
+                    2
+                ),
+            });
+        });
+
+        test('includes dependency entry code in emitted bundle', () => {
+            subject();
+
+            expectBundleContains(
+                ...Object.keys(mockDependencies).flatMap(dependency => [
+                    `'${dependency}'`,
+                    `${dependency} code`,
+                ])
+            );
+        });
+
+        test('includes shared chunk code in emitted bundle', () => {
+            subject();
+
+            expectBundleContains(`'./${sharedChunk.fileName}'`, sharedChunk.code);
+        });
+
+        test('generates expose call for each dependency', () => {
+            subject();
+
+            expectBundleContains(
+                ...Object.entries(mockDependencies).map(
+                    ([dependency, variable]) => `expose('${variable}', '${dependency}')`
+                )
+            );
+        });
+
+        test('removes shared chunks from bundle', () => {
+            subject();
+
+            expect(bundle[sharedChunk.fileName]).toBeUndefined();
+        });
+
+        test('removes dependency entry chunks from bundle', () => {
+            subject();
+
+            for (const dependency of Object.keys(mockDependencies)) {
+                expect(bundle[entryFileName(dependency)]).toBeUndefined();
+            }
+        });
+
+        describe('when production', () => {
+            beforeEach(() => (mode = bundleConstants.mode.production));
+
+            test('includes hash in bundle filename', () => {
+                subject();
+
+                expect(emitFile.mock.calls[0][0].fileName).toMatch(
+                    /^shared\.[a-f0-9]+\.bundle\.js$/
+                );
+            });
+        });
+
+        describe('when dependency entry chunk is missing', () => {
+            const missingDependency = Object.keys(mockDependencies)[0];
+
+            beforeEach(() => delete bundle[entryFileName(missingDependency)]);
+
+            test('throws error', () => {
+                expect(() => subject()).toThrow(
+                    new RegExp(`Expected entry chunk for ${missingDependency}`)
+                );
+            });
+        });
+
+        describe('with CSS entries', () => {
+            beforeEach(() => {
+                options.css = { 'design-system': ['tokens.css'] };
+                bundle['design-system.cjs.js'] = { type: 'chunk', isEntry: true, code: '' };
+            });
+
+            test('removes CSS entry chunks from bundle', () => {
+                subject();
+
+                expect(bundle['design-system.cjs.js']).toBeUndefined();
+            });
+        });
+    });
+
+    describe('writeBundle', () => {
+        let outputDir: string;
+
+        beforeEach(() => (outputDir = '/output/dist'));
+
+        const subject = () => {
+            const plugin = sharedDependenciesPlugin(options);
+            return (plugin.writeBundle as Function).call(plugin, { dir: outputDir });
+        };
+
+        test('is undefined', () => {
+            expect(sharedDependenciesPlugin(options).writeBundle).toBeUndefined();
+        });
+
+        describe('when metadataDir is set', () => {
+            beforeEach(() => (options.metadataDir = '/output/metadata'));
+
+            test('calls generateExposedDependenciesMetadata with entrypoints.json resolver', () => {
+                subject();
+
+                expect(generateExposedDependenciesMetadata).toHaveBeenCalledWith(
+                    options.metadataDir,
+                    expect.any(Function)
+                );
+                const pathResolver = jest.mocked(generateExposedDependenciesMetadata).mock
+                    .calls[0][1];
+                expect(pathResolver()).toBe(path.resolve(outputDir, 'entrypoints.json'));
+            });
+        });
+    });
+});