> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bugster.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Integrate with Claude Code

> Configure Claude Code to be your Bugster test generation assistant

Transform Claude Code into a Bugster expert that can generate and maintain comprehensive test specifications directly in your editor.

## Three Claude Code Use Cases for Bugster

Bugster provides specialized Claude Code integrations to enhance your development workflow:

<CardGroup cols={3}>
  <Card title="Browser Testing Skill" icon="browser" href="#browser-testing-skill">
    **Plugin installation** - Enable Claude Code to interface with a browser for interactive testing and debugging.
  </Card>

  <Card title="Test Generation" icon="file-lines" href="#test-generation-rule">
    **Manual activation** - Generate comprehensive test specifications following Bugster's YAML structure and best practices.
  </Card>

  <Card title="Test Update" icon="arrows-rotate" href="#test-update-rule">
    **Manual activation** - Update existing test specifications based on code changes and new requirements.
  </Card>
</CardGroup>

| Integration               | When to Use                 | Activation                   | Purpose                                  |
| :------------------------ | :-------------------------- | :--------------------------- | :--------------------------------------- |
| **Browser Testing Skill** | Interactive browser testing | Plugin installation          | Interface with browser for live testing  |
| **Test Generation**       | Building test suites        | Manual (`@BUGSTER_GENERATE`) | Create comprehensive test specifications |
| **Test Update**           | Maintaining tests           | Manual (`@BUGSTER_UPDATE`)   | Update existing tests after code changes |

## Browser Testing Skill

Enable Claude Code to seamlessly interface with a browser using Bugster's AI browser testing framework. This skill allows Claude Code to perform interactive browser testing directly from the editor.

### Installation

<Steps>
  <Step title="Add marketplace">
    Run the following command in Claude Code:

    ```bash theme={null}
    /plugin marketplace add Bugsterapp/agent-test
    ```
  </Step>

  <Step title="Install the plugin">
    Then install the browser testing plugin:

    ```bash theme={null}
    /plugin install browser-testing@browser-testing-tools
    ```
  </Step>

  <Step title="Restart Claude Code">
    Restart Claude Code for the changes to take effect.
  </Step>
</Steps>

### Manual Installation

If you prefer using the interactive interface:

<Steps>
  <Step title="Open plugin menu">
    Type `/plugin` in Claude Code
  </Step>

  <Step title="Add marketplace">
    Select option **3. Add marketplace**
  </Step>

  <Step title="Enter marketplace source">
    Enter the marketplace source:

    ```text theme={null}
    https://github.com/Bugsterapp/agent-test.git
    ```
  </Step>

  <Step title="Select and install">
    * Press enter to select the `browser-testing` plugin
    * Hit enter again to select **Install now**
  </Step>

  <Step title="Restart">
    Restart Claude Code for changes to take effect
  </Step>
</Steps>

### What It Does

The Browser Testing Skill enables Claude Code to:

* Launch and control browser instances directly from the editor
* Perform interactive testing and debugging
* Execute browser automation tasks
* Test web applications in real-time

<Tip>
  Use this skill when you need Claude Code to interact with your web application during development, testing, or debugging sessions.
</Tip>

<Info>
  View the official plugin: [Bugster Browser Testing Skill](https://github.com/Bugsterapp/agent-test)
</Info>

## Test Generation Rule

This rule provides Claude Code with context to properly generate Bugster test specifications following the required YAML structure and best practices.

### Installation

Install the official test generation rule using the Bugster CLI:

```bash theme={null}
bugster plugin --agent claude
```

This installs `BUGSTER_GENERATE.md` in your `.claude/rules/` directory.

<Info>
  View the official rule: [Claude Code Test Generation Rule](https://github.com/Bugsterapp/bugster-cli/tree/main/plugins/claude)
</Info>

### How to Use

Reference the rule in your Claude Code chat to activate it:

<CodeGroup>
  ```text Basic Usage theme={null}
  @BUGSTER_GENERATE Create a test for the user login page
  ```

  ```text Specific Feature theme={null}
  @BUGSTER_GENERATE Generate tests for the shopping cart checkout flow
  ```

  ```text Multiple Tests theme={null}
  @BUGSTER_GENERATE Create 3 tests for the dashboard analytics page
  ```
</CodeGroup>

### What It Does

* Generates comprehensive test specifications in proper YAML format
* Follows Bugster naming conventions and file structure
* Creates tests in `.bugster/tests/` with correct hierarchy
* Validates all required fields are present
* Limits generation to avoid test duplication

<Tip>
  The rule automatically checks existing tests to avoid duplicates and follows your project's file structure conventions.
</Tip>

## Test Update Rule

This rule helps you update existing test specifications when your code changes or requirements evolve.

### Installation

Install the official test update rule using the Bugster CLI:

```bash theme={null}
bugster plugin --agent claude
```

This installs `BUGSTER_UPDATE.md` in your `.claude/rules/` directory.

<Info>
  View the official rule: [Claude Code Test Update Rule](https://github.com/Bugsterapp/bugster-cli/tree/main/plugins/claude)
</Info>

### How to Use

Reference the rule in your Claude Code chat to activate it:

<CodeGroup>
  ```text Update After Changes theme={null}
  @BUGSTER_UPDATE Update tests for the authentication flow based on recent changes
  ```

  ```text Specific File theme={null}
  @BUGSTER_UPDATE Refresh tests for app/checkout/page.tsx to match new UI
  ```

  ```text Bulk Update theme={null}
  @BUGSTER_UPDATE Update all dashboard tests to reflect new navigation structure
  ```
</CodeGroup>

### What It Does

* Updates existing test specifications to match code changes
* Maintains test structure while adapting to new requirements
* Preserves test intent while updating implementation details
* Ensures tests stay synchronized with your codebase
* Follows the same YAML standards as test generation

<Tip>
  Use this rule after refactoring components or updating user flows to keep your test suite current without starting from scratch.
</Tip>

## Combining Test Generation and Update Rules

For optimal workflow, use both rules together:

<Steps>
  <Step title="Setup">
    Install the official rules using the Bugster CLI:

    ```bash theme={null}
    bugster plugin --agent claude
    ```

    This installs both `BUGSTER_GENERATE.md` and `BUGSTER_UPDATE.md` in your `.claude/rules/` directory.
  </Step>

  <Step title="Development Flow">
    1. Use **Test Generation rule** to create comprehensive test suites for new features
    2. Use **Test Update rule** when refactoring or updating existing features
    3. Reference the rules with `@BUGSTER_GENERATE` or `@BUGSTER_UPDATE` in your Claude Code chat
  </Step>

  <Step title="Team Consistency">
    Both rules ensure team members follow the same Bugster standards and test quality across your project.
  </Step>
</Steps>

<Tip>
  The plugin command installs both generation and update rules automatically, making it easy to maintain consistent test coverage as your codebase evolves.
</Tip>