{"id":13807999,"url":"https://github.com/sand4rt/playwright-ct-angular","last_synced_at":"2025-06-27T10:09:42.051Z","repository":{"id":98768211,"uuid":"607376637","full_name":"sand4rt/playwright-ct-angular","owner":"sand4rt","description":"Playwright Angular component testing.","archived":false,"fork":false,"pushed_at":"2025-06-21T12:31:41.000Z","size":185653,"stargazers_count":48,"open_issues_count":4,"forks_count":4,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-06-21T13:34:21.523Z","etag":null,"topics":["angular","component","component-testing","playwright","test","testing"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@sand4rt/experimental-ct-angular","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sand4rt.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":["sand4rt"]}},"created_at":"2023-02-27T21:22:45.000Z","updated_at":"2025-06-21T12:29:26.000Z","dependencies_parsed_at":"2024-08-04T01:08:38.423Z","dependency_job_id":"add471dc-6ad4-48da-ac0f-b6d5bd662a88","html_url":"https://github.com/sand4rt/playwright-ct-angular","commit_stats":null,"previous_names":[],"tags_count":135,"template":false,"template_full_name":null,"purl":"pkg:github/sand4rt/playwright-ct-angular","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sand4rt%2Fplaywright-ct-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sand4rt%2Fplaywright-ct-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sand4rt%2Fplaywright-ct-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sand4rt%2Fplaywright-ct-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sand4rt","download_url":"https://codeload.github.com/sand4rt/playwright-ct-angular/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sand4rt%2Fplaywright-ct-angular/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":262235803,"owners_count":23279570,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","component","component-testing","playwright","test","testing"],"created_at":"2024-08-04T01:01:33.513Z","updated_at":"2025-06-27T10:09:42.043Z","avatar_url":"https://github.com/sand4rt.png","language":"JavaScript","readme":"# 🎭 Playwright Angular component testing\n\n\u003e **Note**\n\u003e The API has been designed to closely resemble Playwright's API wherever applicable. This library is _(without guarantee)_ aimed at facilitating a smooth transition to Playwright once it offers official support for Angular components. It is important to take into account that this library will reach end of life when Playwright has official support for Angular component testing.\n\u003e\n\u003e To push for official support, feedback in the form of GitHub issues and or stars is appreciated!\n\n## Capabilities\n\n- Run tests fast, in parallel and optionally over multiple machines with [sharding](https://playwright.dev/docs/test-sharding) or [Azure's Testing Service](https://www.youtube.com/watch?v=FvyYC2pxL_8).\n- Run the test headless or headed accross multiple _real_ desktop and/or mobile browser engines.\n- Full support for shadow DOM, multiple origins, (i)frames, browser tabs and contexts.\n- Minimizes flakyness, due to auto waiting, web first assertions and ensures that every test runs in [full isolation](https://playwright.dev/docs/browser-contexts).\n- Advanced [emulation capabilities](https://playwright.dev/docs/emulation) such as modifying screen size, geolocation, color scheme and [the network](https://playwright.dev/docs/mock-browser-apis).\n- Interactions with the components are indistinguishable from real user behavior.\n- [Visual regression / screenshot testing](https://playwright.dev/docs/api/class-pageassertions#page-assertions-to-have-screenshot-1).\n- Zero-configuration TypeScript support.\n\nAlong with all these ✨ awesome capabilities ✨ that come with Playwright, you will also get:\n\n- [Watch mode _(BETA)_](https://github.com/microsoft/playwright/issues/21960#issuecomment-1483604692).\n- [Visual Studio Code intergration](https://playwright.dev/docs/getting-started-vscode).\n- [UI mode](https://playwright.dev/docs/test-ui-mode) for debuging tests with a time travel experience complete with watch mode.\n- [Playwright Tracing](https://playwright.dev/docs/trace-viewer-intro) for post-mortem debugging in CI.\n- [Playwright Test Code generation](https://playwright.dev/docs/codegen-intro) to record and generate tests suites.\n\n## Usage\n\nInitialize Playwright Angular component testing with PNPM, NPM or Yarn and follow the installation steps:\n\n```sh\npnpm create playwright-sand4rt --ct\n```\n```sh\nnpm init playwright-sand4rt@latest -- --ct\n```\n```sh\nyarn create playwright-sand4rt --ct\n```\n\nNow you can start creating your tests:\n\n```ts\n// button.component.ts\nimport { Component, Input } from '@angular/core';\n\n@Component({\n  standalone: true,\n  selector: 'button-component',\n  template: `\u003cbutton\u003e{{title}}\u003c/button\u003e`,\n})\nexport class ButtonComponent {\n  @Input() title!: string;\n}\n```\n\n```jsx\n// button.component.test.ts\nimport { test, expect } from '@sand4rt/experimental-ct-angular';\nimport { ButtonComponent } from './components/button.component';\n\ntest('render props', async ({ mount }) =\u003e {\n  const component = await mount(ButtonComponent, {\n    props: {\n      title: 'Submit',\n    },\n  });\n  await expect(component).toContainText('Submit');\n});\n```\n\nSee the official [playwright component testing documentation](https://playwright.dev/docs/test-components) and the [tests](https://github.com/sand4rt/playwright-ct-angular/tree/main/ct-angular/tests) for more information on how to use it.\n","funding_links":["https://github.com/sponsors/sand4rt"],"categories":["Table of contents"],"sub_categories":["Angular"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsand4rt%2Fplaywright-ct-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsand4rt%2Fplaywright-ct-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsand4rt%2Fplaywright-ct-angular/lists"}