Add support for Angular 17 (#5)

* feat(ct): angular component testing * test(ct): test non-event-emitter outputs * test(ct): test output listener replacement * feat(ct): support non-event-emitter outputs * docs(ct): angular * fix(ct): angular source maps * chore(ct): new angular logo * refactor(ct-angular): bump to Angular 17 and move out analogjs plugin Co-authored-by: Edouard Bozon <bozonedouard@gmail.com> * refactor(ct-angular): fix component resolution by temporary removing analogjs plugin Co-authored-by: Edouard Bozon <bozonedouard@gmail.com> * refactor(ct-angular): fix mount Co-authored-by: Edouard Bozon <bozonedouard@gmail.com> * refactor(ct-angular): disable analog plugin as it breaks component registration * refactor(ct-angular): fix input forwarding * refactor(ct-angular): fix angular outputs * refactor(ct-angular): fix angular slots * test(ct-angular): fix all tests * test(ct-angular): fix all angular tests * test(ct-angular): use analog's vite plugin to handle template files * refactor(ct-angular): remove router-specific code * refactor(ct-angular): clean up dependencies * refactor(ct-angular): remove compiler import * refactor(ct-angular): fix vite version mismatch in tests * refactor(ct-angular): bump @playwright/experimental-ct-angular to 1.42.0-next * test(ct-angular): add tests for template rendering * feat(ct-angular): render simple template * feat(ct-angular): render template with child components * feat(ct-angular): render component with signal inputs * test(ct-angular): make input required * test(ct-angular): remove now useless import * feat(ct-angular): allow setting providers * refactor(ct-angular): clean up slots remains * feat(ct): angular component testing * test(ct): test non-event-emitter outputs * test(ct): test output listener replacement * feat(ct): support non-event-emitter outputs * fix(ct): angular source maps * docs(ct): angular * chore(ct): new angular logo * feat(ct-angular): add pw-angular bin * test(ct-angular): fix type check use strict dependencies versions to reduce unpredictable behavior as package-lock.json is gitignored * refactor(ct-angular): remove useless NODE_ENV=test as we are setting the tsconfig manually Cf. #5 (comment) * refactor(ct-angular): use playwright.config.mts as analog vite plugin is esm only * chore(ct-angular): lint * fix(ct-angular): resolve Angular component usages * fix(ct-angular): resolve Angular imports/providers usages * test(ct-angular): test url change * test(ct-angular): remove duplicate test * chore(ct-angular): remove useless pw-angular cli * chore(ct-angular): remove duplicate PlaywrightTestConfig type * feat(ct-angular): export the right types * chore(ct-angular): tidy up * feat(ct-angular): throw an explicit error when mounting JSX * chore(ct-angular): remove vite from devDependencies as not used anymore * chore(ct-angular): remove useless skipLibCheck flag * chore(ct-angular): remove useless @angular/compiler Angular's esbuild plugin will automatically add it in jit mode anyway. Users who really want to use another plugin that requires it can still add it manually to their playwright/index.ts. * test(ct-angular): improve output listener update test * chore(ct): revert adapters imports and template --------- Co-authored-by: sand4rt <info@mesander.com> Co-authored-by: Edouard Bozon <bozonedouard@gmail.com>
sand4rt · May 7, 2024 · 5c69609 · 5c69609
1 parent f76fecb
commit 5c69609
Show file tree

Hide file tree

Showing 22 changed files with 5,928 additions and 12,826 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/playwright-ct-angular/cli.js b/packages/playwright-ct-angular/cli.js
@@ -14,4 +14,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-module.exports = require('@playwright/experimental-ct-core/cli');
+
+const { program } = require('@playwright/experimental-ct-core/lib/program');
+
+program.parse(process.argv);
diff --git a/packages/playwright-ct-angular/index.d.ts b/packages/playwright-ct-angular/index.d.ts
@@ -14,41 +14,20 @@
  * limitations under the License.
  */
 
-import type {
-  TestType,
-  PlaywrightTestArgs,
-  PlaywrightTestConfig as BasePlaywrightTestConfig,
-  PlaywrightTestOptions,
-  PlaywrightWorkerArgs,
-  PlaywrightWorkerOptions,
-  Locator,
-} from '@playwright/test';
+import type { Locator } from 'playwright/test';
 import type { JsonObject } from '@playwright/experimental-ct-core/types/component';
-import type { InlineConfig } from 'vite';
+import type { TestType } from '@playwright/experimental-ct-core';
 import type { Type } from '@angular/core';
 
-export type PlaywrightTestConfig<T = {}, W = {}> = Omit<BasePlaywrightTestConfig<T, W>, 'use'> & {
-  use?: BasePlaywrightTestConfig<T, W>['use'] & {
-    ctPort?: number;
-    ctTemplateDir?: string;
-    ctCacheDir?: string;
-    ctViteConfig?: InlineConfig | (() => Promise<InlineConfig>);
-  };
-};
-
-type ComponentSlot = string | string[];
-type ComponentSlots = Record<string, ComponentSlot> & { default?: ComponentSlot };
-
-type ComponentEvents = Record<string, Function>;
+export type ComponentEvents = Record<string, Function>;
 
 export interface MountOptions<HooksConfig extends JsonObject, Component> {
-  props?: Partial<Component>, // TODO: filter props
-  slots?: ComponentSlots;
+  props?: Partial<Component> | Record<string, unknown>, // TODO: filter props and handle signals
   on?: ComponentEvents;
   hooksConfig?: HooksConfig;
 }
 
-interface MountResult<Component> extends Locator {
+export interface MountResult<Component> extends Locator {
   unmount(): Promise<void>;
   update(options: {
     props?: Partial<Component>,
@@ -63,13 +42,7 @@ export interface ComponentFixtures {
   ): Promise<MountResult<Component>>;
 }
 
-export const test: TestType<
-  PlaywrightTestArgs & PlaywrightTestOptions & ComponentFixtures,
-  PlaywrightWorkerArgs & PlaywrightWorkerOptions
->;
-
-export function defineConfig(config: PlaywrightTestConfig): PlaywrightTestConfig;
-export function defineConfig<T>(config: PlaywrightTestConfig<T>): PlaywrightTestConfig<T>;
-export function defineConfig<T, W>(config: PlaywrightTestConfig<T, W>): PlaywrightTestConfig<T, W>;
+export const test: TestType<ComponentFixtures>;
 
-export { expect, devices } from '@playwright/test';
+export { defineConfig, PlaywrightTestConfig } from '@playwright/experimental-ct-core';
+export { expect, devices } from 'playwright/test';
diff --git a/packages/playwright-ct-angular/index.js b/packages/playwright-ct-angular/index.js
@@ -14,25 +14,19 @@
  * limitations under the License.
  */
 
-const { test, expect, devices, defineConfig: originalDefineConfig } = require('@playwright/experimental-ct-core');
+const { defineConfig: originalDefineConfig, devices, expect, test } = require('@playwright/experimental-ct-core');
 const path = require('path');
 
-process.env['NODE_ENV'] = 'test';
+const defineConfig = (config, ...configs) => {
+  return originalDefineConfig({
+    ...config,
+    '@playwright/test': {
+      packageJSON: require.resolve('./package.json'),
+    },
+    '@playwright/experimental-ct-core': {
+      registerSourceFile: path.join(__dirname, 'registerSource.mjs')
+    },
+  }, ...configs);
+};
 
-function plugin() {
-  // Only fetch upon request to avoid resolution in workers.
-  const { createPlugin } = require('@playwright/experimental-ct-core/lib/vitePlugin');
-  return createPlugin(
-      path.join(__dirname, 'registerSource.mjs'),
-      () => import('@analogjs/vite-plugin-angular').then(plugin => {
-        // TODO: remove the typeof plugin.default check
-        if (typeof plugin.default === 'function')
-          return plugin.default({ jit: false });
-        return plugin.default.default({ jit: false });
-      })
-  );
-}
-
-const defineConfig = config => originalDefineConfig({ ...config, _plugins: [plugin] });
-
-module.exports = { test, expect, devices, defineConfig };
+module.exports = { defineConfig, devices, expect, test };
diff --git a/packages/playwright-ct-angular/package.json b/packages/playwright-ct-angular/package.json
@@ -1,10 +1,10 @@
 {
   "name": "@playwright/experimental-ct-angular",
-  "version": "1.42.0-next",
+  "version": "1.43.0-next",
   "description": "Playwright Component Testing for Angular",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/sand4rt/playwright-ct-angular.git"
+    "url": "git+https://github.com/microsoft/playwright.git"
   },
   "homepage": "https://playwright.dev",
   "engines": {
@@ -29,35 +29,23 @@
     }
   },
   "dependencies": {
-    "@analogjs/vite-plugin-angular": "0.2.28",
-    "@angular-devkit/build-angular": "^16.1.0",
-    "@playwright/experimental-ct-core": "1.42.0-next",
-    "vite": "^4.4.9"
+    "@playwright/experimental-ct-core": "1.43.0-next"
   },
   "devDependencies": {
-    "@angular/animations": "^16.1.7",
-    "@angular/common": "^16.1.7",
-    "@angular/compiler": "^16.1.7",
-    "@angular/compiler-cli": "^16.1.7",
-    "@angular/core": "^16.1.7",
-    "@angular/platform-browser": "^16.1.7",
-    "@angular/platform-browser-dynamic": "^16.1.7",
-    "@angular/router": "^16.1.7",
-    "@playwright/test": "1.38.1",
+    "@angular/compiler": "^17.0.0",
+    "@angular/core": "^17.0.0",
+    "@angular/platform-browser-dynamic": "^17.0.0",
     "rxjs": "~7.8.1",
-    "tslib": "^2.5.0",
-    "typescript": "^5.0.4",
-    "zone.js": "~0.13.1"
+    "typescript": "~5.2.0",
+    "zone.js": "~0.14.0"
   },
   "peerDependencies": {
-    "@playwright/test": ">=1.38.1",
-    "typescript": ">=4.9.3",
-    "@angular/common": ">=15.1.0 || >=16.0.0",
-    "@angular/platform-browser": ">=15.1.0 || >=16.0.0",
-    "@angular/router": ">=15.1.0 || >=16.0.0",
-    "@angular/core": ">=15.1.0 || >=16.0.0"
+    "@angular/compiler": "^17.0.0",
+    "@angular/core": "^17.0.0",
+    "@angular/platform-browser-dynamic": "^17.0.0",
+    "typescript": ">=5.2.0"
   },
   "bin": {
-    "playwright": "./cli.js"
+    "playwright": "cli.js"
   }
 }