write-e2e-tests

Write browser-mode end-to-end tests for BEEQ StencilJS components.

160|24|Updated Feb 22, 2023
One-click install
npx skills add https://github.com/Endava/BEEQ --skill write-e2e-tests-endava
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: write-e2e-tests
Source: https://github.com/Endava/BEEQ/tree/main/.agents/skills/write-e2e-tests
Command: npx skills add https://github.com/Endava/BEEQ --skill write-e2e-tests-endava

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you create and fix end-to-end tests for BEEQ StencilJS components with consistent structure, strong assertions, and browser-based execution.

Core Features & Use Cases

  • Baseline Coverage: Starts every component test with render and shadow-root checks so test files follow the required BEEQ pattern.
  • Interaction Testing: Covers props, slots, events, methods, keyboard behavior, state changes, accessibility attributes, and CSS custom properties.
  • Practical Use Case: Use it when a bq component is added, refactored, or failing in browser mode and you need a reliable test file aligned with existing project conventions.

Quick Start

Ask the assistant to write or update the E2E test for a specific BEEQ component using the component name or source file path.

Frequently Asked Questions about write-e2e-tests

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I write E2E tests for StencilJS web components?

To write E2E tests for StencilJS web components, generate test files covering shadow-root checks, props, slots, events, methods, keyboard behavior, accessibility, and CSS assertions using Playwright Chromium execution and Vitest.

Does Vitest work with Playwright for component-level browser testing?

Yes, Vitest works with Playwright for component-level browser testing by executing StencilJS web component tests in Chromium browser mode, validating interactions, accessibility attributes, and CSS custom properties deterministically.

What is the best way to test BEEQ component accessibility and keyboard interactions?

The best way to test BEEQ component accessibility and keyboard interactions is using this Skill to apply project-specific StencilJS test patterns, ensuring deterministic coverage for accessibility attributes and keyboard behavior in browser mode.

Can I test CSS custom properties and shadow DOM in StencilJS components?

Yes, you can test CSS custom properties and shadow DOM in StencilJS components by writing E2E tests that perform baseline shadow-root checks and CSS assertions using Vitest and Playwright Chromium execution.

Why do my StencilJS E2E tests fail when checking component slots and events?

StencilJS E2E tests may fail checking component slots and events if the test file lacks consistent structure and strong assertions; this Skill applies required BEEQ patterns to ensure reliable component coverage and deterministic results.