Merge 02f2955c09 into a50d82df1c

.github/workflows/bundle-latest.yaml

@@ -10,7 +10,6 @@ permissions:
 
 jobs:
   bundle-and-publish:
-    if: ${{ false }} # Temporarily disabled while web bundles are paused.
     runs-on: ubuntu-latest
     steps:
       - name: Checkout BMAD-METHOD

.gitignore

@@ -48,7 +48,6 @@ CLAUDE.local.md
 
 # Bundler temporary files and generated bundles
 .bundler-temp/
-web-bundles/
 
 # Generated web bundles (built by CI, not committed)
 src/modules/bmm/sub-modules/

docs/tutorials/getting-started/tea-lite-quickstart.md

@@ -1,9 +1,11 @@
 ---
-title: "Getting Started with Test Architect"
+title: "Getting Started with TEA (Test Architect) - TEA Lite"
-description: Learn Test Architect fundamentals by generating and running tests for an existing demo app in 30 minutes
+description: Learn TEA fundamentals by generating and running tests for an existing demo app in 30 minutes
 ---
 
-Welcome! **Test Architect (TEA) Lite** is the simplest way to get started with TEA - just use `*automate` to generate tests for existing features. Perfect for beginners who want to learn TEA fundamentals quickly.
+# Getting Started with TEA (Test Architect) - TEA Lite
+
+Welcome! **TEA Lite** is the simplest way to get started with TEA - just use `*automate` to generate tests for existing features. Perfect for beginners who want to learn TEA fundamentals quickly.
 
 ## What You'll Build
 
@@ -12,17 +14,11 @@ By the end of this 30-minute tutorial, you'll have:
 - Your first risk-based test plan
 - Passing tests for an existing demo app feature
 
-:::note[Prerequisites]
+## Prerequisites
+
 - Node.js installed (v18 or later)
 - 30 minutes of focused time
-
 - We'll use TodoMVC (<https://todomvc.com/examples/react/dist/>) as our demo app
-:::
-
-:::tip[Quick Path]
-Load TEA (`*tea`) → scaffold framework (`*framework`) → create test plan (`*test-design`) → generate tests (`*automate`) → run with `npx playwright test`.
-:::
-
 
 ## TEA Approaches Explained
 
@@ -34,6 +30,8 @@ Before we start, understand the three ways to use TEA:
 
 This tutorial focuses on **TEA Lite** - the fastest way to see TEA in action.
 
+---
+
 ## Step 0: Setup (2 minutes)
 
 We'll test TodoMVC, a standard demo app used across testing documentation.
@@ -47,6 +45,8 @@ No installation needed - TodoMVC runs in your browser. Open the link above and:
 
 You've just explored the features we'll test!
 
+---
+
 ## Step 1: Install BMad and Scaffold Framework (10 minutes)
 
 ### Install BMad Method
@@ -60,7 +60,7 @@ When prompted:
 - **Planning artifacts folder:** Keep default
 - **Implementation artifacts folder:** Keep default
 - **Project knowledge folder:** Keep default
-- **Enable TEA Playwright Model Context Protocol (MCP) enhancements?** Choose "No" for now (we'll explore this later)
+- **Enable TEA Playwright MCP enhancements?** Choose "No" for now (we'll explore this later)
 - **Using playwright-utils?** Choose "No" for now (we'll explore this later)
 
 BMad is now installed! You'll see a `_bmad/` folder in your project.
@@ -92,9 +92,9 @@ A: "We're testing a React web application (TodoMVC)"
 A: "Playwright"
 
 **Q: Testing scope?**
-A: "End-to-end (E2E) testing for a web application"
+A: "E2E testing for web application"
 
-**Q: Continuous integration/continuous deployment (CI/CD) platform?**
+**Q: CI/CD platform?**
 A: "GitHub Actions" (or your preference)
 
 TEA will generate:
@@ -113,6 +113,8 @@ npx playwright install
 
 You now have a production-ready test framework!
 
+---
+
 ## Step 2: Your First Test Design (5 minutes)
 
 Test design is where TEA shines - risk-based planning before writing tests.
@@ -129,7 +131,7 @@ In your chat with TEA, run:
 A: "Epic-level - I want to test TodoMVC's basic functionality"
 
 **Q: What feature are you testing?**
-A: "TodoMVC's core operations - creating, completing, and deleting todos"
+A: "TodoMVC's core CRUD operations - creating, completing, and deleting todos"
 
 **Q: Any specific risks or concerns?**
 A: "We want to ensure the filter buttons (All, Active, Completed) work correctly"
@@ -154,6 +156,8 @@ TEA will analyze and create `test-design-epic-1.md` with:
 
 **Review the test design file** - notice how TEA provides a systematic approach to what needs testing and why.
 
+---
+
 ## Step 3: Generate Tests for Existing Features (5 minutes)
 
 Now the magic happens - TEA generates tests based on your test design.
@@ -284,6 +288,8 @@ test('should mark todo as complete', async ({ page, apiRequest }) => {
 
 See [Integrate Playwright Utils](/docs/how-to/customization/integrate-playwright-utils.md) to enable this.
 
+---
+
 ## Step 4: Run and Validate (5 minutes)
 
 Time to see your tests in action!
@@ -328,18 +334,16 @@ You used **TEA Lite** to:
 
 All in 30 minutes!
 
+---
+
 ## What You Learned
 
 Congratulations! You've completed the TEA Lite tutorial. You learned:
 
-### Quick Reference
+### TEA Workflows
-
+- `*framework` - Scaffold test infrastructure
-| Command        | Purpose                              |
+- `*test-design` - Risk-based test planning
-| -------------- | ------------------------------------ |
+- `*automate` - Generate tests for existing features
-| `*tea`         | Load the TEA agent                   |
-| `*framework`   | Scaffold test infrastructure         |
-| `*test-design` | Risk-based test planning             |
-| `*automate`    | Generate tests for existing features |
 
 ### TEA Principles
 - **Risk-based testing** - Depth scales with impact (P0 vs P3)
@@ -347,9 +351,15 @@ Congratulations! You've completed the TEA Lite tutorial. You learned:
 - **Network-first patterns** - Tests wait for actual responses (no hard waits)
 - **Production-ready from day one** - Not toy examples
 
-:::tip[Key Takeaway]
+### Key Takeaway
-TEA Lite (just `*automate`) is perfect for beginners learning TEA fundamentals, testing existing applications, quick test coverage expansion, and teams wanting fast results.
+
-:::
+TEA Lite (just `*automate`) is perfect for:
+- Beginners learning TEA fundamentals
+- Testing existing applications
+- Quick test coverage expansion
+- Teams wanting fast results
+
+---
 
 ## Understanding ATDD vs Automate
 
@@ -360,12 +370,14 @@ This tutorial used `*automate` to generate tests for **existing features** (test
 - Want to add test coverage
 - Tests should pass on first run
 
-**When to use `*atdd` (Acceptance Test-Driven Development):**
+**When to use `*atdd`:**
-- Feature doesn't exist yet (Test-Driven Development workflow)
+- Feature doesn't exist yet (TDD workflow)
 - Want failing tests BEFORE implementation
 - Following red → green → refactor cycle
 
-See [How to Run ATDD](/docs/how-to/workflows/run-atdd.md) for the test-drive development (TDD) approach.
+See [How to Run ATDD](/docs/how-to/workflows/run-atdd.md) for the TDD approach.
+
+---
 
 ## Next Steps
 
@@ -399,22 +411,21 @@ See [TEA Overview](/docs/explanation/features/tea-overview.md) for engagement mo
 ### Go Full TEA Integrated
 
 Want the complete quality operating model? Try TEA Integrated with BMad Method:
-- Phase 2: Planning with non-functional requirements (NFR) assessment
+- Phase 2: Planning with NFR assessment
 - Phase 3: Architecture testability review
 - Phase 4: Per-epic test design → ATDD → automate
 - Release Gate: Coverage traceability and gate decisions
 
 See [BMad Method Documentation](/) for the full workflow.
 
-## Common Questions
+---
 
-- [Why can't my tests find elements?](#why-cant-my-tests-find-elements)
+## Troubleshooting
-- [How do I fix network timeouts?](#how-do-i-fix-network-timeouts)
 
-### Why can't my tests find elements?
+### Tests Failing?
-
-TodoMVC doesn't use test IDs or accessible roles consistently. The selectors in this tutorial use CSS classes that match TodoMVC's actual structure:
 
+**Problem:** Tests can't find elements
+**Solution:** TodoMVC doesn't use test IDs or accessible roles consistently. The selectors in this tutorial use CSS classes that match TodoMVC's actual structure:
 ```typescript
 // TodoMVC uses these CSS classes:
 page.locator('.new-todo')      // Input field
@@ -427,20 +438,26 @@ page.getByRole('listitem')
 page.getByRole('checkbox')
 ```
 
-In production code, use accessible selectors (`getByRole`, `getByLabel`, `getByText`) for better resilience. TodoMVC is used here for learning, not as a selector best practice example.
+**Note:** In production code, use accessible selectors (`getByRole`, `getByLabel`, `getByText`) for better resilience. TodoMVC is used here for learning, not as a selector best practice example.
-
-### How do I fix network timeouts?
-
-Increase timeout in `playwright.config.ts`:
 
+**Problem:** Network timeout
+**Solution:** Increase timeout in `playwright.config.ts`:
 ```typescript
 use: {
   timeout: 30000, // 30 seconds
 }
 ```
 
-## Getting Help
+### Need Help?
 
 - **Documentation:** <https://docs.bmad-method.org>
 - **GitHub Issues:** <https://github.com/bmad-code-org/bmad-method/issues>
 - **Discord:** Join the BMAD community
+
+---
+
+## Feedback
+
+Found this tutorial helpful? Have suggestions? Open an issue on GitHub!
+
+Generated with [BMad Method](https://bmad-method.org) - TEA (Test Architect)