Adds E2E UI tests for two core Phase 2 flows, building on the Playwright setup from #13578. **Agent onboarding** — validates the Agents settings page, Add Agent modal elements, form validation (name + email required, submit disabled until valid), and cancel behaviour. **Inbox creation** — walks through the full API channel inbox creation journey: channel selection → form fill → agent assignment → finish screen. ## What changed New UI component objects (`tests/playwright/components/ui/`): - `agent-page.component.ts` - `add-agent-modal.component.ts` - `add-agents-form.component.ts` - `settings-inbox-page.component.ts` - `channel-selector.component.ts` - `api-channel-form.component.ts` - `finish-setup.component.ts` New test specs (`tests/playwright/tests/e2e/ui/`): - `agent-onboarding-flow-ui-validation.spec.ts` - `inbox-creation-flow.spec.ts` Updated `components/ui/index.ts` barrel export to include all new components. ## How to test ```bash cd tests/playwright npx playwright test tests/e2e/ui/ ``` All 5 tests pass locally (3 login + 2 new flows). Closes part of the Phase 2 scope from the [Playwright E2E discussion #13500](https://github.com/orgs/chatwoot/discussions/13500). --------- Co-authored-by: Sony Mathew <sony@chatwoot.com> Co-authored-by: Sony Mathew <2040199+sony-mathew@users.noreply.github.com>
26 lines
610 B
TypeScript
26 lines
610 B
TypeScript
import { Page } from '@playwright/test';
|
|
|
|
export class ChannelSelector {
|
|
constructor(private page: Page) {}
|
|
|
|
getPageHeading() {
|
|
return this.page.getByRole('heading', { name: /choose channel/i });
|
|
}
|
|
|
|
getApiChannelCard() {
|
|
return this.page.getByRole('button', { name: /API.*Make a custom channel/i });
|
|
}
|
|
|
|
getWebsiteChannelCard() {
|
|
return this.page.getByRole('button', { name: /Website.*Create a live-chat widget/i });
|
|
}
|
|
|
|
async selectApiChannel() {
|
|
await this.getApiChannelCard().click();
|
|
}
|
|
|
|
async selectWebsiteChannel() {
|
|
await this.getWebsiteChannelCard().click();
|
|
}
|
|
}
|