[email protected] - Introduced a new base page to reduce client code (

#1909) * Introduced a new base page to reduce client code * Updated ver. Co-authored-by: billy.oliver <[email protected]>
justeattakeaway · Jun 8, 2022 · f6d9263 · f6d9263
1 parent c013731
commit f6d9263
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 5 deletions.
diff --git a/packages/services/f-wdio-utils/CHANGELOG.md b/packages/services/f-wdio-utils/CHANGELOG.md
@@ -3,6 +3,15 @@
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+
+v0.11.0
+------------------------------
+*June 8, 2022*
+
+### Added
+- Introduce a new base page that infers the calling component which can then reduce the client code
+
+
 v0.10.0
 ------------------------------
 *June 1, 2022*

diff --git a/packages/services/f-wdio-utils/package.json b/packages/services/f-wdio-utils/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@justeat/f-wdio-utils",
   "description": "Fozzie Wdio Utils - webdriverIO page object",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "files": [
     "src/"
   ],

diff --git a/packages/services/f-wdio-utils/src/base.page.js b/packages/services/f-wdio-utils/src/base.page.js
@@ -0,0 +1,24 @@
+const Page = require('./page.object');
+const { buildUrl } = require('./storybook-extensions');
+
+class BasePage extends Page {
+    get component () {
+        return $(`[${this.componentTag}='${this.componentName}']`);
+    }
+
+    async load (queries) {
+        const pageUrl = buildUrl(this.componentType, this.componentName, this.composePath(queries));
+        this.open(pageUrl);
+        await this.waitForComponent();
+    }
+
+    async waitForComponent (timeoutMs = 500) {
+        await this.component.waitForExist({ timeout: timeoutMs });
+    }
+
+    isComponentDisplayed () {
+        return this.component.isDisplayed();
+    }
+}
+
+module.exports = BasePage;
diff --git a/packages/services/f-wdio-utils/src/page.object.js b/packages/services/f-wdio-utils/src/page.object.js
@@ -2,12 +2,11 @@ const { source } = require('axe-core');
 const { buildUrl } = require('./storybook-extensions');
 
 class Page {
-    #defaultWaitTimeout = 500;
-
-    constructor (componentType, componentName) {
+    constructor (componentType, componentName, componentTag = 'data-test-id') {
         this.title = 'Component URLS';
         this.componentType = componentType;
         this.componentName = componentName;
+        this.componentTag = componentTag;
         this.path = '';
     }
 
@@ -22,7 +21,7 @@ class Page {
         return this;
     }
 
-    waitForComponent (component, timeoutMs = this.#defaultWaitTimeout) {
+    waitForComponent (component, timeoutMs = 500) {
         component.waitForExist({ timeout: timeoutMs });
     }