added value wait and expect steps (#108)

Author: AlexGalichenko

.github/workflows/npm-publish.yml

@@ -11,8 +11,8 @@ jobs:
   publish-npm:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
           node-version: 18
           registry-url: https://registry.npmjs.org/

.github/workflows/pull-request.yml

@@ -12,8 +12,8 @@ jobs:
         version: [ 18, 20 ]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.version }}
       - run: npm ci
@@ -22,7 +22,7 @@ jobs:
       - run: npm run install:browsers
       - run: npm run test:e2e
       - name: junit report
-        uses: mikepenz/action-junit-report@v3
+        uses: mikepenz/action-junit-report@v4
         if: always()
         with:
           report_paths: './test-e2e/report.xml'

CHANGELOG.md

@@ -11,6 +11,7 @@ Check [Keep a Changelog](http://keepachangelog.com/) for recommendations on how
 
 ## [Unreleased]
 - :pencil: cleaned up dependencies
+- :rocket: added value wait and validation
 
 ## [0.44.0]
 - :rocket: added option to take full page screenshot (_config.browser.screenshot.fullPage_)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qavajs/steps-playwright",
-  "version": "0.44.0",
+  "version": "0.45.0",
   "description": "steps to interact with playwright",
   "main": "./index.js",
   "scripts": {

src/validations.ts

@@ -41,6 +41,31 @@ Then(
     }
 );
 
+/**
+ * Verify value of element
+ * @param {string} alias - element to verify
+ * @param {string} validationType - validation
+ * @param {string} value - expected value
+ * @example I expect value of 'Search Input' to be equal 'text'
+ */
+Then(
+    'I expect value of {string} {playwrightValidation} {string}',
+    async function (alias: string, validationType: string, value: string) {
+        const expectedValue = await getValue(value);
+        const element = await getElement(alias);
+        const timeout = config.browser.timeout.value;
+        await element.waitFor({ state: 'attached', timeout });
+        const validation = getPollValidation(validationType);
+        const actualValue = () => element.evaluate(
+            (node: any) => node.value
+        );
+        await validation(actualValue, expectedValue, {
+            timeout,
+            interval: config.browser.timeout.valueInterval
+        });
+    }
+);
+
 /**
  * Verify that property of element satisfies condition
  * @param {string} property - element to verify

src/waits.ts

@@ -72,6 +72,33 @@ When(
     }
 );
 
+/**
+ * Wait for element value condition
+ * @param {string} alias - element to wait condition
+ * @param {string} wait - wait condition
+ * @param {string} value - expected value to wait
+ * @param {number|null} [timeout] - custom timeout in ms
+ * @example I wait until value of 'Search Input' to be equal 'Javascript'
+ * @example I wait until value of 'Search Input' to be equal 'Javascript' (timeout: 3000)
+ */
+When(
+    'I wait until value of {string} {playwrightValidation} {string}( ){playwrightTimeout}',
+    async function (alias: string, waitType: string, value: string, timeoutValue: number | null) {
+        const wait = getPollValidation(waitType);
+        const element = await getElement(alias);
+        const timeout = timeoutValue ?? config.browser.timeout.value;
+        await element.waitFor({ state: 'attached', timeout });
+        const expectedValue = await getValue(value);
+        const getValueFn = () => element.evaluate(
+            (node: any) => node.value
+        );
+        await wait(getValueFn, expectedValue, {
+            timeout,
+            interval: config.browser.timeout.valueInterval
+        });
+    }
+);
+
 /**
  * Wait for element property condition
  * @param {string} property - property

test-e2e/features/validations.feature

@@ -18,6 +18,11 @@ Feature: validations
     Then I expect number of elements in 'Simple Text List Items' collection to be greater than '2'
     Then I expect number of elements in 'Simple Text List Items' collection to be less than '4'
 
+  Scenario: element value
+    Then I expect value of 'Simple Text Input' to be equal '123'
+    Then I expect value of 'Simple Text Input' not to be equal '1234'
+    Then I expect value of 'Simple Text Input' to contain '12'
+
   Scenario: element property
     Then I expect 'value' property of 'Simple Text Input' to be equal '123'
     Then I expect 'value' property of 'Simple Text Input' not to be equal '1234'

test-e2e/features/waits.feature

@@ -22,6 +22,9 @@ Feature: waits
       | not to contain | 10          |
       | not to match   | ^.0%$       |
 
+  Scenario: wait for value
+    Then I wait until value of 'Loading Input' to equal '100%'
+
   Scenario Outline: wait for property (<condition>)
     Then I wait until 'value' property of 'Loading Input' <condition> '<expectation>'
 

test-e2e/webui.ts

@@ -37,7 +37,8 @@ const common = {
     ],
     formatOptions: {
         console: {
-            showLogs: true
+            showLogs: true,
+            showProgress: false
         }
     },
     memory: new Memory(),