feat(qwik-nx): build executor should run type checking (#143)

* feat(qwik-nx): build executor should run type checking

* test: build type check e2e

Author: dmitry-stepanenko

e2e/qwik-nx-e2e/tests/__snapshots__/application.spec.ts.snap

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`appGenerator e2e Basic behavior with app generator should run type checking before the build step: stderr 1`] = `""`;
+
+exports[`appGenerator e2e Basic behavior with app generator should run type checking before the build step: stdout 1`] = `
+"
+> nx run PROJECT_NAME:build
+
+ >  NX   Running type check for the \\"PROJECT_NAME\\"..
+   npx tsc --incremental --noEmit --pretty -p REPLACED_PATH/tsconfig.app.json
+apps/PROJECT_NAME/src/routes/index.tsx:8:15 - error TS2322: Type 'string' is not assignable to type 'number'.
+8               a = 'not-a-number';
+                ~
+libs/LIB_PROJECT_NAME/src/lib/LIB_PROJECT_NAME.tsx:7:22 - error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.
+7               b.push(1);
+                       ~
+Found 2 errors in 2 files.
+Errors  Files
+     1  apps/PROJECT_NAME/src/routes/index.tsx:8
+     1  libs/LIB_PROJECT_NAME/src/lib/LIB_PROJECT_NAME.tsx:7
+
+ 
+
+ >  NX   Running target build for project PROJECT_NAME failed
+
+   Failed tasks:
+   
+   - PROJECT_NAME:build
+   
+   Hint: run the command with --verbose for more details.
+
+"
+`;

e2e/qwik-nx-e2e/tests/__snapshots__/preset.spec.ts.snap

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`presetGenerator e2e Basic behavior with preset generator should run type checking before the build step: stderr 1`] = `""`;
+
+exports[`presetGenerator e2e Basic behavior with preset generator should run type checking before the build step: stdout 1`] = `
+"
+> nx run PROJECT_NAME:build
+
+ >  NX   Running type check for the \\"PROJECT_NAME\\"..
+   npx tsc --incremental --noEmit --pretty -p REPLACED_PATH/tsconfig.app.json
+apps/PROJECT_NAME/src/routes/index.tsx:8:15 - error TS2322: Type 'string' is not assignable to type 'number'.
+8               a = 'not-a-number';
+                ~
+libs/LIB_PROJECT_NAME/src/lib/LIB_PROJECT_NAME.tsx:7:22 - error TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.
+7               b.push(1);
+                       ~
+Found 2 errors in 2 files.
+Errors  Files
+     1  apps/PROJECT_NAME/src/routes/index.tsx:8
+     1  libs/LIB_PROJECT_NAME/src/lib/LIB_PROJECT_NAME.tsx:7
+
+ 
+
+ >  NX   Running target build for project PROJECT_NAME failed
+
+   Failed tasks:
+   
+   - PROJECT_NAME:build
+   
+   Hint: run the command with --verbose for more details.
+
+"
+`;

e2e/qwik-nx-e2e/tests/application-basic-behavior.suite.ts

@@ -5,6 +5,7 @@ import {
   ensureNxProject,
   runNxCommandAsync,
   uniq,
+  updateFile,
 } from '@nx/plugin/testing';
 
 import {
@@ -15,12 +16,17 @@ import {
   killPorts,
   DEFAULT_E2E_TIMEOUT,
 } from '@qwikifiers/e2e/utils';
+import { names } from '@nx/devkit';
 
 export function testApplicationBasicBehavior(generator: 'app' | 'preset') {
   const devServerPort = 4212;
   const previewServerPort = 4232;
   describe(`Basic behavior with ${generator} generator`, () => {
     let project: string;
+    let libProject: string;
+    let rootRoutePath: string;
+    let libComponentName: string;
+    let libComponentPath: string;
 
     beforeAll(async () => {
       await killPorts(devServerPort, previewServerPort);
@@ -29,16 +35,30 @@ export function testApplicationBasicBehavior(generator: 'app' | 'preset') {
 
     beforeAll(async () => {
       project = uniq('qwik-nx');
+      libProject = uniq('qwik-nx');
+      rootRoutePath = `apps/${project}/src/routes/index.tsx`;
+      libComponentPath = `libs/${libProject}/src/lib/${libProject}.tsx`;
+      libComponentName = names(libProject).className;
 
       const projectNameParam =
         generator === 'preset' ? `--qwikAppName=${project}` : project;
 
       await runNxCommandAsync(
         `generate qwik-nx:${generator} ${projectNameParam} --no-interactive`
       );
+      await runNxCommandAsync(
+        `generate qwik-nx:library ${libProject} --no-interactive`
+      );
       await runNxCommandAsync(
         `generate qwik-nx:component my-test-component --project=${project} --unitTestRunner=vitest --no-interactive`
       );
+      updateFile(rootRoutePath, (content) => {
+        content =
+          `import { ${libComponentName} } from '@proj/${libProject}';\n` +
+          content;
+        content = content.replace('<h1>', `<${libComponentName}/>\n<h1>`);
+        return content;
+      });
     }, DEFAULT_E2E_TIMEOUT);
 
     afterAll(async () => {
@@ -53,6 +73,9 @@ export function testApplicationBasicBehavior(generator: 'app' | 'preset') {
       'should create qwik-nx',
       async () => {
         const result = await runNxCommandAsync(`build ${project}`);
+        expect(result.stdout).toContain(
+          `Running type check for the "${project}"..`
+        );
         expect(
           stripConsoleColors(result.stdout.replace(/\n|\s/g, ''))
         ).toContain(
@@ -77,6 +100,53 @@ export function testApplicationBasicBehavior(generator: 'app' | 'preset') {
       DEFAULT_E2E_TIMEOUT
     );
 
+    it(
+      'should run type checking before the build step',
+      async () => {
+        let originalContent!: string;
+        let originalLibContent!: string;
+        updateFile(rootRoutePath, (content) => {
+          originalContent = content;
+          return content.replace(
+            'export default component$(() => {',
+            `export default component$(() => {
+              let a = 0;
+              a = 'not-a-number';
+            `
+          );
+        });
+        updateFile(libComponentPath, (content) => {
+          originalLibContent = content;
+          return content.replace(
+            'component$(() => {',
+            `component$(() => {
+              let b: string[] = ['some-string'];
+              b.push(1);
+            `
+          );
+        });
+
+        const result = await runNxCommandAsync(`build ${project} --verbose`, {
+          silenceError: true,
+        });
+
+        // restore original contents
+        updateFile(rootRoutePath, originalContent);
+        updateFile(libComponentPath, originalLibContent);
+
+        function replaceDynamicContent(output: string) {
+          return output
+            .replaceAll(project, 'PROJECT_NAME')
+            .replaceAll(libProject, 'LIB_PROJECT_NAME')
+            .replace(/-p .+/, '-p REPLACED_PATH/tsconfig.app.json');
+        }
+
+        expect(replaceDynamicContent(result.stderr)).toMatchSnapshot('stderr');
+        expect(replaceDynamicContent(result.stdout)).toMatchSnapshot('stdout');
+      },
+      DEFAULT_E2E_TIMEOUT
+    );
+
     it(
       'unit tests should pass in the created app',
       async () => {

e2e/qwik-nx-e2e/tsconfig.spec.json

@@ -2,6 +2,7 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
+    "lib": ["es2022", "dom"],
     "module": "commonjs",
     "types": ["jest", "node"]
   },

packages/qwik-nx/src/executors/build/executor.spec.ts

@@ -1,9 +1,17 @@
 import { BuildExecutorSchema } from './schema';
 import executor from './executor';
-import { ExecutorContext, runExecutor, Target } from '@nx/devkit';
+import {
+  ExecutorContext,
+  ProjectsConfigurations,
+  runExecutor,
+  Target,
+} from '@nx/devkit';
+import { resolve } from 'path';
 
 // eslint-disable-next-line @typescript-eslint/no-var-requires
 const devkit: { runExecutor: typeof runExecutor } = require('@nx/devkit');
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const fs = require('fs');
 
 enum MockFailTargets {
   NoSuccess = 'mock-no-success',
@@ -12,6 +20,15 @@ enum MockFailTargets {
 
 describe('Build Executor', () => {
   let runExecutorPayloads: Target[] = [];
+  const defaultContext = {
+    root: '/root',
+    projectName: 'my-app',
+    targetName: 'build',
+    configurationName: 'production',
+    projectsConfigurations: {
+      projects: { 'my-app': { projectType: 'application', root: '/root' } },
+    } as any as ProjectsConfigurations,
+  } as ExecutorContext;
 
   jest.spyOn(devkit, 'runExecutor').mockImplementation((target: Target) => {
     if (target.target === MockFailTargets.NoSuccess) {
@@ -44,17 +61,11 @@ describe('Build Executor', () => {
   });
 
   it('should execute targets sequentially', async () => {
-    const context = {
-      root: '/root',
-      projectName: 'my-app',
-      targetName: 'build',
-      configurationName: 'production',
-    } as ExecutorContext;
-
     const options: BuildExecutorSchema = {
       runSequence: ['my-app:target1:development', 'my-app:target2'],
+      skipTypeCheck: true,
     };
-    const iterable = executor(options, context);
+    const iterable = executor(options, defaultContext);
     let result = await iterable.next();
     expect(result.value?.success).toEqual(true);
     expect(runExecutorPayloads).toEqual([
@@ -66,13 +77,6 @@ describe('Build Executor', () => {
   });
 
   it('should stop execution if executor returned "success: false"', async () => {
-    const context = {
-      root: '/root',
-      projectName: 'my-app',
-      targetName: 'build',
-      configurationName: 'production',
-    } as ExecutorContext;
-
     const target = MockFailTargets.NoSuccess;
 
     const options: BuildExecutorSchema = {
@@ -81,8 +85,9 @@ describe('Build Executor', () => {
         `my-app:${target}`,
         'my-app:target2',
       ],
+      skipTypeCheck: true,
     };
-    const iterable = executor(options, context);
+    const iterable = executor(options, defaultContext);
     let result = await iterable.next();
     expect(result.value?.success).toEqual(false);
     expect(runExecutorPayloads).toEqual([
@@ -94,13 +99,6 @@ describe('Build Executor', () => {
   });
 
   it('should stop execution if unhandled error occurs', async () => {
-    const context = {
-      root: '/root',
-      projectName: 'my-app',
-      targetName: 'build',
-      configurationName: 'production',
-    } as ExecutorContext;
-
     const target = MockFailTargets.Error;
 
     const options: BuildExecutorSchema = {
@@ -109,8 +107,9 @@ describe('Build Executor', () => {
         `my-app:${target}`,
         'my-app:target2',
       ],
+      skipTypeCheck: true,
     };
-    const iterable = executor(options, context);
+    const iterable = executor(options, defaultContext);
     let result = await iterable.next();
     expect(result.value?.success).toEqual(false);
     expect(runExecutorPayloads).toEqual([
@@ -120,4 +119,33 @@ describe('Build Executor', () => {
     result = await iterable.next();
     expect(result.done).toEqual(true);
   });
+
+  describe('type check', () => {
+    const defaultOptionsForTypeCheck: BuildExecutorSchema = {
+      runSequence: ['my-app:target1:development', 'my-app:target2'],
+    };
+
+    it('should throw an error if tsconfig is not found at default location', async () => {
+      jest.spyOn(fs, 'existsSync').mockReturnValue(false);
+      const iterable = executor(defaultOptionsForTypeCheck, defaultContext);
+      await expect(iterable.next()).rejects.toThrow(
+        `Could not find tsconfig at "${resolve(
+          '/root/tsconfig.app.json'
+        )}". If project's tsconfig file name is not standard, provide the path to it as "tsConfig" executor option.`
+      );
+    });
+    it('should throw an error if tsconfig is not found at specified location', async () => {
+      jest.spyOn(fs, 'existsSync').mockReturnValue(false);
+      const iterable = executor(
+        {
+          ...defaultOptionsForTypeCheck,
+          tsConfig: '/root/tsconfig.other.json',
+        },
+        defaultContext
+      );
+      await expect(iterable.next()).rejects.toThrow(
+        `Could not find tsconfig at "${resolve('/root/tsconfig.other.json')}".`
+      );
+    });
+  });
 });