qa-modern-web
Modern web testing: 5 skills (browser-extension-tests, pwa-install-flow-tests, service-worker-tests, sw-cache-strategy-author, web-vitals-inp-deep) and 1 agent (modern-web-health-agent). Covers PWA + Chromium MV3 extensions + INP responsiveness.
Install this plugin
/plugin install qa-modern-web@testland-qaPart of role bundle: qa-role-frontend
qa-modern-web
Modern web reality testing: PWAs, service workers, browser extensions (MV3), and the responsiveness Core Web Vital (INP, which replaced FID in March 2024). Five skills covering the platform surfaces that the bulk of e2e/UI test plugins under-cover.
Components
| Type | Name | Description |
|---|---|---|
| Skill | service-worker-tests | Playwright context.serviceWorkers() patterns; cache-strategy assertions; version-bump invalidation; SW unit tests via service-worker-mock |
| Skill | pwa-install-flow-tests | Web App Manifest validation; beforeinstallprompt capture; appinstalled event; iOS Add-to-Home-Screen path |
| Skill | web-vitals-inp-deep | INP decomposition (input delay / processing duration / presentation delay); long-task detection; CrUX field correlation |
| Skill | browser-extension-tests | Playwright fixtures for Chromium MV3 extensions; popup + content-script + background-SW + chrome.storage tests |
| Skill | sw-cache-strategy-author | Authors Workbox-style strategies (CacheFirst / NetworkFirst / StaleWhileRevalidate / NetworkOnly) AND the matching Playwright assertions |
| Agent | modern-web-health-agent | Pre-deploy readiness check composing SW lifecycle gate, manifest install-gate, and INP budget assertion into one READY/NOT READY verdict |
Install
/plugin marketplace add testland/qa
/plugin install qa-modern-web@testland-qaSkills
browser-extension-tests
Test Chromium browser extensions (MV3) with Playwright via `launchPersistentContext` + `--load-extension` / `--disable-extensions-except` flags. Cover service worker, popup pages, content scripts, message passing, and `chrome.runtime` API mocking. Service worker auto-suspends ~30s; Playwright keeps the Worker object alive across restarts. Use when a repo builds a Chromium extension (a `manifest.json` with `manifest_version: 3` and a built `dist/`) and its popup, content-script injection, background worker, or `chrome.storage` behavior needs automated coverage.
pwa-install-flow-tests
Test the Progressive Web App install flow (Web App Manifest validation, `beforeinstallprompt` event handling, installability criteria, install prompt UX). Covers desktop install badge, Android WebAPK minting, iOS Add to Home Screen, and the `appinstalled` event. Use when a site ships a `link rel="manifest"` and users must be able to install it - especially after a manifest, icon, or `start_url` edit that could silently drop install eligibility.
service-worker-tests
Test service workers with Playwright (`context.serviceWorkers()` + `waitForEvent('serviceworker')`) and unit tests via `service-worker-mock`. Covers the MV3 service-worker lifecycle (~30s suspend), cache strategies (cache-first, network-first, stale-while-revalidate), and `evaluate()` continuity across worker restart. Use when a site registers a service worker and its caching / offline behavior is uncovered, or users report stale content surviving a deploy; for the install / add-to-homescreen flow use pwa-install-flow-tests, and to design (not test) the caching policy use sw-cache-strategy-author.
sw-cache-strategy-author
Author service worker cache strategies (cache-first, network-first, stale-while-revalidate, cache-only, network-only) per Workbox conventions, plus generate the matching Playwright assertions to lock the strategy in. Avoids the common "cached forever" pitfall by enforcing TTL + version-bump invalidation. Use when a new route needs defined offline behavior, when a hand-rolled `sw.js` is being moved to Workbox strategies, or when users report seeing stale content after a deploy.
web-vitals-inp-deep
Deep INP (Interaction to Next Paint) testing: decomposes input delay, processing duration, and presentation delay via the web-vitals/attribution build, asserts per-interaction INP budgets in Playwright using PerformanceObserver plus the web-vitals visibilitychange flush, and identifies long tasks blocking the main thread. Use when a page feels unresponsive while LCP and CLS are green, or to gate key interactions (form submit, modal open, route change) under an INP budget in CI. Covers interactions only: for service-worker cache-strategy latency use service-worker-tests.