arisng Blazor Interactive SSR Ad-Hoc Testing
Extends the playwright-cli skill for exploratory, in-development testing of Blazor apps running in interactive server render mode (interactive SSR) with SignalR. Focus is on quick, manual validation — not CI/CD automation.
Scope
Covers: ad-hoc E2E workflows, component interaction, SignalR-driven UI updates, form/validation testing, basic visual and performance checks.
Does not cover: automated test suites (use Playwright Test Framework), unit/component testing (xUnit/bUnit), load/security/accessibility testing, or production E2E.
Key Considerations for Blazor Server Mode
- SignalR: Always wait for the WebSocket connection before testing interactions. Check
window.Blazor._internal.dotNetObject !== undefined. - Async rendering: Elements update asynchronously; use
evalto assert DOM state after actions rather than relying on timing. - Component lifecycle: Test mounting, updates, and disposal; watch for circuit disconnection errors.
- Console monitoring: Use
playwright-cli consoleto catch Blazor-specific errors (circuit disconnections, rendering exceptions).
Testing Strategies
Seven strategies cover the common Blazor ad-hoc testing scenarios. Detailed workflows with bash examples are in references/strategies.md.
| # | Strategy | When to use |
|---|---|---|
| 1 | Connection and Initial Load | Verify SignalR connects and components render |
| 2 | Component Interaction and State | Test clicks, server state changes, and UI updates |
| 3 | Real-Time Data Sync | Validate SignalR-pushed data updates in UI |
| 4 | Form Submission and Validation | Test form fill, submit, success/error handling |
| 5 | Error Scenarios and Recovery | Test circuit disconnection and reconnection |
| 6 | Visual Regression Verification | Snapshot/DOM checks for unintended visual changes |
| 7 | Basic Performance Assessment | Tracing and responsiveness checks |
Read references/strategies.md for the workflow commands for any strategy above.
Quick Examples
# Verify Blazor and SignalR loaded
playwright-cli open https://localhost:5001
playwright-cli eval "window.Blazor !== undefined"
playwright-cli network
# Click + assert state change
playwright-cli click e5
playwright-cli eval "document.querySelector('.counter-value').textContent.includes('1')"
playwright-cli snapshot
# Form fill and submit
playwright-cli fill e2 "user@example.com"
playwright-cli click e3
playwright-cli eval "document.querySelector('.success-message') !== null"
Best Practices
- Read references/strategies.md before starting — pick the strategy that matches your goal.
- Use
evalassertions immediately after interactions to avoid race conditions with SignalR updates. - Always run
playwright-cli consoleandplaywright-cli networkwhen debugging connection issues. - For repeated validations (>3 runs), convert to a proper Playwright test script.
- Reference the
playwright-cliskill for the full command reference and session management.