Skip to content

Commit

Permalink
docs: update docs with playwright and puppeteer drivers support.
Browse files Browse the repository at this point in the history
  • Loading branch information
asafkorem committed Jan 27, 2025
1 parent 6a3a926 commit 48e967e
Show file tree
Hide file tree
Showing 2 changed files with 64 additions and 29 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,21 @@ The **testing framework driver** is a core component of **Copilot by Detox**, en

---

## Available Framework Drivers

Copilot has several framework drivers available:

### Built into this package:
- **Puppeteer Driver**: A complete implementation for web testing using Puppeteer
- **Playwright Driver**: A modern web testing implementation using Playwright

### Available in other packages:
- **Detox Driver**: Mobile app testing implementation (available in the [Detox repository](https://github.com/wix/Detox/tree/master/detox/src/copilot))

You can use these implementations as references when creating your own custom driver.

---

## Recommended Approach for Framework Support

Where possible, framework support should ideally be provided directly from the framework's codebase. For example, Detox includes support within its own repository: [Detox Copilot Driver](https://github.com/wix/Detox/tree/master/detox/src/copilot).
Expand Down Expand Up @@ -40,7 +55,7 @@ All drivers must implement the `TestingFrameworkDriver` interface. Key methods i
Returns the view hierarchy of the current screen as a string.

- `apiCatalog: TestingFrameworkAPICatalog`\
Categorizes the frameworks actions, matchers, and utilities.
Categorizes the framework's actions, matchers, and utilities.

For detailed documentation, see the [Framework Driver API](../API/framework-driver.md).

Expand All @@ -52,7 +67,7 @@ For detailed documentation, see the [Framework Driver API](../API/framework-driv

### 3. **Define the API Catalog**

The `apiCatalog` organizes the frameworks capabilities into categories:
The `apiCatalog` organizes the framework's capabilities into categories:

- **Actions**: e.g., `tap`, `longPress`, `scroll`.
- **Matchers**: e.g., `by.id`, `by.text`.
Expand Down
74 changes: 47 additions & 27 deletions website/docs/pages/supported-frameworks.md
Original file line number Diff line number Diff line change
@@ -1,47 +1,67 @@
# Supported Frameworks for Copilot

**Copilot by Detox** is designed to empower developers by simplifying the way they write tests for their applications. Originally developed as a feature for Detox, Copilot has grown into a **framework-agnostic tool**, making it adaptable to a wide range of testing frameworks with minimal customization.
**Copilot by Detox** enables natural language testing across different testing frameworks. Here's how to use it with our supported frameworks:

---
## Built-in Web Testing Support

## Detox Integration: Mobile Apps Testing
### Playwright

Detox, a powerful end-to-end testing framework for mobile apps, is the first framework to provide Copilot as part of its API. Copilot’s integration with Detox offers developers:

- **Natural language testing**: Write tests in plain, intuitive language instead of manual test scripting.
- **Enhanced usability with Detox APIs**: Leverage Detox’s robust matchers and actions, such as `by.id()`, `tap()`, and `longPress()`, for seamless app interaction.
- **Improved debugging tools**: Use snapshots, including screenshots and view hierarchies, to better analyze the app’s state during testing.
```js
// 1. Install: npm install --save-dev playwright
// 2. Import and use:
import { PlaywrightFrameworkDriver } from 'detox-copilot';

**To learn more, visit the ********[official documentation](https://wix.github.io/Detox/docs/copilot/testing-with-copilot)********.**
it('should login', async () => {
await copilot.perform(
'Open "https://example.com" in the browser',
'Fill in the username field with "testuser"',
'Fill in the password field with "password123"',
'Click the login button',
'Verify that the dashboard is visible'
);
});
```

### Example: Writing Tests with Copilot in Detox
Supports Chrome, Firefox, and WebKit with powerful auto-waiting mechanisms.

Here is an example test written in natural language that demonstrates step-by-step execution:
### Puppeteer

```js
it('should verify element sizes and button states', async () => {
// 1. Install: npm install --save-dev puppeteer
// 2. Import and use:
import { PuppeteerFrameworkDriver } from 'detox-copilot';

it('should submit a form', async () => {
await copilot.perform(
'Launch the app with notification permissions enabled',
'Navigate to the "Settings" page',
'Verify that the "Save" button is disabled',
'Locate the profile picture element',
'Verify that the profile picture size is 100 x 100 pixels and that the image is available and rendered',
'Tap on the "Edit Profile" button',
'Verify that the "Save" button is now enabled',
'Verify that the "Username" field text is bold'
'Open "https://example.com/signup" in the browser',
'Fill in the email field with "user@example.com"',
'Check the terms checkbox',
'Click submit',
'Verify success message appears'
);
});
```

---
Specialized for Chrome/Chromium automation with DevTools Protocol access.

## Expanding Copilot’s Reach: Call for Contributions
## External Framework Support

**Copilot by Detox** is built with a flexible, framework-agnostic design, enabling integration with various testing frameworks. Currently, Detox is the only framework providing the API and necessary framework driver for Copilot. However, we believe the potential for Copilot extends far beyond Detox.
### Detox

We invite the community to contribute by:
Available directly in the Detox package for mobile app testing. [See Detox documentation](https://wix.github.io/Detox/docs/copilot/testing-with-copilot).

```js
it('should update profile', async () => {
await copilot.perform(
'Launch the app',
'Navigate to Settings',
'Tap on "Edit Profile"',
'Update username to "john_doe"',
'Verify changes are saved'
);
});
```

- **Integrating new frameworks**: Extend Copilot’s compatibility to other testing frameworks by [developing the necessary drivers and APIs](https://github.com/wix-incubator/detox-copilot/issues).
- **Enhancing existing integrations**: Refine and optimize Copilot’s functionality within Detox or other supported frameworks.
## Contributing

Your contributions can help shape Copilot into a universal testing tool for developers worldwide. To get involved or learn more about potential integrations, visit our [GitHub repository](https://github.com/wix-incubator/detox-copilot/issues).
Want to add support for another framework? Check our [GitHub Issues](https://github.com/wix-incubator/detox-copilot/issues) or submit a PR.

0 comments on commit 48e967e

Please sign in to comment.