Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
77 changes: 0 additions & 77 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -84,14 +84,6 @@ workflows:
branches:
only:
- master
- e2e tests ie11:
context: fx-libraries
requires:
- examples
filters:
branches:
only:
- master
- e2e tests router nextjs:
context: fx-libraries
requires:
Expand Down Expand Up @@ -150,10 +142,6 @@ workflows:
context: fx-libraries
requires:
- examples
- e2e tests ie11:
context: fx-libraries
requires:
- examples
- e2e tests router nextjs:
context: fx-libraries
requires:
Expand Down Expand Up @@ -399,71 +387,6 @@ jobs:
]
}

e2e tests ie11:
<<: *defaults
resource_class: large
steps:
- checkout
- *attach_workspace
- *install_yarn_version
- *restore_yarn_cache
- *run_yarn_install
- run:
name: End-to-end tests (IE11)
command: yarn run test:e2e:ie11
- store_test_results:
path: tests/e2e/junit/wdio/
- slack/notify:
channel: $SLACK_E2E_NOTIF_CHANNEL
event: fail
custom: |
{
"blocks": [
{
"type": "header",
"text": {
"type": "plain_text",
"text": ":warning: End-to-end tests failed",
"emoji": true
}
},
{
"type": "section",
"fields": [
{
"type": "mrkdwn",
"text": "*Project*: $CIRCLE_PROJECT_REPONAME"
},
{
"type": "mrkdwn",
"text": "*Browser*: Internet Explorer 11"
}
]
},
{
"type": "actions",
"elements": [
{
"type": "button",
"text": {
"type": "plain_text",
"text": "CircleCI"
},
"url": "$CIRCLE_BUILD_URL"
},
{
"type": "button",
"text": {
"type": "plain_text",
"text": "SauceLabs"
},
"url": "https://app.saucelabs.com/dashboard/tests/vdc"
}
]
}
]
}

e2e tests router nextjs:
<<: *defaults
resource_class: large
Expand Down
49 changes: 1 addition & 48 deletions .claude/rules/e2e.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@
| Location | Framework | Purpose |
|----------|-----------|---------|
| `tests/e2e/playwright/` | Playwright | Main e2e suite for all InstantSearch flavors |
| `tests/e2e/` (wdio files) | WebdriverIO | IE11 tests only (via Sauce Labs) |
| `packages/react-instantsearch-nextjs/__tests__/e2e/` | Playwright | App Router Next.js e2e tests |
| `packages/react-instantsearch-router-nextjs/__tests__/e2e/` | Playwright | Pages Router Next.js e2e tests |

Expand Down Expand Up @@ -49,16 +48,6 @@ yarn workspace react-instantsearch-nextjs test:e2e --reporter=list
yarn workspace react-instantsearch-router-nextjs test:e2e --reporter=list
```

### IE11 Tests (Requires Sauce Labs credentials)

```bash
# Set environment variables first
export SAUCE_USERNAME=your_username
export SAUCE_ACCESS_KEY=your_access_key

yarn test:e2e:ie11
```

## Writing Playwright Tests

### Test Structure
Expand Down Expand Up @@ -160,13 +149,6 @@ To run a single flavor:
E2E_FLAVOR=react yarn test:e2e
```

## IE11 Considerations

IE11 tests are kept in WebdriverIO because Playwright doesn't support IE11. These tests:
- Only run `js` and `js-umd` flavors
- Require Sauce Labs for remote IE11 browser
- Use the same test specs in `tests/e2e/specs/` and helpers in `tests/e2e/helpers/`

## Debugging

### Playwright
Expand Down Expand Up @@ -241,35 +223,7 @@ The fixtures account for this with combined selectors like:

If you add new selectors, ensure they work across all flavors.

## Migration Notes: WebDriverIO to Playwright

When migrating tests from WebDriverIO to Playwright, be aware of these differences:

### URL Waiting

- **WebDriverIO**: Used custom `waitForUrl()` that polls `browser.getUrl()` until match
- **Playwright**: Use `await expect(page).toHaveURL(url)` which has built-in retrying

### Element Selection

- **WebDriverIO**: `$('.ais-Hits-item')` returns first match, clicking works on container elements
- **Playwright**: `page.locator('.ais-Hits-item').first()` - clicking on container may not hit child link elements. Use `.locator('a')` to target links explicitly:
```typescript
// WebDriverIO
const link = await $('.ais-Hits-item');
await link.click();

// Playwright - click the link inside the hit
const link = page.locator('.ais-Hits-item a').first();
await link.click();
```

### Browser Back Navigation

- **WebDriverIO**: `browser.back()` worked reliably for SPA navigation
- **Playwright**: `page.goBack()` works but may require `slowMo` in headless mode for Next.js App Router dynamic routes

### Headless Mode Timing Issues
## Headless Mode Timing Issues

Playwright's headless mode runs faster than headed mode, which can cause timing issues with SPA navigation and state updates. For Next.js App Router tests involving browser back/forward navigation with dynamic routes, add `slowMo` at the test file level (not globally, to avoid slowing down all tests):

Expand All @@ -290,7 +244,6 @@ This gives the browser enough time to process JavaScript events like popstate ha

Tests run in CircleCI:
- **e2e tests playwright** - Main suite with Chromium + Firefox
- **e2e tests ie11** - IE11 via Sauce Labs
- **e2e tests router nextjs** - Pages Router Next.js tests
- **e2e tests app router nextjs** - App Router Next.js tests

Expand Down
26 changes: 1 addition & 25 deletions .oxlintrc.json
Original file line number Diff line number Diff line change
Expand Up @@ -321,31 +321,7 @@
"jest/no-export": "off",
"jest/unbound-method": "off",
"react-hooks/exhaustive-deps": "off",
"react-hooks/rules-of-hooks": "off",
"no-unused-vars": [
"error",
{
"argsIgnorePattern": "^_",
"caughtErrors": "none",
"ignoreRestSiblings": true,
"varsIgnorePattern": "WebdriverIOAsync"
}
]
}
},
{
"env": {
"jasmine": true
},
"files": [
"tests/e2e/all-flavors.spec.ts",
"tests/e2e/helpers/**/*.ts",
"tests/e2e/specs/**/*.spec.ts",
"tests/e2e/wdio.*.conf.js"
],
"rules": {
"@typescript-eslint/no-namespace": "off",
"jest/no-export": "off"
"react-hooks/rules-of-hooks": "off"
}
},
{
Expand Down
13 changes: 6 additions & 7 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -355,22 +355,21 @@ To run the test continuously based on what you changed (useful when developing o
yarn test --watch
```

End-to-end tests are defined in [tests/e2e](./tests/e2e/README.md).
End-to-end tests use [Playwright](https://playwright.dev) and are defined in [tests/e2e](./tests/e2e/README.md).

To run them locally:
Build the examples first, then run them locally:

```sh
yarn test:e2e:local
yarn website:examples
yarn test:e2e
```

To run them on Sauce Labs:
Scope to a single flavor and/or browser for faster local iteration:

```sh
yarn test:e2e:saucelabs
E2E_FLAVOR=react E2E_BROWSER=chromium yarn test:e2e
```

> **Note** Make sure to set up Sauce Labs credentials with the `SAUCE_USERNAME` and `SAUCE_ACCESS_KEY` environment variables.

For more info, including how to write end-to-end tests, check the `tests/e2e` [CONTRIBUTING](./tests/e2e/CONTRIBUTING.md) and [README](./tests/e2e/README.md) files.

### Type checks
Expand Down
9 changes: 5 additions & 4 deletions babel.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,11 @@ module.exports = (api) => {
isStorybook
? {
modules: false,
// Ensure optional chaining/nullish coalescing are transformed
targets: {
ie: 11,
},
// Storybook 5 runs on webpack 4, whose parser can't handle modern
// syntax (optional chaining, nullish coalescing). With no browser
// targets, preset-env down-levels everything so webpack 4 can parse
// it — including workspace deps built by SWC (see the storybook
// webpack.config.js babel-loader rules).
}
: {
modules: 'commonjs',
Expand Down
1 change: 0 additions & 1 deletion examples/js/e-commerce-umd/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,6 @@
<link rel="stylesheet" href="./src/app.css" />
<link rel="stylesheet" href="./src/app.mobile.css" />
<link rel="stylesheet" href="./src/widgets/PriceSlider.css" />
<script src="./polyfills.js"></script>
<title>E-commerce demo (UMD) | Algolia</title>
</head>

Expand Down
Loading
Loading