sand4rt / playwright-ct-angular Goto Github PK
View Code? Open in Web Editor NEWPlaywright Angular component testing.
Home Page: https://www.npmjs.com/package/@sand4rt/experimental-ct-angular
License: MIT License
playwright-ct-angular's People
Contributors
Stargazers
Watchers
playwright-ct-angular's Issues
Support for Angular 16
When I upgrade to Angular 16 and install the dependencies of the example app via npm, playwright test fails with the following error message:
TypeError: plugin.default is not a functionYou can take a look at it here: https://github.com/rainerhahnekamp/playwright-ct-angular/tree/ng-16.2
Components are not compiled
Version: 1.41.2
Components should be compiled before they are mounted.
Error: Error: Component 'AppComponent' is not resolved:
- templateUrl: ./app.component.html
- styleUrls: ["./app.component.css"]
Did you run and wait for 'resolveComponentResources()'?
at AppComponent.get (http://localhost:3100/assets/index-9fa00b93.js:33829:27)
at getComponentDef$2 (http://localhost:3100/assets/index-9fa00b93.js:9986:16)
at reflectComponentType (http://localhost:3100/assets/index-9fa00b93.js:39701:26)
at __pwRenderComponent (http://localhost:3100/assets/index-9fa00b93.js:117317:29)
at window.playwrightMount (http://localhost:3100/assets/index-9fa00b93.js:117356:25)
at eval (eval at evaluate (:226:30), <anonymous>:12:18)
at async <anonymous>:252:30
at AppComponent.get (<omitted>/web-component-harness/WebComponentHarness/http:/localhost:3100/assets/index-9fa00b93.js:33829:27)
at getComponentDef$2 (<omitted>/web-component-harness/WebComponentHarness/http:/localhost:3100/assets/index-9fa00b93.js:9986:16)
at reflectComponentType (<omitted>/web-component-harness/WebComponentHarness/http:/localhost:3100/assets/index-9fa00b93.js:39701:26)
at __pwRenderComponent (<omitted>/web-component-harness/WebComponentHarness/http:/localhost:3100/assets/index-9fa00b93.js:117317:29)
at window.playwrightMount (<omitted>/web-component-harness/WebComponentHarness/http:/localhost:3100/assets/index-9fa00b93.js:117356:25)
at eval (<omitted>/web-component-harness/WebComponentHarness/eval at evaluate (:226:30), <anonymous>:12:18)
at <omitted>/web-component-harness/WebComponentHarness/async <anonymous>:252:30
at mount (<omitted>/web-component-harness/WebComponentHarness/node_modules/@playwright/experimental-ct-core/lib/mount.js:50:35)
at <omitted>/web-component-harness/WebComponentHarness/src/app/harness.spec.ts:33:24
Minimal reproduction
// app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
standalone: true,
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {}// app.component.spec.ts
import {test} from "@sand4rt/experimental-ct-angular";
import {AppComponent} from "./app.component";
test.describe('harness', () => {
test('it should work', async ({ mount }) => {
const spec = await mount(AppComponent)
})
})[Bug] Sourcemap is likely to be incorrect: a plugin (@analogjs/vite-plugin-angular)
When building Playwright component tests i see a lot of sourcemap warnings. See pipeline: https://github.com/sand4rt/playwright-ct-angular/actions/runs/5036859856/jobs/9033313003#step:8:18
related to: analogjs/analog#410
Testbed fails to compile
Version: 1.41.2
Tests that use beforeMount to configure TestBed fail to run.
npm run test-ct
> [email protected] test-ct
> playwright test -c playwright-ct.config.ts
JIT compilation failed for injectable [class PlatformLocation]
Error: The injectable 'PlatformLocation' needs to be compiled using the JIT compiler, but '@angular/compiler' is not available.
The injectable is part of a library that has been partially compiled.
However, the Angular Linker has not processed the library such that JIT compilation is used as fallback.
Ideally, the library is processed using the Angular Linker to become fully AOT compiled.
Alternatively, the JIT compiler should be loaded by bootstrapping using '@angular/platform-browser-dynamic' or '@angular/platform-server',
or manually provide the compiler with 'import "@angular/compiler";' before bootstrapping.
at getCompilerFacade (<omitted>/packages/core/src/compiler/compiler_facade.ts:52:11)
at Module.ɵɵngDeclareFactory (<omitted>/packages/core/src/render3/jit/partial.ts:58:20)
at Function.<static_initializer> (<omitted>/node_modules/@angular/common/fesm2022/common.mjs:64:29)
at <omitted>/packages/common/src/dom_tokens.ts:18:25
Minimal reproduction
import {test} from "@sand4rt/experimental-ct-angular";
import {beforeMount} from "@sand4rt/experimental-ct-angular/hooks";
import {NoopAnimationsModule} from "@angular/platform-browser/animations";
test.describe('harness', () => {
beforeMount(async ({ TestBed }) => {
TestBed.configureTestingModule({
imports: [NoopAnimationsModule]
})
})
})Support for non standalone angular component
Hi @sand4rt
I am trying to understand how and if we can use this for non standalone angular components. Can you please help.
Thanks in advance!
ReferenceError: window is not defined
Version: 1.41.2
I'm testing out this library and ran into this error when using beforeMount in my component test.
npm run test-ct
> [email protected] test-ct
> playwright test -c playwright-ct.config.ts
ReferenceError: window is not defined
at node_modules/@sand4rt/experimental-ct-angular/hooks.mjs:20:1
Minimal reproduction:
import {test} from "@sand4rt/experimental-ct-angular";
import {AppComponent} from "./app.component";
import {beforeMount} from "@sand4rt/experimental-ct-angular/hooks";
test.describe('harness', () => {
beforeMount(async ({ TestBed }) => {
TestBed.configureTestingModule({
imports: []
})
})
test('it should work', async ({ mount }) => {
const spec = await mount(AppComponent)
})
})Consider changing window to globalThis?
[Feature] use JIT mode for faster compilation
Use JIT mode for testing faster compilation. Related to: analogjs/analog#409
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.