@hubspot/ui-extensions-dev-server 0.10.2 → 1.0.0

package/dist/lib/__tests__/build.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/__tests__/build.spec.js

@@ -0,0 +1,159 @@
+import { describe, it, expect, vi, afterEach } from 'vitest';
+vi.mock('vite');
+import { buildSingleExtension, remoteBuild, extensionErrorBaseMessage, } from "../build.js";
+import { build } from 'vite';
+import { ROLLUP_OPTIONS } from "../constants.js";
+describe('build', () => {
+    afterEach(() => {
+        vi.clearAllMocks();
+    });
+    describe('buildSingleExtension', () => {
+        it('should build without the need to load config', async () => {
+            await buildSingleExtension({
+                file: 'SomeFile.jsx',
+                outputDir: 'builds',
+                emptyOutDir: false,
+                minify: true,
+                root: '/some/fake/dir',
+            });
+            expect(build).toHaveBeenCalledTimes(1);
+        });
+        it("should call vite's build function with the correct arguments", async () => {
+            const expected = {
+                file: 'SomeFile.jsx',
+                outputDir: 'builds',
+                emptyOutDir: false,
+                minify: true,
+                root: '/some/fake/dir',
+            };
+            const output = 'SomeFile.js';
+            await buildSingleExtension(expected);
+            expect(build).toHaveBeenCalledTimes(1);
+            expect(build).toHaveBeenCalledWith(expect.objectContaining({
+                root: expected.root,
+                build: expect.objectContaining({
+                    emptyOutDir: expected.emptyOutDir,
+                    lib: expect.objectContaining({
+                        entry: expected.file,
+                        name: output,
+                        formats: ['iife'],
+                    }),
+                    outDir: expected.outputDir,
+                    minify: expected.minify,
+                    rollupOptions: {
+                        ...ROLLUP_OPTIONS,
+                        plugins: expect.arrayContaining([
+                            expect.objectContaining({
+                                name: 'ui-extensions-manifest-generation-plugin',
+                            }),
+                            expect.objectContaining({
+                                name: 'ui-extensions-friendly-logging-plugin',
+                            }),
+                            expect.objectContaining({
+                                name: 'ui-extensions-code-blocking-plugin',
+                            }),
+                        ]),
+                    },
+                }),
+            }));
+        });
+        it('should pass appConfig to manifestPlugin when provided', async () => {
+            const mockAppConfig = {
+                variables: {
+                    name: 'Test Extension',
+                    version: '1.0.0',
+                },
+            };
+            await buildSingleExtension({
+                file: 'SomeFile.jsx',
+                outputDir: 'builds',
+                emptyOutDir: false,
+                minify: true,
+                root: '/some/fake/dir',
+                appConfig: mockAppConfig,
+            });
+            expect(build).toHaveBeenCalledTimes(1);
+            expect(build).toHaveBeenCalledWith(expect.objectContaining({
+                build: expect.objectContaining({
+                    rollupOptions: expect.objectContaining({
+                        plugins: expect.arrayContaining([
+                            expect.objectContaining({
+                                name: 'ui-extensions-manifest-generation-plugin',
+                            }),
+                        ]),
+                    }),
+                }),
+            }));
+        });
+        it('should work without appConfig parameter', async () => {
+            await buildSingleExtension({
+                file: 'SomeFile.jsx',
+                outputDir: 'builds',
+                emptyOutDir: false,
+                minify: true,
+                root: '/some/fake/dir',
+            });
+            expect(build).toHaveBeenCalledTimes(1);
+        });
+    });
+    describe('remoteBuild', () => {
+        it('should throw an error for invalid file extensions', async () => {
+            await expect(remoteBuild({ root: '/fake/file/path', entryPoint: 'file.xml' })).rejects.toThrow(`${extensionErrorBaseMessage} .xml`);
+        });
+        it('should call build with the correct arguments', async () => {
+            const root = '/fake/file/path';
+            const entry = 'file.jsx';
+            const outDir = 'someOutDir';
+            await remoteBuild({ root, entryPoint: entry, outputDir: outDir });
+            expect(build).toHaveBeenCalledTimes(1);
+            expect(build).toHaveBeenCalledWith(expect.objectContaining({
+                build: expect.objectContaining({
+                    emptyOutDir: true,
+                    lib: expect.objectContaining({
+                        entry,
+                        name: 'file.js',
+                    }),
+                    outDir,
+                    minify: true,
+                }),
+                root,
+            }));
+        });
+        it('should pass appConfig parameter when provided', async () => {
+            const mockAppConfig = {
+                variables: {
+                    name: 'Test Remote Extension',
+                    version: '2.0.0',
+                },
+            };
+            const root = '/fake/file/path';
+            const entry = 'file.jsx';
+            const outDir = 'someOutDir';
+            await remoteBuild({
+                root,
+                entryPoint: entry,
+                outputDir: outDir,
+                appConfig: mockAppConfig,
+            });
+            expect(build).toHaveBeenCalledTimes(1);
+            expect(build).toHaveBeenCalledWith(expect.objectContaining({
+                build: expect.objectContaining({
+                    emptyOutDir: true,
+                    lib: expect.objectContaining({
+                        entry,
+                        name: 'file.js',
+                    }),
+                    outDir,
+                    minify: true,
+                }),
+                root,
+            }));
+        });
+        it('should work without appConfig parameter', async () => {
+            const root = '/fake/file/path';
+            const entry = 'file.jsx';
+            await remoteBuild({ root, entryPoint: entry });
+            expect(build).toHaveBeenCalledTimes(1);
+        });
+    });
+});

package/dist/lib/__tests__/config.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/__tests__/config.spec.js

@@ -0,0 +1,291 @@
+import { describe, vi, beforeEach, afterEach, it, expect } from 'vitest';
+import { loadLocalConfig, loadExtensionConfig, validateCardConfig, } from "../config.js";
+import fs from 'fs';
+vi.mock('fs', () => {
+    const existsSyncMock = vi.fn(() => true);
+    const readFileSyncMock = vi.fn(() => JSON.stringify({
+        proxy: { 'https://inbound.com': 'http://localhost' },
+    }));
+    return {
+        default: {
+            existsSync: existsSyncMock,
+            readFileSync: readFileSyncMock,
+        },
+        existsSync: existsSyncMock,
+        readFileSync: readFileSyncMock,
+    };
+});
+const mockProxyConfig = (key, value) => {
+    vi.mocked(fs.readFileSync).mockImplementationOnce(() => JSON.stringify({ proxy: { [key]: value } }));
+};
+const createAppConfig = (overrides = {}) => ({
+    name: 'Yooooooooooo',
+    description: 'Yooooooooooo',
+    scopes: [],
+    public: false,
+    uid: 'no-one-will-know-this-is-not-a-uuid',
+    ...overrides,
+});
+describe('config', () => {
+    let logger;
+    const appPath = 'path/to/the/app';
+    beforeEach(() => {
+        logger = {
+            info: vi.fn(),
+            debug: vi.fn(),
+            warn: vi.fn(),
+            error: vi.fn(),
+        };
+    });
+    afterEach(() => {
+        vi.clearAllMocks();
+    });
+    describe('loadExtensionConfig', () => {
+        it('should throw an error if the appConfig is missing the extensions list', () => {
+            const appConfig = createAppConfig();
+            expect(() => loadExtensionConfig(appConfig, '')).toThrow("Unable to find extensions files, make sure the 'extensions.crm.cards' array is defined in the application configuration file");
+        });
+        it('should log an error if the appConfig has invalid extension configs', () => {
+            const consoleErrorSpy = vi
+                .spyOn(console, 'error')
+                .mockImplementation(() => { });
+            vi.mocked(fs.readFileSync).mockImplementationOnce(() => JSON.stringify({
+                type: 'crm-card',
+                data: {
+                    location: 'crm.record.tab',
+                    module: { file: 'src/index.js' },
+                    objectTypes: [{ name: 'contact' }],
+                },
+            }));
+            const appConfig = createAppConfig({
+                extensions: {
+                    crm: {
+                        cards: [{ file: './invalid.json' }],
+                    },
+                },
+            });
+            expect(() => loadExtensionConfig(appConfig, '')).not.toThrow();
+            expect(consoleErrorSpy).toHaveBeenCalledTimes(1);
+            expect(consoleErrorSpy).toHaveBeenCalledWith('[DevServer] Extension config invalid.json is invalid: `data` must have a `title` string');
+            consoleErrorSpy.mockRestore();
+        });
+        it('should successfully return a map of extensions if the appConfig has valid extension configs', () => {
+            const cardConfig = {
+                type: 'crm-card',
+                data: {
+                    title: 'Yes Card',
+                    location: 'crm.record.tab',
+                    module: { file: 'src/yes-card.js' },
+                    objectTypes: [{ name: 'contact' }],
+                    uid: 'yes-this-is-card',
+                },
+            };
+            vi.mocked(fs.readFileSync).mockImplementation(() => JSON.stringify(cardConfig));
+            const appConfig = createAppConfig({
+                uid: 'app-uid-here',
+                extensions: {
+                    crm: {
+                        cards: [{ file: 'yes-card.json' }],
+                    },
+                },
+            });
+            expect(() => loadExtensionConfig(appConfig, '')).not.toThrow();
+            expect(loadExtensionConfig(appConfig, '')).toEqual({
+                'app-uid-here::yes-this-is-card': {
+                    ...cardConfig,
+                    appConfig,
+                    extensionConfigPath: 'yes-card.json',
+                    extensionPath: 'src',
+                    output: 'yes-card.js',
+                    path: '',
+                    data: {
+                        ...cardConfig.data,
+                        appName: 'Yooooooooooo',
+                        sourceId: 'app-uid-here::yes-this-is-card',
+                    },
+                },
+            });
+        });
+    });
+    describe('loadLocalConfig', () => {
+        it('should log a warning if the key has a path', () => {
+            const key = 'https://inbound.com/this/is/a/path';
+            mockProxyConfig(key, 'http://localhost');
+            loadLocalConfig(appPath, logger);
+            expect(logger.warn).toHaveBeenCalledTimes(1);
+            expect(logger.warn).toHaveBeenCalledWith(`The key "${key}" in "local.json" is invalid, paths are not supported for keys`);
+        });
+        it('should log a warning if the key is an invalid url', () => {
+            const key = 'invalid-url';
+            mockProxyConfig(key, 'http://localhost');
+            loadLocalConfig(appPath, logger);
+            expect(logger.warn).toHaveBeenCalledTimes(1);
+            expect(logger.warn).toHaveBeenCalledWith(`The key "${key}" in "local.json" is an invalid url`);
+        });
+        it('should not log a warning if the key is a valid url', () => {
+            mockProxyConfig('http://inbound.com', 'http://localhost');
+            loadLocalConfig(appPath, logger);
+            expect(logger.warn).not.toHaveBeenCalled();
+        });
+        it('should log a warning if the value is an invalid url', () => {
+            const key = 'https://inbound.com';
+            const value = 'invalid-url';
+            mockProxyConfig(key, value);
+            loadLocalConfig(appPath, logger);
+            expect(logger.warn).toHaveBeenCalledTimes(1);
+            expect(logger.warn).toHaveBeenCalledWith(`The value "${value}" for key "${key}" in "local.json" is an invalid url`);
+        });
+        it('should not log a warning if both key and value are valid urls', () => {
+            mockProxyConfig('https://inbound.com', 'https://localhost');
+            loadLocalConfig(appPath, logger);
+            expect(logger.warn).not.toHaveBeenCalled();
+        });
+        it('should return undefined if the local config file does not exist', () => {
+            vi.mocked(fs.existsSync).mockImplementationOnce(() => false);
+            expect(loadLocalConfig('foo', logger)).toBeUndefined();
+        });
+        it('should log an error if we are unable to parse the file', () => {
+            vi.mocked(fs.readFileSync).mockImplementationOnce(() => 'this-will-not-be-parsed-to-json');
+            loadLocalConfig(appPath, logger);
+            expect(logger.error).toHaveBeenCalledTimes(1);
+            expect(logger.error).toHaveBeenCalledWith(expect.stringMatching(`Error loading and parsing ${appPath}/local.json, SyntaxError: Unexpected token`));
+        });
+        it('should return the config if it is valid', () => {
+            const expected = {
+                proxy: {
+                    'https://inbound.com': 'http://localhost',
+                },
+            };
+            vi.mocked(fs.readFileSync).mockImplementationOnce(() => JSON.stringify(expected));
+            expect(loadLocalConfig(appPath, logger)).toEqual(expected);
+        });
+    });
+    describe('validateCardConfig', () => {
+        const validCardConfig = {
+            type: 'crm-card',
+            data: {
+                title: 'Example Card',
+                location: 'crm.record.tab',
+                module: { file: 'src/index.js' },
+                objectTypes: [{ name: 'contact' }],
+            },
+        };
+        const expectValidationError = (config, errorMessage) => {
+            expect(validateCardConfig(config)).toEqual(new Error(errorMessage));
+        };
+        it('should return an Error if the card config is missing the `type` property', () => {
+            expectValidationError({ data: validCardConfig.data }, '`type` must be "crm-card"');
+        });
+        it('should return an Error if the card config has a `type` value other than `crm-card`', () => {
+            expectValidationError({ ...validCardConfig, type: 'something-incorrect' }, '`type` must be "crm-card"');
+        });
+        it('should return an Error if the card config is missing a `data` property', () => {
+            expectValidationError({ type: 'crm-card' }, '`data` must be an object');
+        });
+        it('should return an Error if the card config data is missing a `title` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: {
+                    location: 'crm.record.tab',
+                    module: { file: 'src/index.js' },
+                    objectTypes: [{ name: 'contact' }],
+                },
+            }, '`data` must have a `title` string');
+        });
+        it('should return an Error if the card config `title` property is not a string', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, title: null },
+            }, '`data` must have a `title` string');
+        });
+        it('should return an Error if the card config data is missing a `location` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: {
+                    title: 'Example Card',
+                    module: { file: 'src/index.js' },
+                    objectTypes: [{ name: 'contact' }],
+                },
+            }, '`data` must have a `location` string');
+        });
+        it('should return an Error if the card config `location` property is not a string', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, location: null },
+            }, '`data` must have a `location` string');
+        });
+        it('should return an Error if the card config data is missing a `module` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: {
+                    title: 'Example Card',
+                    location: 'crm.record.tab',
+                    objectTypes: [{ name: 'contact' }],
+                },
+            }, '`data` must have a `module` object');
+        });
+        it('should return an Error if the card config `module` property is not an object', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, module: 'src/index.js' },
+            }, '`data` must have a `module` object');
+        });
+        it('should return an Error if the card config `module` property has no `file` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, module: {} },
+            }, '`data.module` must have a `file` string');
+        });
+        it('should return an Error if the card config `module` property has an incorrect `file` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, module: { file: null } },
+            }, '`data.module` must have a `file` string');
+        });
+        it('should return an Error if the card config is missing an `objectTypes` property', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: {
+                    title: 'Example Card',
+                    location: 'crm.record.tab',
+                    module: { file: 'src/index.js' },
+                },
+            }, '`data.module` must have an `objectTypes` array');
+        });
+        it('should return an Error if the card config `objectTypes` property is not an array', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, objectTypes: null },
+            }, '`data.module` must have an `objectTypes` array');
+        });
+        it('should return an Error if the card config `objectTypes` property is an empty array', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: { ...validCardConfig.data, objectTypes: [] },
+            }, 'all `data.module.objectTypes` objects must have `name` strings');
+        });
+        it('should return an Error if the card config `objectType` object `name` is not a string', () => {
+            expectValidationError({
+                type: 'crm-card',
+                data: {
+                    ...validCardConfig.data,
+                    objectTypes: [{ name: null }],
+                },
+            }, 'all `data.module.objectTypes` objects must have `name` strings');
+        });
+        it('should return true if the config is valid', () => {
+            expect(validateCardConfig(validCardConfig)).toBe(true);
+        });
+        it('should return true if the config is valid and has extra fields', () => {
+            const cardConfig = {
+                ...validCardConfig,
+                data: {
+                    ...validCardConfig.data,
+                    uid: 'cool-card',
+                },
+                thisDoesNot: 'matter here',
+            };
+            expect(validateCardConfig(cardConfig)).toBe(true);
+        });
+    });
+});

package/dist/lib/__tests__/dev.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/lib/__tests__/dev.spec.js

@@ -0,0 +1,80 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { startDevMode } from "../dev.js";
+import { createServer } from 'vite';
+import startDevServer from "../server.js";
+import { DevServerState } from "../DevServerState.js";
+import { createMockLogger, createDevServerConfig } from "./factories.js";
+vi.mock('vite', () => ({
+    createServer: vi.fn(() => ({
+        name: 'vite-dev-server',
+    })),
+}));
+vi.mock('../server', () => ({
+    default: vi.fn(() => ({
+        httpServer: {},
+        shutdown: vi.fn(),
+    })),
+}));
+vi.mock('detect-port', () => ({
+    default: vi.fn((port) => {
+        if (port === 7890) {
+            return 1235; // Simulate port unavailable
+        }
+        return port;
+    }),
+}));
+describe('dev', () => {
+    let devServerState;
+    let logger;
+    beforeEach(() => {
+        vi.clearAllMocks();
+        logger = createMockLogger();
+        devServerState = new DevServerState(createDevServerConfig(logger));
+    });
+    describe('startDevMode', () => {
+        it('should throw an error if extensionConfig is undefined', async () => {
+            // @ts-expect-error Causing an error on purpose
+            await expect(startDevMode(undefined)).rejects.toThrow(/^Unable to determine which extension to run/);
+        });
+        it('should throw an error if the express port is in use', async () => {
+            const badPort = new DevServerState(createDevServerConfig(logger, { expressPort: 7890 }));
+            await expect(startDevMode(badPort)).rejects.toThrow(/^Unable to start because port 7890 is already in use/);
+        });
+        it('should call vite createServer', async () => {
+            await startDevMode(devServerState);
+            expect(createServer).toHaveBeenCalledTimes(1);
+            expect(createServer).toHaveBeenCalledWith(expect.objectContaining({
+                appType: 'custom',
+                mode: 'development',
+                server: expect.objectContaining({
+                    middlewareMode: true,
+                    hmr: expect.objectContaining({
+                        server: null,
+                    }),
+                    cors: expect.objectContaining({
+                        credentials: true,
+                    }),
+                    watch: {
+                        ignored: [
+                            `${devServerState.outputDir}/**/*`,
+                            '**/src/app/app.functions/**/*',
+                            '**/app.json',
+                            '**/package.json',
+                            '**/package-lock.json',
+                        ],
+                    },
+                }),
+                clearScreen: false,
+                logLevel: 'silent',
+            }));
+        });
+        it('should call startDevServer', async () => {
+            await startDevMode(devServerState);
+            expect(startDevServer).toHaveBeenCalledTimes(1);
+            expect(startDevServer).toHaveBeenCalledWith({
+                devServerState,
+                viteDevServer: { name: 'vite-dev-server' },
+            });
+        });
+    });
+});

package/dist/lib/__tests__/extensionsService.spec.d.ts

@@ -0,0 +1 @@
+export {};