Feature/5 multiremote support

.github/workflows/main.yml

@@ -33,3 +33,6 @@ jobs:
 
       - name: Run tests
         run: npm test
+
+      - name: Run multiremote tests
+        run: npm run test:multiremote

package.json

@@ -20,7 +20,8 @@
     "release:patch": "npm run release -- patch",
     "release:minor": "npm run release -- minor",
     "release:major": "npm run release -- major",
-    "test": "npx wdio run tests/wdio.conf.ts"
+    "test": "npx wdio run tests/wdio.conf.ts",
+    "test:multiremote": "npx wdio run tests/wdio.multiremote.conf.ts"
   },
   "repository": {
     "type": "git",

src/browser/alertIsPresent.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking an alert on the page
  *
@@ -9,7 +11,7 @@
  */
 
 export function alertIsPresent(): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    return await browser.isAlertOpen();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    return await this.isAlertOpen();
   };
 }

src/browser/numberOfWindowsToBe​.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking the number of opened windows.
  *
@@ -10,8 +12,8 @@
  */
 
 export function numberOfWindowsToBe(expectedNumber: number): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const actualWindows = await browser.getWindowHandles();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    const actualWindows = await this.getWindowHandles();
 
     return actualWindows.length === expectedNumber;
   };

src/browser/titleContains.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking that the title contains a case-sensitive substring
  *
@@ -10,8 +12,8 @@
  */
 
 export function titleContains(expectedTitle: string): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const actualTitle = await browser.getTitle();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    const actualTitle = await this.getTitle();
 
     return actualTitle.includes(expectedTitle);
   };

src/browser/titleIs.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking the title of a page
  *
@@ -10,8 +12,8 @@
  */
 
 export function titleIs(expectedTitle: string): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const actualTitle = await browser.getTitle();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    const actualTitle = await this.getTitle();
 
     return actualTitle === expectedTitle;
   };

src/browser/urlContains.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking the URL of the current page to contain specific text.
  *
@@ -10,8 +12,8 @@
  */
 
 export function urlContains(expectedUrl: string): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const actualUrl = await browser.getUrl();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    const actualUrl = await this.getUrl();
 
     return actualUrl.includes(expectedUrl);
   };

src/browser/urlIs.ts

@@ -1,3 +1,5 @@
+import type { Browser } from 'webdriverio';
+
 /**
  * A condition for checking URL of the current page to be a specific url.
  *
@@ -10,8 +12,8 @@
  */
 
 export function urlIs(expectedUrl: string): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const actualUrl = await browser.getUrl();
+  return async function (this: Browser<'async'>): Promise<boolean> {
+    const actualUrl = await this.getUrl();
 
     return actualUrl === expectedUrl;
   };

src/element/elementToBeClickable.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking an element is visible and clickable
  *
@@ -11,8 +13,8 @@
  */
 
 export function elementToBeClickable(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
 
     return await element.isClickable();
   };

src/element/elementToBeEnabled.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking an element is visible and enabled such that you can click it
  *
@@ -11,8 +13,8 @@
  */
 
 export function elementToBeEnabled(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
 
     return await element.isEnabled();
   };

src/element/elementToBeSelected.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking an element is visible and selected
  *
@@ -11,8 +13,8 @@
  */
 
 export function elementToBeSelected(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
 
     return await element.isSelected();
   };

src/element/invisibilityOf.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking the element to be invisible
  *
@@ -11,9 +13,9 @@
  */
 
 export function invisibilityOf(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
+  return async function (): Promise<boolean> {
     try {
-      const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+      const element = await getElement(selectorOrElement);
       const isVisible = await element.isDisplayed();
 
       return !isVisible;

src/element/numberOfElementsToBe.ts

@@ -1,3 +1,5 @@
+import { getElements } from './../utils';
+
 /**
  * A condition for checking number of elements with given selector
  *
@@ -15,9 +17,8 @@ export function numberOfElementsToBe(
   selectorOrElementArray: string | Promise<WebdriverIO.ElementArray>,
   expectedNumber: number,
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const elements =
-      typeof selectorOrElementArray === 'string' ? await $$(selectorOrElementArray) : await selectorOrElementArray;
+  return async function (): Promise<boolean> {
+    const elements = await getElements(selectorOrElementArray);
 
     return elements.length === expectedNumber;
   };

src/element/numberOfElementsToBeLessThan.ts

@@ -1,3 +1,5 @@
+import { getElements } from './../utils';
+
 /**
  * A condition for checking number of elements with given selector being less than defined number
  *
@@ -15,9 +17,8 @@ export function numberOfElementsToBeLessThan(
   selectorOrElementArray: string | Promise<WebdriverIO.ElementArray>,
   expectedNumber: number,
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const elements =
-      typeof selectorOrElementArray === 'string' ? await $$(selectorOrElementArray) : await selectorOrElementArray;
+  return async function (): Promise<boolean> {
+    const elements = await getElements(selectorOrElementArray);
 
     return elements.length < expectedNumber;
   };

src/element/numberOfElementsToBeMoreThan​.ts

@@ -1,3 +1,5 @@
+import { getElements } from './../utils';
+
 /**
  * A condition for checking number of elements with given selector being more than defined number
  *
@@ -15,9 +17,8 @@ export function numberOfElementsToBeMoreThan(
   selectorOrElementArray: string | Promise<WebdriverIO.ElementArray>,
   expectedNumber: number,
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const elements =
-      typeof selectorOrElementArray === 'string' ? await $$(selectorOrElementArray) : await selectorOrElementArray;
+  return async function (): Promise<boolean> {
+    const elements = await getElements(selectorOrElementArray);
 
     return elements.length > expectedNumber;
   };

src/element/presenceOf.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking that an element is present on the DOM of a page
  *
@@ -11,9 +13,9 @@
  */
 
 export function presenceOf(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
+  return async function (): Promise<boolean> {
     try {
-      const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+      const element = await getElement(selectorOrElement);
       const isVisible = await element.isExisting();
 
       return isVisible;

src/element/sizeOfElementToBe.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking size of element with given selector
  *
@@ -15,8 +17,8 @@ export function sizeOfElementsToBe(
   selectorOrElement: string | Promise<WebdriverIO.Element>,
   expectedSize: { width: number; height: number },
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
     const actualSize = await element.getSize();
 
     return actualSize.width === expectedSize.width && actualSize.height === expectedSize.height;

src/element/stalenessOf.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking that an element is not present on the DOM of a page
  *
@@ -11,9 +13,9 @@
  */
 
 export function stalenessOf(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
+  return async function (): Promise<boolean> {
     try {
-      const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+      const element = await getElement(selectorOrElement);
       const isVisible = await element.isExisting();
 
       return !isVisible;

src/element/textToBePresentInElement.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking an element contains a specific text
  *
@@ -15,8 +17,8 @@ export function textToBePresentInElement(
   selectorOrElement: string | Promise<WebdriverIO.Element>,
   expectedText: string,
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
     const text = await element.getText();
 
     return text.includes(expectedText);

src/element/textToBePresentInElementValue.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking an element contains a specific value
  *
@@ -15,8 +17,8 @@ export function textToBePresentInElementValue(
   selectorOrElement: string | Promise<WebdriverIO.Element>,
   expectedValue: string,
 ): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
-    const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+  return async function (): Promise<boolean> {
+    const element = await getElement(selectorOrElement);
     const value = await element.getValue();
 
     return value.includes(expectedValue);

src/element/visibilityOf.ts

@@ -1,3 +1,5 @@
+import { getElement } from './../utils';
+
 /**
  * A condition for checking the element to be visible
  *
@@ -11,9 +13,9 @@
  */
 
 export function visibilityOf(selectorOrElement: string | Promise<WebdriverIO.Element>): () => Promise<boolean> {
-  return async (): Promise<boolean> => {
+  return async function (): Promise<boolean> {
     try {
-      const element = typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+      const element = await getElement(selectorOrElement);
       const isVisible = await element.isDisplayed();
 
       return isVisible;

src/utils/getElement.ts

@@ -0,0 +1,5 @@
+export const getElement = async (
+  selectorOrElement: string | Promise<WebdriverIO.Element>,
+): Promise<WebdriverIO.Element> => {
+  return typeof selectorOrElement === 'string' ? await $(selectorOrElement) : await selectorOrElement;
+};

src/utils/getElements.ts

@@ -0,0 +1,5 @@
+export const getElements = async (
+  selectorOrElementArray: string | Promise<WebdriverIO.ElementArray>,
+): Promise<WebdriverIO.ElementArray> => {
+  return typeof selectorOrElementArray === 'string' ? await $$(selectorOrElementArray) : await selectorOrElementArray;
+};

src/utils/index.ts

@@ -0,0 +1,2 @@
+export * from './getElement';
+export * from './getElements';

tests/browser/alertIsPresent.test.ts

@@ -6,10 +6,10 @@ describe('alertIsPresent', () => {
   it('should verify that method returns true when element is clickable', async () => {
     await browser.execute('alert("Alert");');
 
-    expect(await alertIsPresent()()).toBe(true);
+    expect(await alertIsPresent().call(browser)).toBe(true);
   });
 
   it('should verify that method returns false when alert is not present', async () => {
-    expect(await alertIsPresent()()).toBe(false);
+    expect(await alertIsPresent().call(browser)).toBe(false);
   });
 });

tests/browser/numberOfWindowsToBe.test.ts

@@ -7,12 +7,12 @@ describe('numberOfWindowsToBe', () => {
     const link = await $('.large-centered a');
     await link.click();
 
-    expect(await numberOfWindowsToBe(2)()).toBe(true);
+    expect(await numberOfWindowsToBe(2).call(browser)).toBe(true);
   });
 
   it('should verify that method returns false when number of windows not to be', async () => {
     await browser.closeWindow();
 
-    expect(await numberOfWindowsToBe(2)()).toBe(false);
+    expect(await numberOfWindowsToBe(2).call(browser)).toBe(false);
   });
 });