Automattic / Automattic/woocommerce-services

Create a "wait for selector with text" function for E2E test

Open
#2,009 0 comments 0 reactions 0 assignees View on GitHub
[Type] E2E woocommerce-services
Dominant language
JavaScript
Stars
112
Forks
31
Avg merge
3d 1h
Merged PRs (30d)
14

Description

In some of our E2E test, we use `page.waitForSelector` with a `text` option (ie. https://github.com/Automattic/woocommerce-services/blob/develop/tests/e2e-tests/specs/admin/create-shipping-label.test.js#L36). The idea is to wait for this selector and regex the `text` if there are more than one selector that matches. However, `waitForSelector` doesn't take `text` as an option https://github.com/puppeteer/puppeteer/blob/master/docs/api.md#pagewaitforselectorselector-options.

The library that takes a `text` option is https://github.com/smooth-code/jest-puppeteer/tree/master/packages/expect-puppeteer#api but none of these seem to do a `waitForSelector`.

We can do something similar to what this function does: https://github.com/Automattic/woocommerce-services/blob/e620088715377e85c77308d1877f1c066c847c47/tests/e2e-tests/specs/admin/shipping-settings.test.js#L19-L25

**Output**
- Create this function and put it inside our `utils/`
- Replace `create-shipping-label.test.js` to use this function
- Replace `shipping-settings.test.js` to use this function
- All test pass locally and on Travis

Contributor guide

Open the contributing guide

Research direction

Start by reading the existing selector-and-text logic in tests/e2e-tests/specs/admin/shipping-settings.test.js and the related usage in create-shipping-label.test.js. Add the shared function under utils/, update both E2E tests to use it, and run the E2E suite to confirm all tests pass locally and on Travis.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
testing
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.