feat(swc-angular): ✨ require @swc/core@~1.13.0

This also fixes broken transform when using constructor DI.

Fixes #304

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Younes Jaaidi <[email protected]>

Author: renovate[bot]

package.json

@@ -83,10 +83,10 @@
     "@playwright/experimental-ct-core": "1.50.1",
     "@playwright/test": "1.50.1",
     "@schematics/angular": "19.2.15",
-    "@swc-node/register": "1.10.9",
-    "@swc/core": "1.10.18",
-    "@swc/helpers": "0.5.15",
-    "@swc/jest": "0.2.37",
+    "@swc-node/register": "1.11.1",
+    "@swc/core": "1.13.5",
+    "@swc/helpers": "0.5.17",
+    "@swc/jest": "0.2.39",
     "@types/babel__core": "^7.20.5",
     "@types/jest": "29.5.14",
     "@types/node": "^22.10.1",

packages/swc-angular/src/index.ts

@@ -103,11 +103,11 @@ function assertCompatibleSwcCoreVersion(version: string) {
     }>(packageJsonPath).version;
   }
 
-  if (!version.startsWith('1.10.')) {
+  if (!version.startsWith('1.13.')) {
     console.error(`
     @swc/core version ${version} is incompatible with @jscutlery/swc-angular.
-    Please use @swc/core version 1.10.x
-    > npm add -D @swc/core@~1.10.0
+    Please use @swc/core version 1.13.x
+    > npm add -D @swc/core@~1.13.0
     `);
     process.exit(1);
   }

packages/swc-angular/src/version-guard.spec.ts

@@ -13,8 +13,8 @@ import { join } from 'node:path';
  */
 
 test.each([
-  [' <1.10.0', { version: '1.9.3' }],
-  ['>=1.11.0', { version: '1.11.0' }],
+  [' <1.13.0', { version: '1.12.0' }],
+  ['>=1.14.0', { version: '1.14.0' }],
 ])(
   'should throw an error when module is imported and version is %s',
   async (_, { version }) => {
@@ -37,8 +37,8 @@ test.each([
   },
 );
 
-test.each(['1.10.0', '1.10.7'])(
-  'should not throw an error when module is imported and version is ~1.10.0',
+test.each(['1.13.0', '1.13.7'])(
+  'should not throw an error when module is imported and version is ~1.13.0',
   async (version) => {
     setUp();
 
@@ -60,7 +60,7 @@ test('should fallback to package.json if version is not available (this happens
     version: undefined,
   }));
   fileSystem.setJsonFile('node_modules/@swc/core/package.json', {
-    version: '1.10.7',
+    version: '1.13.0',
   });
 
   await import('./index');
@@ -69,7 +69,7 @@ test('should fallback to package.json if version is not available (this happens
   expect(process.exit).not.toHaveBeenCalledOnce();
 });
 
-test.each(['1.9.3', '1.11.0'])(
+test.each(['1.12.0', '1.14.0'])(
   'should throw an error if version from package.json is not compatible',
   async (version) => {
     const { fileSystem } = setUp();

tests/playwright-ct-angular-demo/src/recipe-search.component.pw.ts

@@ -6,13 +6,20 @@ import {
 import { RecipeSearchTestContainer } from './recipe-search.test-container';
 
 test.describe('<wm-recipe-search>', () => {
-  test('should search recipes without keyword on load', async ({ mount }) => {
-    const { recipeTitleLocator, verifyScreenshot } =
-      await renderSearchComponent({ mount });
+  test('should search recipes without keyword on load', async ({
+    page,
+    mount,
+  }) => {
+    const { recipeTitleLocator } = await renderSearchComponent({ mount });
 
     await expect(recipeTitleLocator).toHaveText(['Beer', 'Burger']);
 
-    await verifyScreenshot('all recipes');
+    /* Prefer using whole page screenshot for two reasons:
+     * 1. it's the same resolution and the Playwright reporter diff will show slider.
+     * 2. we make sure that there's no extra overlay in the DOM (e.g. dialog). */
+    await expect(page).toHaveScreenshot(`all recipes.png`, {
+      maxDiffPixelRatio: 0.3,
+    });
   });
 
   test('should search recipes using given filter', async ({ mount }) => {
@@ -35,24 +42,6 @@ test.describe('<wm-recipe-search>', () => {
       async updateFilter({ keywords }: { keywords: string }) {
         await locator.getByLabel('Keywords').fill(keywords);
       },
-      async verifyScreenshot(name: string) {
-        /* Wait for images to load. */
-        await locator.page().waitForFunction(() => {
-          const images = Array.from(document.querySelectorAll('img'));
-          return images.every(img => img.complete);
-        });
-
-        /* For some reason, Firefox reaches here while all images didn't load yet.
-         * Keep trying until it succeeds. */
-        await expect(async () => {
-          /* Prefer using whole page screenshot for two reasons:
-           * 1. it's the same resolution and the Playwright reporter diff will show slider.
-           * 2. we make sure that there's no extra overlay in the DOM (e.g. dialog). */
-          await expect(locator.page()).toHaveScreenshot(`${name}.png`, {
-            maxDiffPixelRatio: 0.3,
-          });
-        }).toPass();
-      },
     };
   }
 });

tests/swc-angular-wide/src/swc-plugin-angular-input.spec.ts

@@ -96,34 +96,30 @@ describe('swc-angular-plugin: input', () => {
     expect(heading).toBe('Hello required input alias!');
   });
 
-  /* Cf. https://github.com/jscutlery/devkit/issues/304 */
-  it.fails(
-    '🐞 should bind inputs even when property is assigned using constructor injection',
-    () => {
-      @Component({
-        standalone: true,
-        selector: 'jsc-title',
-        template: ` <h1>Hello {{ title() }}!</h1> `,
-      })
-      class Title {
-        title = input<string>();
-
-        constructor(private _service: Service) {}
-      }
-
-      @Component({
-        standalone: true,
-        imports: [Title],
-        template: ` <jsc-title [title]="title" /> `,
-      })
-      class Container {
-        title = 'input';
-      }
-
-      const { heading } = render(Container);
-      expect(heading).toBe('Hello input!');
-    },
-  );
+  it('should bind inputs even when property is assigned using constructor injection', () => {
+    @Component({
+      standalone: true,
+      selector: 'jsc-title',
+      template: ` <h1>Hello {{ title() }}!</h1> `,
+    })
+    class Title {
+      title = input<string>();
+
+      constructor(private _service: Service) {}
+    }
+
+    @Component({
+      standalone: true,
+      imports: [Title],
+      template: ` <jsc-title [title]="title" /> `,
+    })
+    class Container {
+      title = 'input';
+    }
+
+    const { heading } = render(Container);
+    expect(heading).toBe('Hello input!');
+  });
 
   function render(cmpType: Type<unknown>) {
     const { nativeElement } = createComponent(cmpType);

tests/swc-angular-wide/src/test-setup.ts

@@ -1,13 +1,9 @@
-// @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
-globalThis.ngJest = {
-  testEnvironmentOptions: {
-    errorOnUnknownElements: true,
-    errorOnUnknownProperties: true,
-  },
-};
 import 'reflect-metadata';
 import { setupZoneTestEnv } from 'jest-preset-angular/setup-env/zone';
 import { it } from '@jest/globals';
 
 (globalThis as any).it.fails = it.failing;
-setupZoneTestEnv();
+setupZoneTestEnv({
+  errorOnUnknownElements: true,
+  errorOnUnknownProperties: true,
+});