@vardot/varbase-e2e 2.0.0

package/docs/steps/iframe.md

@@ -0,0 +1,248 @@
+# Iframes steps
+
+10 steps, defined in `tests/step-definitions/iframe.steps.js`.
+
+Cucumber-js loads every `*.steps.js` in that directory automatically — you never `require()` a step file from a feature.
+
+| # | Step |
+| --- | --- |
+| 1 | `When I switch to iframe "iframe.payment"` |
+| 2 | `When I switch to iframe with locator "iframe.payment"` |
+| 3 | `When I switch to the root document` |
+| 4 | `When I switch to the iframe with title "Payment"` |
+| 5 | `When I switch to the iframe with name "payment"` |
+| 6 | `When I click "Confirm" inside the iframe` |
+| 7 | `When I click "submit-btn" by attr inside the iframe` |
+| 8 | `When I fill in "card_number" with "4242 4242 4242 4242" inside the iframe` |
+| 9 | `Then I should see "Payment received" inside the iframe` |
+| 10 | `Then I should not see "Error" inside the iframe` |
+
+---
+
+## 1. When I switch to iframe "iframe.payment"
+
+Switch the active scope to an iframe addressed by CSS selector.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*switch to (the )?iframe "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I switch to iframe "iframe.payment"
+When I switch to the iframe "#stripe-frame"
+And we switch to iframe "iframe[name=widget]"
+When I switch to iframe ".captcha-frame"
+When I switch to the iframe "iframe[src*=embed]"
+```
+
+## 2. When I switch to iframe with locator "iframe.payment"
+
+Switch the active scope to an iframe by Playwright frame-locator string.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*switch to iframe with locator "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I switch to iframe with locator "iframe.payment"
+When I switch to iframe with locator "#stripe-frame"
+And I switch to iframe with locator "iframe[name=widget]"
+When I switch to iframe with locator ".captcha-frame"
+When I switch to iframe with locator "iframe[src*=embed]"
+```
+
+## 3. When I switch to the root document
+
+Return the active scope to the top document (clear the iframe scope).
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*switch to the root document$/
+```
+
+**Examples**
+
+```gherkin
+When I switch to the root document
+When I switch to iframe ".captcha"
+  And I click "I am not a robot" inside the iframe
+  And I switch to the root document
+And we switch to the root document
+When I switch to iframe "#payment"
+  And I press "Pay"
+  And I switch to the root document
+  Then I should see "Payment received"
+When I switch to the root document
+  And I press "Refresh"
+```
+
+## 4. When I switch to the iframe with title "Payment"
+
+Switch the active scope to an iframe by its `title` attribute.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*switch to the iframe with title "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I switch to the iframe with title "Payment"
+When I switch to the iframe with title "Captcha"
+And we switch to the iframe with title "Widget"
+When I switch to the iframe with title "Embedded video"
+When I switch to the iframe with title "Stripe checkout"
+```
+
+## 5. When I switch to the iframe with name "payment"
+
+Switch the active scope to an iframe by its `name` attribute.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*switch to the iframe with name "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I switch to the iframe with name "payment"
+When I switch to the iframe with name "captcha"
+And we switch to the iframe with name "widget"
+When I switch to the iframe with name "embed"
+When I switch to the iframe with name "stripe"
+```
+
+## 6. When I click "Confirm" inside the iframe
+
+Click visible text inside the active iframe.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*click "([^"]*)" inside the iframe$/
+```
+
+**Examples**
+
+```gherkin
+When I click "Confirm" inside the iframe
+When I click "Cancel" inside the iframe
+And we click "Continue" inside the iframe
+When I click "OK" inside the iframe
+When I click "Close" inside the iframe
+```
+
+## 7. When I click "submit-btn" by attr inside the iframe
+
+Click an attribute-addressed element inside the active iframe.
+
+Tries id, class, name, and data-testid in that order.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*click "([^"]*)" by attr inside the iframe$/
+```
+
+**Examples**
+
+```gherkin
+When I click "submit-btn" by attr inside the iframe
+When I click "cancel" by attr inside the iframe
+And we click "continue" by attr inside the iframe
+When I click "close" by attr inside the iframe
+When I click "primary-cta" by attr inside the iframe
+```
+
+## 8. When I fill in "card_number" with "4242 4242 4242 4242" inside the iframe
+
+Fill a field inside the active iframe by `[name]` or id.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*fill in "([^"]*)" with "([^"]*)" inside the iframe$/
+```
+
+**Examples**
+
+```gherkin
+When I fill in "card_number" with "4242 4242 4242 4242" inside the iframe
+When I fill in "cvv" with "123" inside the iframe
+And we fill in "exp_date" with "12/30" inside the iframe
+When I fill in "email" with "alice@example.com" inside the iframe
+When I fill in "name" with "Alice" inside the iframe
+```
+
+## 9. Then I should see "Payment received" inside the iframe
+
+Assert visible text exists inside the active iframe.
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^I should see "([^"]*)" inside the iframe$/
+```
+
+**Examples**
+
+```gherkin
+Then I should see "Payment received" inside the iframe
+Then I should see "Welcome" inside the iframe
+And I should see "Confirmed" inside the iframe
+Then I should see "Email verified" inside the iframe
+Then I should see "Subscribed" inside the iframe
+```
+
+## 10. Then I should not see "Error" inside the iframe
+
+Assert visible text does NOT exist inside the active iframe.
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^I should not see "([^"]*)" inside the iframe$/
+```
+
+**Examples**
+
+```gherkin
+Then I should not see "Error" inside the iframe
+Then I should not see "Declined" inside the iframe
+And I should not see "Loading" inside the iframe
+Then I should not see "Pending" inside the iframe
+Then I should not see "Try again" inside the iframe
+```

package/docs/steps/input.md

@@ -0,0 +1,220 @@
+# Pointer input steps
+
+9 steps, defined in `tests/step-definitions/input.steps.js`.
+
+Cucumber-js loads every `*.steps.js` in that directory automatically — you never `require()` a step file from a feature.
+
+| # | Step |
+| --- | --- |
+| 1 | `When I hover over "#nav-products"` |
+| 2 | `When I move the pointer to "#cta"` |
+| 3 | `When I double-click on "#row-1"` |
+| 4 | `When I right-click on "#row-1"` |
+| 5 | `When I middle-click on "a.external"` |
+| 6 | `When I click on "#row-1" while holding "Shift"` |
+| 7 | `When I drag "#card-1" to "#column-done"` |
+| 8 | `When I set the viewport size to 1280x720` |
+| 9 | `When I tap on "#cta"` |
+
+---
+
+## 1. When I hover over "#nav-products"
+
+Hover the mouse pointer over a CSS-addressed element.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*hover over "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I hover over "#nav-products"
+When I hover over ".tooltip-trigger"
+And we hover over "[data-testid=user-menu]"
+When I hover over "button.help"
+When I hover over ".chart-bar:nth-child(3)"
+```
+
+## 2. When I move the pointer to "#cta"
+
+Move the mouse pointer over a CSS-addressed element (alias for hover).
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*move the pointer to "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I move the pointer to "#cta"
+When we move the pointer to ".dropdown-trigger"
+And I move the pointer to "[data-testid=avatar]"
+When I move the pointer to "img.gallery-thumb"
+When I move the pointer to ".legend-item"
+```
+
+## 3. When I double-click on "#row-1"
+
+Double-click on a CSS-addressed element.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*double[- ]click on "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I double-click on "#row-1"
+When I double click on ".file-tile"
+And we double-click on "[data-testid=cell-A1]"
+When I double-click on "img.editable"
+When I double click on "td.editable-cell"
+```
+
+## 4. When I right-click on "#row-1"
+
+Right-click (context menu) on a CSS-addressed element.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*right[- ]click on "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I right-click on "#row-1"
+When I right click on ".tree-node"
+And we right-click on "[data-testid=image]"
+When I right-click on "li.contact"
+When I right click on "td.cell"
+```
+
+## 5. When I middle-click on "a.external"
+
+Middle-click on a CSS-addressed element.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*middle[- ]click on "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I middle-click on "a.external"
+When I middle click on "#tab-2"
+And we middle-click on "[data-testid=link]"
+When I middle-click on "li.bookmark"
+When I middle click on "a.product-link"
+```
+
+## 6. When I click on "#row-1" while holding "Shift"
+
+Click on a CSS-addressed element while holding a modifier key.
+
+Modifier names follow Playwright: `Shift`, `Control`, `Alt`, `Meta`.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*click on "([^"]*)" while holding "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I click on "#row-1" while holding "Shift"
+When I click on ".checkbox" while holding "Control"
+And we click on "a.external" while holding "Meta"
+When I click on ".item" while holding "Alt"
+When I click on "#tab-2" while holding "Shift"
+```
+
+## 7. When I drag "#card-1" to "#column-done"
+
+Drag a source element onto a target element.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*drag "([^"]*)" to "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I drag "#card-1" to "#column-done"
+When I drag ".file-tile" to "#trash"
+And we drag "[data-testid=task-1]" to "[data-testid=in-progress]"
+When I drag "#image" to "#canvas"
+When I drag "li.draggable" to "ul.dropzone"
+```
+
+## 8. When I set the viewport size to 1280x720
+
+Resize the browser viewport to a specific WxH.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*set the viewport size to (\d+)x(\d+)$/
+```
+
+**Examples**
+
+```gherkin
+When I set the viewport size to 1280x720
+When I set the viewport size to 375x667
+And we set the viewport size to 768x1024
+When I set the viewport size to 1920x1080
+When I set the viewport size to 320x568
+```
+
+## 9. When I tap on "#cta"
+
+Touch-tap a CSS-addressed element. Falls back to a regular click if the
+browser context was not opened with `hasTouch: true`.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*tap on "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I tap on "#cta"
+When I tap on ".bottom-nav-item"
+And we tap on "[data-testid=fab]"
+When I tap on "button.menu"
+When I tap on ".swipe-card"
+```

package/docs/steps/javascript.md

@@ -0,0 +1,111 @@
+# JavaScript errors steps
+
+4 steps, defined in `tests/step-definitions/javascript.steps.js`.
+
+Cucumber-js loads every `*.steps.js` in that directory automatically — you never `require()` a step file from a feature.
+
+| # | Step |
+| --- | --- |
+| 1 | `Then there should be no JavaScript errors` |
+| 2 | `Then there should be no JavaScript warnings` |
+| 3 | `Then JavaScript errors should not match "TypeError"` |
+| 4 | `Then print JavaScript errors` |
+
+---
+
+## 1. Then there should be no JavaScript errors
+
+Assert that no JavaScript errors have been collected so far.
+
+Always fails on error (ignoring the active mode) — this is the explicit
+"hard check" step. Calling it also prevents the auto-report at scenario
+end so a single error is not reported twice.
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^there should be no JavaScript errors$/
+```
+
+**Examples**
+
+```gherkin
+Then there should be no JavaScript errors
+And there should be no JavaScript errors
+But there should be no JavaScript errors
+Then there should be no JavaScript errors
+Then there should be no JavaScript errors
+```
+
+## 2. Then there should be no JavaScript warnings
+
+Assert that no JavaScript console warnings were collected. Requires
+'warning' to be in the captured console levels (see worldParameters or
+VARBASE_E2E_JS_ERROR_LEVELS).
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^there should be no JavaScript warnings$/
+```
+
+**Examples**
+
+```gherkin
+Then there should be no JavaScript warnings
+And there should be no JavaScript warnings
+But there should be no JavaScript warnings
+Then there should be no JavaScript warnings
+Then there should be no JavaScript warnings
+```
+
+## 3. Then JavaScript errors should not match "TypeError"
+
+Assert that no collected JavaScript error message matches a regular
+expression. Useful when some noise is unavoidable but a specific bug
+pattern must never appear.
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^JavaScript errors should not match "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+Then JavaScript errors should not match "TypeError"
+Then JavaScript errors should not match "is not a function"
+And JavaScript errors should not match "Cannot read property"
+Then JavaScript errors should not match "ReferenceError: .* is not defined"
+Then JavaScript errors should not match "Uncaught"
+```
+
+## 4. Then print JavaScript errors
+
+Print the JavaScript errors collected so far. Diagnostic only — never
+asserts, never fails. Useful inside a scenario being debugged.
+
+**Keyword**: `Then`
+
+**Pattern**
+
+```js
+/^print JavaScript errors$/
+```
+
+**Examples**
+
+```gherkin
+Then print JavaScript errors
+And print JavaScript errors
+But print JavaScript errors
+Then print JavaScript errors
+Then print JavaScript errors
+```

package/docs/steps/keyboard.md

@@ -0,0 +1,107 @@
+# Keyboard steps
+
+4 steps, defined in `tests/step-definitions/keyboard.steps.js`.
+
+Cucumber-js loads every `*.steps.js` in that directory automatically — you never `require()` a step file from a feature.
+
+| # | Step |
+| --- | --- |
+| 1 | `When I press the key "Enter"` |
+| 2 | `When I press the key "Enter" on the element "#search"` |
+| 3 | `When I press the keys "Control+a"` |
+| 4 | `When I press the keys "Control+a" on the element "#editor"` |
+
+---
+
+## 1. When I press the key "Enter"
+
+Press a single key against the page (whatever element is currently focused).
+
+Common aliases (`enter`, `tab`, `esc`, `space`, `up/down/left/right`) are
+normalised to Playwright's canonical key names.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*press the key "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I press the key "Enter"
+When I press the key "Escape"
+And I press the key "Tab"
+When I press the key "ArrowDown"
+When I focus on the element "#search"
+  And I press the key "Enter"
+```
+
+## 2. When I press the key "Enter" on the element "#search"
+
+Press a single key while a specific element is focused.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*press the key "([^"]*)" on the element "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I press the key "Enter" on the element "#search"
+When I press the key "Tab" on the element "input[type=email]"
+And I press the key "ArrowDown" on the element ".combobox"
+When I press the key "Backspace" on the element "#name"
+When I press the key "Escape" on the element "[role=dialog]"
+```
+
+## 3. When I press the keys "Control+a"
+
+Press a key combination against the page. Combos use `+` between modifiers
+and the final key (e.g. `Control+a`, `Meta+s`, `Shift+Tab`).
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*press the keys "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I press the keys "Control+a"
+When I press the keys "Meta+s"
+And I press the keys "Shift+Tab"
+When I press the keys "Alt+ArrowLeft"
+When I press the keys "Control+Shift+P"
+```
+
+## 4. When I press the keys "Control+a" on the element "#editor"
+
+Press a key combination while a specific element is focused.
+
+**Keyword**: `When`
+
+**Pattern**
+
+```js
+/^(I |we )*press the keys "([^"]*)" on the element "([^"]*)"$/
+```
+
+**Examples**
+
+```gherkin
+When I press the keys "Control+a" on the element "#editor"
+When I press the keys "Meta+s" on the element "form"
+And I press the keys "Shift+Tab" on the element "#email"
+When I press the keys "Control+Enter" on the element "#message"
+When I press the keys "Alt+Down" on the element ".combobox"
+```