@servicetitan/startup 22.14.0 → 22.16.0

package/src/cli/commands/__tests__/prepare-package.test.ts

@@ -0,0 +1,75 @@
+import { isBundle } from '../../../utils';
+import {
+    assetsCopy,
+    assetsCopyWatch,
+    stylesCopy,
+    stylesCopyWatch,
+    tcm,
+    tcmWatch,
+} from '../../utils';
+
+import { PreparePackage } from '../prepare-package';
+
+jest.mock('../../../utils', () => ({
+    ...jest.requireActual('../../../utils'),
+    isBundle: jest.fn(),
+}));
+
+jest.mock('../../utils', () => ({
+    ...jest.requireActual('../../utils'),
+    assetsCopy: jest.fn().mockResolvedValue(undefined),
+    assetsCopyWatch: jest.fn().mockResolvedValue(undefined),
+    stylesCopy: jest.fn().mockResolvedValue(undefined),
+    stylesCopyWatch: jest.fn().mockResolvedValue(undefined),
+    tcm: jest.fn().mockResolvedValue(undefined),
+    tcmWatch: jest.fn().mockResolvedValue(undefined),
+}));
+
+describe(`[startup] ${PreparePackage.name}`, () => {
+    let args: ConstructorParameters<typeof PreparePackage>[0];
+
+    beforeEach(() => {
+        jest.mocked(isBundle).mockReturnValue(true);
+        args = {};
+    });
+
+    const subject = async () => new PreparePackage(args).execute();
+
+    test('runs tcm', async () => {
+        await subject();
+
+        expect(tcm).toHaveBeenCalled();
+    });
+
+    describe('when package is not a bundle', () => {
+        beforeEach(() => jest.mocked(isBundle).mockReturnValue(false));
+
+        test('copies assets and styles', async () => {
+            await subject();
+
+            expect(assetsCopy).toHaveBeenCalled();
+            expect(stylesCopy).toHaveBeenCalled();
+        });
+    });
+
+    describe('with "watch"', () => {
+        beforeEach(() => (args.watch = true));
+
+        test('runs tcm in watch mode', async () => {
+            await subject();
+
+            expect(tcmWatch).toHaveBeenCalled();
+        });
+
+        describe('when package is not a bundle', () => {
+            beforeEach(() => jest.mocked(isBundle).mockReturnValue(false));
+
+            test('copies assets and styles in watch mode', async () => {
+                await subject();
+
+                expect(assetsCopyWatch).toHaveBeenCalled();
+                expect(stylesCopyWatch).toHaveBeenCalled();
+            });
+        });
+    });
+});

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

@@ -0,0 +1,111 @@
+const exec = require('@lerna/exec');
+import { Package, PackageType, getPackages } from '../../../utils';
+import { tsc, tscWatch } from '../../utils';
+import { createPackage } from '../../__mocks__';
+
+import { Start } from '../start';
+
+jest.mock('@lerna/exec', () => jest.fn());
+jest.mock('../../../utils', () => ({
+    ...jest.requireActual('../../../utils'),
+    getPackages: jest.fn(),
+}));
+jest.mock('../../utils', () => ({ tsc: jest.fn(), tscWatch: jest.fn() }));
+
+describe(`[startup] ${Start.name}`, () => {
+    let args: ConstructorParameters<typeof Start>[0];
+    let packages: Package[];
+
+    beforeEach(() => {
+        args = {};
+        packages = [];
+        jest.mocked(getPackages).mockImplementation(() => packages);
+    });
+
+    const subject = async () => new Start(args).execute();
+
+    function itPreparesThePackages() {
+        test('prepares the package, then again in watch mode', async () => {
+            await subject();
+
+            expect(exec).toHaveBeenCalledWith({
+                cmd: 'startup prepare-package',
+                scope: packages.map(({ name }) => name),
+                stream: true,
+            });
+
+            expect(exec).toHaveBeenCalledWith({
+                'cmd': 'startup prepare-package',
+                'scope': packages.map(({ name }) => name),
+                'parallel': true,
+                'stream': true,
+                '--': ['--watch'],
+            });
+        });
+    }
+
+    describe('with TSC package', () => {
+        beforeEach(() => packages.push(createPackage({ type: PackageType.TSC })));
+
+        itPreparesThePackages();
+
+        test('runs tsc, then again in watch mode', async () => {
+            await subject();
+
+            expect(tsc).toHaveBeenCalledWith(packages);
+            expect(tscWatch).toHaveBeenCalledWith(packages);
+        });
+    });
+
+    describe('with Webpack package', () => {
+        beforeEach(() => packages.push(createPackage({ type: PackageType.Webpack })));
+
+        itPreparesThePackages();
+
+        test('bundles the package in watch mode', async () => {
+            await subject();
+
+            expect(exec).toHaveBeenCalledWith({
+                'cmd': 'startup bundle-package',
+                'scope': packages.map(({ name }) => name),
+                'parallel': true,
+                'stream': true,
+                '--': ['--watch'],
+            });
+        });
+
+        describe('with "esbuild"', () => {
+            beforeEach(() => (args.esbuild = true));
+
+            test('enables esbuild loader', async () => {
+                await subject();
+
+                expect(exec).toHaveBeenCalledWith(
+                    expect.objectContaining({
+                        '--': ['--watch', '--esbuild'],
+                    })
+                );
+            });
+        });
+    });
+
+    describe('with "scope"', () => {
+        beforeEach(() => (args.scope = 'foo'));
+
+        test('selects scoped packages', async () => {
+            await subject();
+
+            expect(getPackages).toHaveBeenCalledWith({ scope: args.scope });
+        });
+    });
+
+    describe('with "ignore"', () => {
+        beforeEach(() => (args.ignore = 'foo'));
+
+        test('selectively ignores packages', async () => {
+            await subject();
+
+            expect(getPackages).toHaveBeenCalledWith({ ignore: args.ignore });
+        });
+    });
+});

package/src/cli/commands/__tests__/styles-check.test.ts

@@ -0,0 +1,119 @@
+import mockFS from 'mock-fs';
+import {
+    getFolders,
+    isBundle,
+    isLegacy,
+    isStyleCheckDisabled,
+    isWebComponent,
+    log,
+} from '../../../utils';
+
+import { StylesCheck } from '../styles-check';
+
+jest.mock('../../../utils', () => ({
+    ...jest.requireActual('../../../utils'),
+    getFolders: jest.fn(),
+    isBundle: jest.fn(),
+    isLegacy: jest.fn(),
+    isStyleCheckDisabled: jest.fn(),
+    isWebComponent: jest.fn(),
+    log: { error: jest.fn(), info: jest.fn(), warning: jest.fn() },
+}));
+
+describe(`[startup] ${StylesCheck.name}`, () => {
+    const subject = async () => new StylesCheck().execute();
+
+    beforeEach(() => {
+        jest.resetAllMocks();
+        jest.mocked(isBundle).mockReturnValue(true);
+        jest.mocked(getFolders).mockReturnValue({ source: 'src', destination: 'dist' });
+    });
+
+    afterEach(() => mockFS.restore());
+
+    test("warns that application doesn't have design-system.css", async () => {
+        await subject();
+
+        expect(log.warning).toHaveBeenCalledWith(
+            expect.stringContaining("application doesn't have design-system.css")
+        );
+    });
+
+    describe('with a legacy package', () => {
+        beforeEach(() => jest.mocked(isLegacy).mockReturnValue(true));
+
+        test('exits silently', async () => {
+            await subject();
+
+            expect(getFolders).not.toHaveBeenCalled();
+            expect(log.info).not.toHaveBeenCalled();
+            expect(log.warning).not.toHaveBeenCalled();
+        });
+    });
+
+    describe('when style check is disabled', () => {
+        beforeEach(() => jest.mocked(isStyleCheckDisabled).mockReturnValue(true));
+
+        test('logs message and does not check styles', async () => {
+            await subject();
+
+            expect(log.info).toHaveBeenCalledWith('style check is disabled');
+            expect(getFolders).not.toHaveBeenCalled();
+            expect(log.warning).not.toHaveBeenCalled();
+        });
+    });
+
+    describe('when files contain deprecated patterns', () => {
+        const tokenCss = "@import '~@servicetitan/tokens/core/tokens.css';";
+        const anvilFontsCss = "@import '~@servicetitan/anvil-fonts/dist/css/anvil-fonts.css';";
+        const systemMinCss = "@import '~@servicetitan/design-system/dist/system.min.css';";
+
+        beforeEach(() => {
+            mockFS({
+                src: {
+                    'design-system.css': [tokenCss, anvilFontsCss, systemMinCss].join('\r\n'),
+                    'foo.css': `${tokenCss}\r\n`,
+                    'bar.less': `${anvilFontsCss}\r\n`,
+                    'styles': { 'baz.css': `${systemMinCss}\r\n` },
+                },
+            });
+        });
+
+        function itReportsErrors() {
+            test('reports errors', async () => {
+                try {
+                    await subject();
+                } catch (error: any) {
+                    expect(error.message).toMatch(/style check error/);
+                }
+
+                const errors = jest.mocked(log.error).mock.calls[0][0].split('\n');
+                expect(errors).toEqual([
+                    expect.stringMatching(/style check error/i),
+                    expect.stringMatching(/style check failed/i),
+                    `file bar.less contains link to "${anvilFontsCss}"`,
+                    `file foo.css contains link to "${tokenCss}"`,
+                    `file styles/baz.css contains link to "${systemMinCss}"`,
+                ]);
+            });
+        }
+
+        itReportsErrors();
+
+        describe('when package is web component', () => {
+            beforeEach(() => jest.mocked(isWebComponent).mockReturnValue(true));
+
+            itReportsErrors();
+        });
+
+        describe('when package is a library', () => {
+            beforeEach(() => jest.mocked(isBundle).mockReturnValue(false));
+
+            test('does not report errors', async () => {
+                await subject();
+
+                expect(log.error).not.toHaveBeenCalled();
+            });
+        });
+    });
+});

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

@@ -0,0 +1,43 @@
+import { runCLI } from '@jest/core';
+import { Config } from '@jest/types';
+import { getJestConfigCLI } from '../../../utils';
+
+import { Tests } from '../tests';
+
+jest.mock('@jest/core', () => ({ runCLI: jest.fn() }));
+jest.mock('../../../utils', () => ({
+    ...jest.requireActual('../../../utils'),
+    getJestConfigCLI: jest.fn(),
+}));
+
+describe(`[startup] ${Tests.name}`, () => {
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    const args: Config.Argv = { _: ['foo'], $0: 'bar' };
+    const jestConfig: Config.Argv = { ...args, setupFilesAfterEnv: ['./setupTests.js'] };
+
+    beforeAll(() => {
+        jest.mocked(getJestConfigCLI).mockReturnValue(jestConfig);
+        jest.mocked(runCLI).mockResolvedValue({ results: { success: true } } as any);
+    });
+
+    const subject = async () => new Tests(args).execute();
+
+    test('runs Jest CLI', async () => {
+        await subject();
+
+        expect(getJestConfigCLI).toHaveBeenCalledWith(args);
+        expect(runCLI).toHaveBeenCalledWith(jestConfig, [process.cwd()]);
+    });
+
+    describe('when the command fails', () => {
+        beforeEach(() => {
+            jest.mocked(runCLI).mockResolvedValue({ results: { success: false } } as any);
+        });
+
+        test('sets process execCode to 1', async () => {
+            await subject();
+
+            expect(process.exitCode).toBe(1);
+        });
+    });
+});

package/src/cli/commands/eslint.ts

@@ -0,0 +1,19 @@
+import { Command } from '.';
+import { logErrors } from '../../utils';
+import { eslint } from '../utils';
+
+interface Args {
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    _: string[];
+    fix?: boolean;
+}
+
+export class ESLintCommand implements Command {
+    constructor(private args: Args) {}
+
+    @logErrors
+    async execute(): Promise<void> {
+        const { _: paths, fix } = this.args;
+        await eslint({ fix, paths });
+    }
+}

package/src/cli/commands/index.ts

@@ -1,5 +1,6 @@
 export * from './build';
 export * from './bundle-package';
+export * from './eslint';
 export * from './init';
 export * from './install';
 export * from './kendo-ui-license';

package/src/cli/commands/lint.ts

@@ -1,33 +1,37 @@
 import path from 'path';
 
-import { ESLint } from 'eslint';
 import stylelint from 'stylelint';
 
 import {
     getDestinationFolders,
-    getESLintConfiguration,
     getPackages,
     getStylelintConfiguration,
     log,
     logErrors,
 } from '../../utils';
 import { Command } from '.';
+import { eslint } from '../utils';
 
 const exec = require('@lerna/exec');
 
 interface Args {
     // eslint-disable-next-line @typescript-eslint/naming-convention
     _: string[];
+    /** Apply fixes for issues? */
     fix?: boolean;
+    /** Packages to lint */
     scope?: string | string[];
+    /** Packages to skip */
     ignore?: string | string[];
+    /** Use \@lerna/exec to run eslint separately for each package? */
+    isolated?: boolean;
 }
 
 export class Lint implements Command {
     paths: string[];
 
     constructor(private args: Args) {
-        this.paths = [...this.args._];
+        this.paths = [...args._];
     }
 
     async execute() {
@@ -38,61 +42,42 @@ export class Lint implements Command {
 
     @logErrors
     private async eslint() {
-        const { disabled, ...config } = getESLintConfiguration();
-
-        if (disabled) {
-            return;
-        }
+        const { fix, ignore, isolated, scope } = this.args;
+        const { paths } = this;
 
         log.info('Running the eslint...');
 
-        const eslint = new ESLint({
-            extensions: ['.ts', '.tsx'],
-            baseConfig: {
-                ignorePatterns: [
-                    'node_modules',
-                    '*.css.d.ts',
-                    '*.scss.d.ts',
-                    '*.less.d.ts',
-                    ...getDestinationFolders(),
-                ],
-            },
-            fix: this.args.fix,
-            ...config,
-        });
-
-        let files = this.paths;
-        if (!files.length) {
-            files = [process.cwd()];
-        }
-
-        const results = await eslint.lintFiles(files);
-
-        if (this.args.fix) {
-            await ESLint.outputFixes(results);
+        const useESLint = !isolated && !scope?.length && !ignore?.length;
+        if (this.paths.length || useESLint) {
+            await eslint({ fix, paths });
+            return;
         }
 
-        const formatter = await eslint.loadFormatter('stylish');
-
-        process.stdout.write(formatter.format(results) as string);
+        const packages = getPackages({ scope, ignore });
+        const args = fix ? ['--fix'] : [];
 
-        if (ESLint.getErrorResults(results).length) {
-            process.exitCode = 1;
-        }
+        await exec({
+            cmd: 'startup eslint',
+            scope: packages.map(({ name }) => name),
+            bail: false,
+            args,
+        });
     }
 
     @logErrors
     private async stylelint() {
         const { disabled, ...config } = getStylelintConfiguration();
-
         if (disabled) {
             return;
         }
 
+        const { fix } = this.args;
+        const { paths } = this;
+
         log.info('Running the stylelint...');
         const allowedExtensions = ['css', 'scss', 'less'];
         const glob = `**/*.{${allowedExtensions.join(',')}}`;
-        let files = this.paths.reduce((result, path) => {
+        let files = paths.reduce((result, path) => {
             const extension = path.split('.').pop();
             if (extension) {
                 if (allowedExtensions.includes(extension.toLowerCase())) {
@@ -112,7 +97,7 @@ export class Lint implements Command {
             files,
             ignorePattern: ['node_modules', ...getDestinationFolders()],
             formatter: 'string',
-            fix: this.args.fix,
+            fix,
             ...config,
         });
 
@@ -125,9 +110,11 @@ export class Lint implements Command {
 
     @logErrors
     private async checkStyles() {
+        const { ignore, scope } = this.args;
+
         log.info('Running the style check...');
 
-        const packages = getPackages({ scope: this.args.scope, ignore: this.args.ignore });
+        const packages = getPackages({ ignore, scope });
 
         await exec({
             cmd: 'startup styles-check',

package/src/cli/index.ts

@@ -1,3 +1,4 @@
+import execa from 'execa';
 import { argv, Arguments } from 'yargs';
 
 import { log } from '../utils';
@@ -5,6 +6,7 @@ import {
     Build,
     BundlePackage,
     Command,
+    ESLintCommand,
     Init,
     Install,
     KendoUILicense,
@@ -17,6 +19,7 @@ import {
     StylesCheck,
     Tests,
 } from './commands';
+import { setNodeOptions } from './utils';
 
 interface Newable<T> {
     new (...args: any[]): T;
@@ -24,6 +27,9 @@ interface Newable<T> {
 
 function getCommand(name: string): Newable<Command> {
     switch (name) {
+        case 'eslint':
+            return ESLintCommand;
+
         case 'init':
             return Init;
 
@@ -70,10 +76,16 @@ function getCommand(name: string): Newable<Command> {
 }
 
 const argvSync = argv as Arguments;
-
-// eslint-disable-next-line @typescript-eslint/naming-convention
-new (getCommand(argvSync._[0].toString()))({ ...argvSync, _: argvSync._.slice(1) })
-    .execute()
-    .catch(() => {
+const name = argvSync._[0].toString();
+const Command = getCommand(name);
+
+if (setNodeOptions(name)) {
+    // Run command in child process with amended NODE_OPTIONS
+    execa(process.argv[0], process.argv.slice(1), { stdio: 'inherit' });
+} else {
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    const command = new Command({ ...argvSync, _: argvSync._.slice(1) });
+    command.execute().catch(() => {
         process.exit(1);
     });
+}

package/src/cli/utils/__tests__/assets-copy.test.ts

@@ -1,60 +1,56 @@
-jest.mock('../../../utils/get-folders');
-
-import fs from 'fs';
-import mock from 'mock-fs';
-import { mocked } from 'ts-jest/utils';
-
+import cpx from 'cpx';
 import { getFolders } from '../../../utils';
-import { assetsCopy } from '..';
-
-describe('[Startup] utils:assets-copy', () => {
-    beforeAll(() => {
-        mocked(getFolders).mockReturnValue({ source: 'src', destination: 'dist' });
-    });
-
-    afterAll(() => {
-        mock.restore();
-    });
 
-    test('assetsCopy saves structure', async () => {
-        mock({
-            src: {
-                '1.jpg': '1.jpg',
-                'a': {
-                    '2.jpg': '2.jpg',
-                },
-                'b': {
-                    c: {
-                        '3.jpg': '3.jpg',
-                        '4.jpg': '4.jpg',
-                        '5.jpg': '5.jpg',
-                    },
-                },
-            },
+import { assetsCopy, assetsCopyWatch } from '../assets-copy';
+import { assetExtensions } from '../index';
+
+jest.mock('cpx', () => ({
+    copy: jest.fn().mockImplementation((...args: any[]) => {
+        const callback = args[args.length - 1];
+        callback(null);
+    }),
+    watch: jest.fn(() => ({ on: (_eventName: string, listener: Function) => listener() })),
+}));
+jest.mock('../../../utils', () => ({
+    getFolders: jest.fn(),
+    log: { info: jest.fn() }, // suppress log output
+}));
+
+describe('[startup] Cli Utils (Assets)', () => {
+    const source = 'foo';
+    const destination = 'bar';
+
+    beforeEach(() => jest.mocked(getFolders).mockReturnValue({ source, destination }));
+
+    describe(`${assetsCopy.name}`, () => {
+        const subject = async () => assetsCopy();
+
+        test('copies assets from source to destination', async () => {
+            await subject();
+
+            expect(cpx.copy).toHaveBeenCalledWith(
+                `${source}/**/*.{${assetExtensions.join()}}`,
+                destination,
+                expect.anything()
+            );
         });
-
-        await assetsCopy();
-
-        expect(fs.readFileSync('./dist/1.jpg', 'utf8')).toEqual('1.jpg');
-        expect(fs.readFileSync('./dist/a/2.jpg', 'utf8')).toEqual('2.jpg');
-        expect(fs.readFileSync('./dist/b/c/3.jpg', 'utf8')).toEqual('3.jpg');
-        expect(fs.readFileSync('./dist/b/c/4.jpg', 'utf8')).toEqual('4.jpg');
-        expect(fs.readFileSync('./dist/b/c/5.jpg', 'utf8')).toEqual('5.jpg');
     });
 
-    test('assetsCopy copies only allowed files', async () => {
-        mock({
-            src: {
-                '1.jpg': '1.jpg',
-                '2.tsx': '2.tsx',
-                '3.png': '3.png',
-            },
+    describe(`${assetsCopyWatch.name}`, () => {
+        const subject = async () => assetsCopyWatch();
+
+        test('copies assets from source to destination in watch mode', async () => {
+            try {
+                await subject();
+            } catch (error: any) {
+                // ignore rejected promise that terminates watch()
+            }
+
+            expect(cpx.watch).toHaveBeenCalledWith(
+                `${source}/**/*.{${assetExtensions.join()}}`,
+                destination,
+                { initialCopy: false }
+            );
         });
-
-        await assetsCopy();
-
-        expect(fs.existsSync('./dist/1.jpg')).toBeTruthy();
-        expect(fs.existsSync('./dist/2.tsx')).toBeFalsy();
-        expect(fs.existsSync('./dist/3.png')).toBeTruthy();
     });
 });