@servicetitan/startup 38.0.0 → 38.2.0

package/src/vite/plugins/react-refresh-plugin/__tests__/react-refresh-plugin.test.ts

@@ -0,0 +1,366 @@
+import path from 'path';
+import { SourceMapConsumer } from 'source-map-js';
+import type { Plugin } from 'vite';
+import { reactRefreshPlugin } from '..';
+import type { BuildContext } from '../../../../core';
+import { findPackages } from '../../../../utils';
+
+jest.mock('../../../../utils', () => ({
+    ...jest.requireActual('../../../../utils'),
+    findPackages: jest.fn(),
+}));
+
+type TransformHook = Extract<Plugin['transform'], { handler: unknown }>;
+
+function expectOriginalPosition(
+    actual: ReturnType<SourceMapConsumer['originalPositionFor']>,
+    expected: { line: number; column: number; source: string }
+) {
+    expect({ ...actual, source: actual.source?.replace(/\\/g, '/') }).toEqual(
+        expect.objectContaining({
+            ...expected,
+            source: expected.source.replace(/\\/g, '/'),
+        })
+    );
+}
+
+describe('[startup] reactRefreshPlugin', () => {
+    const destination = path.join('packages', 'runtime');
+    const packageDir = path.resolve(destination) + path.sep;
+    const appModuleId = packageDir + 'src/app.tsx';
+    const workspaceLibraryModuleId = path.resolve('packages/web-components/dist/loader.js');
+    const libraryModuleId = '/node_modules/some-lib/index.js';
+
+    let code: string;
+    let context: BuildContext;
+    let id: string;
+    let source: string;
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+
+        code = '';
+        id = '';
+        source = '';
+        context = {
+            build: { isProduction: false },
+            package: { destination },
+        } as unknown as BuildContext;
+        jest.mocked(findPackages).mockReturnValue([
+            { location: path.resolve(destination) },
+            { location: path.resolve('packages/web-components') },
+        ] as ReturnType<typeof findPackages>);
+    });
+
+    const subject = () => reactRefreshPlugin(context);
+
+    test('returns a plugin with name react-refresh', () => {
+        expect(subject()!.name).toBe('react-refresh');
+    });
+
+    test('enforces pre order so it runs before built-in transforms', () => {
+        expect(subject()!.enforce).toBe('pre');
+    });
+
+    describe('when context.build.isProduction is true', () => {
+        beforeEach(() => {
+            context.build.isProduction = true;
+        });
+
+        test('returns undefined', () => {
+            expect(subject()).toBeUndefined();
+        });
+    });
+
+    describe('resolveId', () => {
+        beforeEach(() => (source = 'some-other-module'));
+
+        const subject = () => (reactRefreshPlugin(context)!.resolveId as Function)(source);
+
+        test('returns undefined', () => {
+            expect(subject()).toBeUndefined();
+        });
+
+        describe('when resolving the refresh runtime id', () => {
+            beforeEach(() => (source = '/@react-refresh'));
+
+            test('returns module info', () => {
+                expect(subject()).toEqual({
+                    id: source,
+                    moduleSideEffects: true,
+                });
+            });
+        });
+    });
+
+    describe('load', () => {
+        beforeEach(() => (id = '/some-other-id'));
+
+        const subject = () => (reactRefreshPlugin(context)!.load as Function)(id);
+
+        test('returns undefined', () => {
+            expect(subject()).toBeUndefined();
+        });
+
+        describe('when loading the refresh runtime id', () => {
+            beforeEach(() => (id = '/@react-refresh'));
+
+            test('returns runtime code', () => {
+                expect(subject()).toEqual({
+                    code: expect.stringContaining(
+                        'import _RefreshRuntime from "react-refresh/runtime"'
+                    ),
+                });
+            });
+
+            test('uses the global singleton pattern', () => {
+                expect(subject().code).toContain('window.__ReactRefreshRuntime');
+            });
+
+            test('calls injectIntoGlobalHook', () => {
+                expect(subject().code).toContain('if (!window.__ReactRefreshRuntime)');
+                expect(subject().code).toContain('_RefreshRuntime.injectIntoGlobalHook(window)');
+            });
+
+            test('includes vendored Vite React refresh boundary helpers', () => {
+                expect(subject().code).toContain('export function registerExportsForReactRefresh');
+                expect(subject().code).toContain(
+                    'export function validateRefreshBoundaryAndEnqueueUpdate'
+                );
+            });
+
+            test('allows unchanged non-component exports', () => {
+                expect(subject().code).toContain('return prevExports[key] === nextExports[key];');
+            });
+
+            test('invalidates incompatible exports with the Vite React message shape', () => {
+                expect(subject().code).toContain('Could not Fast Refresh');
+                expect(subject().code).toContain('export is incompatible');
+            });
+
+            test('exposes the hidden dynamic import helper used by the postlude', () => {
+                expect(subject().code).toContain('export function __hmr_import');
+                expect(subject().code).toContain('import(/* @vite-ignore */ module)');
+                expect(subject().code).not.toContain('require(');
+            });
+        });
+    });
+
+    describe('transformIndexHtml', () => {
+        const subject = () => (reactRefreshPlugin(context)!.transformIndexHtml as Function)();
+
+        test('returns a head-prepended module script', () => {
+            expect(subject()).toEqual([
+                {
+                    tag: 'script',
+                    attrs: { type: 'module' },
+                    children: expect.any(String),
+                    injectTo: 'head-prepend',
+                },
+            ]);
+        });
+
+        test('imports the runtime as a side effect to trigger injectIntoGlobalHook early', () => {
+            expect(subject()[0].children).toContain(`import "/@react-refresh"`);
+        });
+
+        test('does not set window refresh globals', () => {
+            expect(subject()[0].children).not.toContain('window.$RefreshReg$');
+            expect(subject()[0].children).not.toContain('window.$RefreshSig$');
+        });
+    });
+
+    describe('transform', () => {
+        const transform = () => reactRefreshPlugin(context)!.transform as TransformHook;
+        const subject = () => (transform().handler as Function)(code, id);
+
+        test('filters transform calls to modules with refresh markers', () => {
+            expect(transform().filter).toEqual({ code: /\$RefreshReg\$|\$RefreshSig\$/ });
+        });
+
+        describe('when transforming a non-workspace library module with refresh markers', () => {
+            beforeEach(() => {
+                code = '$RefreshReg$(App, "App");';
+                id = libraryModuleId;
+            });
+
+            test('prepends no-op shadows', () => {
+                expect(subject()).toEqual({
+                    code: expect.stringContaining('var $RefreshReg$ = () => {};'),
+                    map: expect.any(Object),
+                });
+            });
+
+            test('maps original code after the prepended no-ops', () => {
+                const result = subject()!;
+                const consumer = new SourceMapConsumer(result.map as any);
+                const generatedLine =
+                    result.code.split('\n').findIndex((line: string) => line === code) + 1;
+
+                expectOriginalPosition(
+                    consumer.originalPositionFor({ line: generatedLine, column: 0 }),
+                    {
+                        line: 1,
+                        column: 0,
+                        source: id,
+                    }
+                );
+            });
+        });
+
+        describe('when transforming a workspace library module with registered components', () => {
+            beforeEach(() => {
+                code = '$RefreshReg$(Loader, "Loader"); $RefreshSig$()';
+                id = workspaceLibraryModuleId;
+            });
+
+            test('appends the HMR postlude', () => {
+                expect(subject()!.code).toContain('import.meta.hot.accept');
+            });
+
+            test('prepends per-module locals scoped to the module URL', () => {
+                expect(subject()!.code).toContain(
+                    'var $RefreshReg$ = (type, id) => RefreshRuntime.register(type, __react_refresh_id__ + " " + id)'
+                );
+            });
+
+            test('maps original code after the prepended module prelude', () => {
+                const result = subject()!;
+                const consumer = new SourceMapConsumer(result.map as any);
+                const generatedLine =
+                    result.code.split('\n').findIndex((line: string) => line === code) + 1;
+
+                expectOriginalPosition(
+                    consumer.originalPositionFor({ line: generatedLine, column: 0 }),
+                    {
+                        line: 1,
+                        column: 0,
+                        source: id,
+                    }
+                );
+            });
+        });
+
+        describe('when transforming a workspace module in windows', () => {
+            beforeEach(() => {
+                code = '$RefreshReg$(App, "App");';
+                jest.mocked(findPackages).mockReturnValue([
+                    { location: 'C:\\repo\\uikit\\packages\\examples' },
+                ] as ReturnType<typeof findPackages>);
+                id = 'C:/repo/uikit/packages/examples/src/app.tsx';
+            });
+
+            test('treats it as refreshable', () => {
+                expect(subject()!.code).toContain('import.meta.hot.accept');
+            });
+        });
+
+        describe('when transforming an app module with registered components', () => {
+            beforeEach(() => {
+                code = 'export const App = () => null; $RefreshReg$(App, "App"); $RefreshSig$()';
+                id = appModuleId;
+            });
+
+            test('appends the HMR postlude', () => {
+                expect(subject()!.code).toContain('import.meta.hot.accept');
+            });
+
+            test('dynamically imports the current module exports using the stable module id', () => {
+                expect(subject()!.code).toContain(
+                    '__hmr_import(__react_refresh_id__).then(currentExports => {'
+                );
+            });
+
+            test('registers component exports before accepting updates', () => {
+                expect(subject()!.code).toContain(
+                    'registerExportsForReactRefresh(__react_refresh_id__, currentExports)'
+                );
+            });
+
+            test('invalidates incompatible accepted updates', () => {
+                expect(subject()!.code).toContain('import.meta.hot.invalidate(invalidateMessage)');
+            });
+
+            test('delegates boundary validation to the virtual refresh runtime', () => {
+                expect(subject()!.code).toContain('validateRefreshBoundaryAndEnqueueUpdate(');
+                expect(subject()!.code).toContain('__react_refresh_id__,');
+            });
+
+            test('prepends per-module locals scoped to the module URL', () => {
+                expect(subject()!.code).toContain(
+                    'var $RefreshReg$ = (type, id) => RefreshRuntime.register(type, __react_refresh_id__ + " " + id)'
+                );
+            });
+
+            test('maps original code after the prepended module prelude', () => {
+                const result = subject()!;
+                const consumer = new SourceMapConsumer(result.map as any);
+                const generatedLine =
+                    result.code.split('\n').findIndex((line: string) => line === code) + 1;
+
+                expectOriginalPosition(
+                    consumer.originalPositionFor({ line: generatedLine, column: 0 }),
+                    {
+                        line: 1,
+                        column: 0,
+                        source: id,
+                    }
+                );
+            });
+        });
+
+        describe('when transforming an app module without registered components', () => {
+            beforeEach(() => {
+                code = '$RefreshSig$()';
+                id = appModuleId;
+            });
+
+            test('prepends refresh locals so $RefreshSig$ calls resolve without window globals', () => {
+                expect(subject()!.code).toContain('var $RefreshSig$');
+            });
+
+            test('does not append the HMR postlude', () => {
+                expect(subject()!.code).not.toContain('import.meta.hot.accept');
+            });
+        });
+
+        describe('when transforming an app module with a mixed registered and HOC export', () => {
+            beforeEach(() => {
+                code = `
+const EventBusExample = lazy(() => import('./event-bus-example'));
+export const App = provide({})(() => null);
+$RefreshReg$(EventBusExample, "EventBusExample");
+$RefreshSig$();`;
+                id = appModuleId;
+            });
+
+            test('dynamically imports exports even when only another value is registered', () => {
+                expect(subject()!.code).toContain(
+                    '__hmr_import(__react_refresh_id__).then(currentExports => {'
+                );
+            });
+
+            test('invalidates changed non-component exports instead of swallowing the update', () => {
+                expect(subject()!.code).toContain('validateRefreshBoundaryAndEnqueueUpdate(');
+                expect(subject()!.code).toContain('import.meta.hot.invalidate(invalidateMessage)');
+            });
+        });
+
+        describe('when transforming an app module with named exports', () => {
+            beforeEach(() => {
+                code = `
+const Component = () => null;
+const OtherComponent = () => null;
+export { Component as App, OtherComponent };
+$RefreshReg$(Component, "Component");
+$RefreshReg$(OtherComponent, "OtherComponent");`;
+                id = appModuleId;
+            });
+
+            test('uses the runtime module namespace instead of parsing export syntax', () => {
+                expect(subject()!.code).toContain('currentExports');
+                expect(subject()!.code).not.toContain('__react_refresh_current_exports__');
+            });
+        });
+    });
+});

package/src/vite/plugins/react-refresh-plugin/__tests__/refresh-runtime.test.ts

@@ -0,0 +1,193 @@
+import {
+    __hmr_import,
+    registerExportsForReactRefresh,
+    validateRefreshBoundaryAndEnqueueUpdate,
+} from '../refresh-runtime.js';
+
+declare global {
+    interface Window {
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        __registerBeforePerformReactRefresh: (callback: () => Promise<void>) => void;
+    }
+}
+
+describe('[startup] react refresh runtime helpers', () => {
+    const moduleId = '/dist/app.js';
+    const component = () => null;
+
+    let nextExports: Record<string, unknown>;
+    let prevExports: Record<string, unknown>;
+    let RefreshRuntime: {
+        isLikelyComponentType: jest.Mock;
+        performReactRefresh: jest.Mock;
+        register: jest.Mock;
+    };
+
+    beforeEach(() => {
+        jest.clearAllMocks();
+        jest.useFakeTimers();
+
+        RefreshRuntime = {
+            isLikelyComponentType: jest.fn(value => value === component),
+            performReactRefresh: jest.fn(),
+            register: jest.fn(),
+        };
+        Object.defineProperty(window, '__ReactRefreshRuntime', {
+            configurable: true,
+            value: RefreshRuntime,
+        });
+    });
+
+    afterEach(() => {
+        jest.useRealTimers();
+    });
+
+    describe('registerExportsForReactRefresh', () => {
+        const subject = () => {
+            const moduleExports = {
+                App: component,
+                count: 1,
+            };
+            Object.defineProperty(moduleExports, '__esModule', {
+                enumerable: true,
+                value: true,
+            });
+
+            registerExportsForReactRefresh(moduleId, moduleExports);
+        };
+
+        test('registers component exports', () => {
+            subject();
+
+            expect(RefreshRuntime.register).toHaveBeenCalledWith(
+                component,
+                `${moduleId} export App`
+            );
+        });
+
+        test('skips non-component exports', () => {
+            subject();
+
+            expect(RefreshRuntime.register).toHaveBeenCalledTimes(1);
+        });
+    });
+
+    describe('validateRefreshBoundaryAndEnqueueUpdate', () => {
+        beforeEach(() => {
+            prevExports = { App: component };
+            nextExports = { App: component };
+        });
+
+        const subject = () =>
+            validateRefreshBoundaryAndEnqueueUpdate(moduleId, prevExports, nextExports);
+
+        function itQueuesASingleRefresh() {
+            test('queues a single refresh', async () => {
+                subject();
+                await jest.advanceTimersByTimeAsync(16);
+
+                expect(RefreshRuntime.performReactRefresh).toHaveBeenCalledTimes(1);
+            });
+        }
+
+        itQueuesASingleRefresh();
+
+        describe('with a before refresh callback', () => {
+            const callback = jest.fn(async () => {});
+
+            beforeEach(() => window.__registerBeforePerformReactRefresh(callback));
+
+            test('runs the callback before refreshing', async () => {
+                subject();
+                await jest.advanceTimersByTimeAsync(16);
+
+                expect(callback).toHaveBeenCalledTimes(1);
+                expect(RefreshRuntime.performReactRefresh).toHaveBeenCalledTimes(1);
+            });
+        });
+
+        describe('with __esModule exports', () => {
+            beforeEach(() => {
+                Object.defineProperty(prevExports, '__esModule', {
+                    enumerable: true,
+                    value: true,
+                });
+                Object.defineProperty(nextExports, '__esModule', {
+                    enumerable: true,
+                    value: true,
+                });
+            });
+
+            itQueuesASingleRefresh();
+        });
+
+        describe('with unchanged non-component exports', () => {
+            const unchangedValue = { stable: true };
+
+            beforeEach(() => {
+                prevExports.value = unchangedValue;
+                nextExports.value = unchangedValue;
+            });
+
+            itQueuesASingleRefresh();
+        });
+
+        describe('with changed non-component exports', () => {
+            beforeEach(() => {
+                prevExports.value = 'before';
+                nextExports.value = 'after';
+            });
+
+            test('returns an incompatible export message', () => {
+                expect(subject()).toBe('Could not Fast Refresh ("value" export is incompatible).');
+            });
+        });
+
+        describe('with removed exports', () => {
+            beforeEach(() => {
+                prevExports.value = 'before';
+            });
+
+            test('returns an export removed message', () => {
+                expect(subject()).toBe('Could not Fast Refresh (export removed)');
+            });
+        });
+
+        describe('with new exports', () => {
+            beforeEach(() => {
+                nextExports.value = 'after';
+            });
+
+            test('returns a new export message', () => {
+                expect(subject()).toBe('Could not Fast Refresh (new export)');
+            });
+        });
+
+        describe('with getter exports', () => {
+            beforeEach(() => {
+                Object.defineProperty(nextExports, 'value', {
+                    enumerable: true,
+                    get: () => {
+                        throw new Error('getter should not run');
+                    },
+                });
+                Object.defineProperty(prevExports, 'value', {
+                    enumerable: true,
+                    value: 'before',
+                });
+            });
+
+            test('returns an invalidation message', () => {
+                expect(subject()).toContain('Could not Fast Refresh');
+            });
+        });
+    });
+
+    describe('__hmr_import', () => {
+        const subject = () => __hmr_import('missing-refresh-runtime-test-module');
+
+        test('delegates to native dynamic import', async () => {
+            await expect(subject()).rejects.toThrow();
+        });
+    });
+});

package/src/vite/plugins/react-refresh-plugin/index.ts

@@ -0,0 +1 @@
+export * from './react-refresh-plugin';