@fluentui-react-native/tester 0.49.0 → 0.50.3

package/src/E2E/Separator/pages/SeparatorPageObject.macos.ts

@@ -0,0 +1,29 @@
+import {
+  SEPARATOR_TESTPAGE,
+  SEPARATOR_TEST_COMPONENT,
+  HOMEPAGE_SEPARATOR_BUTTON,
+} from '../../../FluentTester/TestComponents/Separator/consts';
+import { BasePage, By } from '../../common/BasePage.macos';
+
+class SeparatorPageObject extends BasePage {
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(SEPARATOR_TESTPAGE);
+  }
+
+  get _pageName() {
+    return SEPARATOR_TESTPAGE;
+  }
+
+  get _primaryComponent() {
+    return By(SEPARATOR_TEST_COMPONENT);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_SEPARATOR_BUTTON);
+  }
+}
+
+export default new SeparatorPageObject();

package/src/E2E/Separator/pages/SeparatorPageObject.win.ts

@@ -3,7 +3,7 @@ import {
   SEPARATOR_TEST_COMPONENT,
   HOMEPAGE_SEPARATOR_BUTTON,
 } from '../../../FluentTester/TestComponents/Separator/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class SeparatorPageObject extends BasePage {
   /*****************************************/

package/src/E2E/Separator/specs/Separator.spec.macos.ts

@@ -0,0 +1,23 @@
+import NavigateAppPage from '../../common/NavigateAppPage.macos';
+import SeparatorPageObject from '../pages/SeparatorPageObject.macos';
+import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
+
+// Before testing begins, allow up to 60 seconds for app to open
+describe('Separator Testing Initialization', function () {
+  it('Wait for app load', () => {
+    NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+  });
+
+  it('Click and navigate to Separator test page', () => {
+    /* Scroll to component test page button in scrollview if not already visible*/
+    SeparatorPageObject.scrollToComponentButton();
+    SeparatorPageObject.waitForButtonDisplayed(PAGE_TIMEOUT);
+
+    /* Click on component button to navigate to test page */
+    NavigateAppPage.clickAndGoToSeparatorPage();
+    SeparatorPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
+
+    expect(SeparatorPageObject.isPageLoaded()).toBeTruthy();
+  });
+});

package/src/E2E/Separator/specs/Separator.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import SeparatorPageObject from '../pages/SeparatorPageObject.win';
 import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 

package/src/E2E/Svg/pages/SvgPageObject.macos.ts

@@ -0,0 +1,25 @@
+import { SVG_TESTPAGE, SVG_TEST_COMPONENT, HOMEPAGE_SVG_BUTTON } from '../../../FluentTester/TestComponents/Svg/consts';
+import { BasePage, By } from '../../common/BasePage.macos';
+
+class SvgPageObject extends BasePage {
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(SVG_TESTPAGE);
+  }
+
+  get _pageName() {
+    return SVG_TESTPAGE;
+  }
+
+  get _primaryComponent() {
+    return By(SVG_TEST_COMPONENT);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_SVG_BUTTON);
+  }
+}
+
+export default new SvgPageObject();

package/src/E2E/Svg/pages/SvgPageObject.win.ts

@@ -1,5 +1,5 @@
 import { SVG_TESTPAGE, SVG_TEST_COMPONENT, HOMEPAGE_SVG_BUTTON } from '../../../FluentTester/TestComponents/Svg/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class SvgPageObject extends BasePage {
   /*****************************************/

package/src/E2E/Svg/specs/Svg.spec.macos.ts

@@ -0,0 +1,23 @@
+import NavigateAppPage from '../../common/NavigateAppPage.macos';
+import SvgPageObject from '../pages/SvgPageObject.macos';
+import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
+
+// Before testing begins, allow up to 60 seconds for app to open
+describe('Svg Testing Initialization', function () {
+  it('Wait for app load', () => {
+    NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+  });
+
+  it('Click and navigate to Svg test page', () => {
+    /* Scroll to component test page button in scrollview if not already visible*/
+    SvgPageObject.scrollToComponentButton();
+    SvgPageObject.waitForButtonDisplayed(PAGE_TIMEOUT);
+
+    /* Click on component button to navigate to test page */
+    NavigateAppPage.clickAndGoToSvgPage();
+    SvgPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
+
+    expect(SvgPageObject.isPageLoaded()).toBeTruthy();
+  });
+});

package/src/E2E/Svg/specs/Svg.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import SvgPageObject from '../pages/SvgPageObject.win';
 import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 

package/src/E2E/Tabs/pages/TabsPageObject.macos.ts

@@ -0,0 +1,44 @@
+import {
+  TABS_TESTPAGE,
+  TABS_TEST_COMPONENT,
+  TABS_ITEM_TEST_COMPONENT,
+  HOMEPAGE_TABS_BUTTON,
+} from '../../../FluentTester/TestComponents/Tabs/consts';
+import { BasePage, By } from '../../common/BasePage.macos';
+
+class TabsPageObject extends BasePage {
+  /******************************************************************/
+  /**************** UI Element Interaction Methods ******************/
+  /******************************************************************/
+  getTabItemAccesibilityRole(): string {
+    return this._tabItem.getAttribute('ControlType');
+  }
+
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(TABS_TESTPAGE);
+  }
+
+  get _pageName() {
+    return TABS_TESTPAGE;
+  }
+
+  get _primaryComponent() {
+    return By(TABS_TEST_COMPONENT);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_TABS_BUTTON);
+  }
+
+  /***********/
+  /* TabItem *
+  /***********/
+  get _tabItem() {
+    return By(TABS_ITEM_TEST_COMPONENT);
+  }
+}
+
+export default new TabsPageObject();

package/src/E2E/Tabs/pages/TabsPageObject.win.ts

@@ -4,7 +4,7 @@ import {
   TABS_ITEM_TEST_COMPONENT,
   HOMEPAGE_TABS_BUTTON,
 } from '../../../FluentTester/TestComponents/Tabs/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class TabsPageObject extends BasePage {
   /******************************************************************/

package/src/E2E/Tabs/specs/Tabs.spec.macos.ts

@@ -0,0 +1,23 @@
+import NavigateAppPage from '../../common/NavigateAppPage.macos';
+import TabsPageObject from '../pages/TabsPageObject.macos';
+import { BOOT_APP_TIMEOUT, PAGE_TIMEOUT } from '../../common/consts';
+
+// Before testing begins, allow up to 60 seconds for app to open
+describe('Tabs Testing Initialization', function () {
+  it('Wait for app load', () => {
+    NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+  });
+
+  it('Click and navigate to Tabs test page', () => {
+    /* Scroll to component test page button in scrollview if not already visible*/
+    TabsPageObject.scrollToComponentButton();
+    TabsPageObject.waitForButtonDisplayed(PAGE_TIMEOUT);
+
+    /* Click on component button to navigate to test page */
+    NavigateAppPage.clickAndGoToTabsPage();
+    TabsPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
+
+    expect(TabsPageObject.isPageLoaded()).toBeTruthy();
+  });
+});

package/src/E2E/Tabs/specs/Tabs.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import TabsPageObject from '../pages/TabsPageObject.win';
 import { TAB_A11Y_ROLE, BOOT_APP_TIMEOUT, PAGE_TIMEOUT, TABITEM_A11Y_ROLE } from '../../common/consts';
 

package/src/E2E/TabsExperimental/pages/ExperimentalTabsPageObject.macos.ts

@@ -0,0 +1,44 @@
+import {
+  EXPERIMENTAL_TABS_ITEM_TEST_COMPONENT,
+  EXPERIMENTAL_TABS_TESTPAGE,
+  EXPERIMENTAL_TABS_TEST_COMPONENT,
+  HOMEPAGE_EXPERIMENTAL_TABS_BUTTON,
+} from '../../../FluentTester/TestComponents/TabsExperimental/consts';
+import { BasePage, By } from '../../common/BasePage.macos';
+
+class ExperimentalTabsPageObject extends BasePage {
+  /******************************************************************/
+  /**************** UI Element Interaction Methods ******************/
+  /******************************************************************/
+  getTabItemAccesibilityRole(): string {
+    return this._tabItem.getAttribute('ControlType');
+  }
+
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(EXPERIMENTAL_TABS_TESTPAGE);
+  }
+
+  get _pageName() {
+    return EXPERIMENTAL_TABS_TESTPAGE;
+  }
+
+  get _primaryComponent() {
+    return By(EXPERIMENTAL_TABS_TEST_COMPONENT);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_EXPERIMENTAL_TABS_BUTTON);
+  }
+
+  /***********/
+  /* TabItem *
+  /***********/
+  get _tabItem() {
+    return By(EXPERIMENTAL_TABS_ITEM_TEST_COMPONENT);
+  }
+}
+
+export default new ExperimentalTabsPageObject();

package/src/E2E/TabsExperimental/pages/ExperimentalTabsPageObject.win.ts

@@ -4,7 +4,7 @@ import {
   EXPERIMENTAL_TABS_TEST_COMPONENT,
   HOMEPAGE_EXPERIMENTAL_TABS_BUTTON,
 } from '../../../FluentTester/TestComponents/TabsExperimental/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class ExperimentalTabsPageObject extends BasePage {
   /******************************************************************/

package/src/E2E/TabsExperimental/specs/TabsExperimental.spec.macos.ts

@@ -0,0 +1,23 @@
+import NavigateAppPage from '../../common/NavigateAppPage.macos';
+import ExperimentalTabsPageObject from '../pages/ExperimentalTabsPageObject.macos';
+import { BOOT_APP_TIMEOUT, PAGE_TIMEOUT } from '../../common/consts';
+
+// Before testing begins, allow up to 60 seconds for app to open
+describe('Experimental Tabs Testing Initialization', function () {
+  it('Wait for app load', () => {
+    NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+  });
+
+  it('Click and navigate to Experimental Tabs test page', () => {
+    /* Scroll to component test page button in scrollview if not already visible*/
+    ExperimentalTabsPageObject.scrollToComponentButton();
+    ExperimentalTabsPageObject.waitForButtonDisplayed(PAGE_TIMEOUT);
+
+    /* Click on component button to navigate to test page */
+    NavigateAppPage.clickAndGoToExperimentalTabsPage();
+    ExperimentalTabsPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
+
+    expect(ExperimentalTabsPageObject.isPageLoaded()).toBeTruthy();
+  });
+});

package/src/E2E/TabsExperimental/specs/TabsExperimental.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import ExperimentalTabsPageObject from '../pages/ExperimentalTabsPageObject.win';
 import { TAB_A11Y_ROLE, TABITEM_A11Y_ROLE, BOOT_APP_TIMEOUT, PAGE_TIMEOUT } from '../../common/consts';
 

package/src/E2E/Text/pages/TextPageObject.macos.ts

@@ -0,0 +1,25 @@
+import { TEXT_TESTPAGE, TEXT_TEST_COMPONENT, HOMEPAGE_TEXT_BUTTON } from '../../../FluentTester/TestComponents/Text/consts';
+import { BasePage, By } from '../../common/BasePage.macos';
+
+class TextPageObject extends BasePage {
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(TEXT_TESTPAGE);
+  }
+
+  get _pageName() {
+    return TEXT_TESTPAGE;
+  }
+
+  get _primaryComponent() {
+    return By(TEXT_TEST_COMPONENT);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_TEXT_BUTTON);
+  }
+}
+
+export default new TextPageObject();

package/src/E2E/Text/pages/TextPageObject.win.ts

@@ -1,5 +1,5 @@
 import { TEXT_TESTPAGE, TEXT_TEST_COMPONENT, HOMEPAGE_TEXT_BUTTON } from '../../../FluentTester/TestComponents/Text/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class TextPageObject extends BasePage {
   /*****************************************/

package/src/E2E/Text/specs/Text.spec.macos.ts

@@ -0,0 +1,23 @@
+import NavigateAppPage from '../../common/NavigateAppPage.macos';
+import TextPageObject from '../pages/TextPageObject.macos';
+import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
+
+// Before testing begins, allow up to 60 seconds for app to open
+describe('Text Testing Initialization', function () {
+  it('Wait for app load', () => {
+    NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+  });
+
+  it('Click and navigate to Text test page', () => {
+    /* Scroll to component test page button in scrollview if not already visible*/
+    TextPageObject.scrollToComponentButton();
+    TextPageObject.waitForButtonDisplayed(PAGE_TIMEOUT);
+
+    /* Click on component button to navigate to test page */
+    NavigateAppPage.clickAndGoToTextPage();
+    TextPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
+
+    expect(TextPageObject.isPageLoaded()).toBeTruthy();
+  });
+});

package/src/E2E/Text/specs/Text.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import TextPageObject from '../pages/TextPageObject.win';
 import { TEXT_A11Y_ROLE, PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 

package/src/E2E/Theme/pages/ThemePageObject.win.ts

@@ -1,5 +1,5 @@
 import { THEME_TESTPAGE, THEME_TEST_COMPONENT, HOMEPAGE_THEME_BUTTON } from '../../../FluentTester/TestComponents/Theme/consts';
-import { BasePage, By } from '../../common/BasePage';
+import { BasePage, By } from '../../common/BasePage.win';
 
 class ThemePageObject extends BasePage {
   /*****************************************/

package/src/E2E/Theme/specs/Theme.spec.win.ts

@@ -1,4 +1,4 @@
-import NavigateAppPage from '../../common/NavigateAppPage';
+import NavigateAppPage from '../../common/NavigateAppPage.win';
 import ThemePageObject from '../pages/ThemePageObject.win';
 import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 

package/src/E2E/common/BasePage.macos.ts

@@ -0,0 +1,172 @@
+const DUMMY_CHAR = '';
+export const COMPONENT_SCROLL_COORDINATES = { x: -0, y: -100 }; // These are the offsets. Y is negative because we want the touch to move up (and thus it scrolls down)
+
+/* Mac-Specific Selector. We use this to get elements on the test page */
+export function By(identifier: string): WebdriverIO.Element {
+  return $('//*[@identifier="' + identifier + '"]');
+}
+
+/* The values in this enum map to the UI components we want to test in our app. We use this to
+make the communication from our spec document to our page object easier. Please read below to
+see why we have Primary/Secondary components. */
+export const enum ComponentSelector {
+  Primary = 0, // this._primaryComponent
+  Secondary, // this._secondaryComponent
+}
+
+/****************************** IMPORTANT! PLEASE READ! **************************************************
+ * Every component's page object extends this. We can assume each test page will interact with at least
+ * two UI elements, so we'll add integration for two UI elements in this file (See *Getters* section below).
+ * Every additional UI element that a test page wants to interact with should be handled in that respective
+ * component's page object.
+ *********************************************************************************************************/
+
+export class BasePage {
+  /******************************************************************/
+  /**************** UI Element Interaction Methods ******************/
+  /******************************************************************/
+  getAccessibilityRole(): string {
+    return this._primaryComponent.getAttribute('ControlType');
+  }
+
+  /* Gets the accessibility label of an UI element given the selector */
+  getAccessibilityLabel(componentSelector: ComponentSelector): string {
+    switch (componentSelector) {
+      case ComponentSelector.Primary:
+        return this._primaryComponent.getAttribute('Name');
+
+      case ComponentSelector.Secondary:
+        return this._secondaryComponent.getAttribute('Name');
+    }
+  }
+
+  /* Returns true if the test page has loaded. To determine if it's loaded, each test page has a specific UI element we attempt to locate.
+   * If this UI element is located, we know the page as loaded correctly. The UI element we look for is a Text component that contains
+   * the title of the page (this._testPage returns that UI element)  */
+  isPageLoaded(): boolean {
+    return this._testPage.isDisplayed();
+  }
+
+  /* Returns true if the test page's button is displayed (the button that navigates to each test page) */
+  isButtonInView(): boolean {
+    return this._pageButton.isDisplayed();
+  }
+
+  /* Scrolls until the desired test page's button is displayed. We use the scroll viewer UI element as the point to start scrolling.
+   * We use a negative number as the Y-coordinate because that enables us to scroll downwards */
+  scrollToComponentButton(): void {
+    if (!this.isButtonInView()) {
+      const scrollViewElement = $('~SCROLLVIEW_TEST_ID');
+      driver.touchScroll(COMPONENT_SCROLL_COORDINATES.x, COMPONENT_SCROLL_COORDINATES.y, scrollViewElement.elementId);
+    }
+  }
+
+  /* Waits for the test page to load. If the test page doesn't load before the timeout, it causes the test to fail. */
+  waitForPageDisplayed(timeout?: number): void {
+    browser.waitUntil(
+      () => {
+        return this.isPageLoaded();
+      },
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: this._pageName + ' did not render correctly. Please see /errorShots for more information.',
+        interval: 1000,
+      },
+    );
+  }
+
+  /* Waits for the test page's button to be displayed. If the button doesn't load before the timeout, it causes the test to fail. */
+  waitForButtonDisplayed(timeout?: number): void {
+    browser.waitUntil(
+      () => {
+        return this.isButtonInView();
+      },
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: 'Could not find the button to navigate to ' + this._pageName + '. Please see /errorShots for more information.',
+        interval: 1000,
+      },
+    );
+  }
+
+  /* Waits for the primary UI test element to be displayed. If the element doesn't load before the timeout, it causes the test to fail. */
+  waitForPrimaryElementDisplayed(timeout?: number): void {
+    browser.waitUntil(
+      () => {
+        return this._primaryComponent.isDisplayed();
+      },
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg:
+          'The primary UI element for testing did not display correctly. Please see /errorShots of the first failed test for more information.',
+        interval: 1000,
+      },
+    );
+  }
+
+  /* Scrolls to the primary UI test element until it is displayed. It uses the ScrollView that encapsulates each test page. */
+  scrollToTestElement(): void {
+    while (!this._primaryComponent.isDisplayed()) {
+      driver.touchScroll(COMPONENT_SCROLL_COORDINATES.x, COMPONENT_SCROLL_COORDINATES.y, $('~ScrollViewAreaForComponents').elementId);
+    }
+  }
+
+  /* A method that allows the caller to pass in a condition. A wrapper for waitUntil(). Once testing becomes more extensive,
+   * this will allow cleaner code within all the Page Objects. */
+  waitForCondition(condition?: () => boolean, errorMsg?: string, timeout?: number): void {
+    browser.waitUntil(
+      () => {
+        return condition();
+      },
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: errorMsg ?? 'Error. Please see /errorShots and logs for more information.',
+        interval: 1000,
+      },
+    );
+  }
+
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+
+  /*  IMPORTANT:
+   *  Each PageObject class that extends this class is expected to override these values.
+   *  This is necessary because each page will have different IDs for their respective UI elements.
+   *  DUMMY_CHAR is just a placeholder.
+   */
+
+  // Returns: UI Element
+  // The Text component on each test page containing the title of that page. We can use this to determine if a test page has loaded correctly.
+  get _testPage(): WebdriverIO.Element {
+    return By(DUMMY_CHAR);
+  }
+
+  // Returns: UI Element
+  // The primary UI element used for testing on the given test page.
+  get _primaryComponent(): WebdriverIO.Element {
+    return By(DUMMY_CHAR);
+  }
+
+  // Returns: UI Element
+  // The secondary UI element used for testing on the given test page. Often times, we'll want to set a
+  // prop on one component, and not set it on another to verify certain behaviors. This is why we have this secondary component.
+  get _secondaryComponent(): WebdriverIO.Element {
+    return By(DUMMY_CHAR);
+  }
+
+  // Returns: UI Element
+  // The button that navigates you to the component's test page.
+  get _pageButton(): WebdriverIO.Element {
+    return By(DUMMY_CHAR);
+  }
+
+  // Returns: String
+  // Returns the name of the test page. Useful for error messages (see above).
+  get _pageName(): string {
+    return DUMMY_CHAR;
+  }
+
+  // Default timeout to wait until page is displayed (10s)
+  waitForPageTimeout: number = 15000;
+}

package/src/E2E/common/{BasePage.ts → BasePage.win.ts}

@@ -1,8 +1,9 @@
 const DUMMY_CHAR = '';
 export const COMPONENT_SCROLL_COORDINATES = { x: -0, y: -100 }; // These are the offsets. Y is negative because we want the touch to move up (and thus it scrolls down)
 
-export function By(testId: string): WebdriverIO.Element {
-  return $('~' + testId);
+/* Win32/UWP-Specific Selector. We use this to get elements on the test page */
+export function By(identifier: string): WebdriverIO.Element {
+  return $('~' + identifier);
 }
 
 /* The values in this enum map to the UI components we want to test in our app. We use this to
@@ -66,9 +67,11 @@ export class BasePage {
       () => {
         return this.isPageLoaded();
       },
-      timeout ?? this.waitForPageTimeout,
-      this._pageName + ' did not render correctly. Please see /errorShots of the first failed test for more information.',
-      1000,
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: this._pageName + ' did not render correctly. Please see /errorShots for more information.',
+        interval: 1000,
+      },
     );
   }
 
@@ -78,11 +81,11 @@ export class BasePage {
       () => {
         return this.isButtonInView();
       },
-      timeout ?? this.waitForPageTimeout,
-      'The button to navigate to the ' +
-        this._pageName +
-        ' was not displayed correctly. Please see /errorShots of the first failed test for more information.',
-      1000,
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: 'Could not find the button to navigate to ' + this._pageName + '. Please see /errorShots for more information.',
+        interval: 1000,
+      },
     );
   }
 
@@ -92,9 +95,12 @@ export class BasePage {
       () => {
         return this._primaryComponent.isDisplayed();
       },
-      timeout ?? this.waitForPageTimeout,
-      'The primary UI element for testing did not display correctly. Please see /errorShots of the first failed test for more information.',
-      1000,
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg:
+          'The primary UI element for testing did not display correctly. Please see /errorShots of the first failed test for more information.',
+        interval: 1000,
+      },
     );
   }
 
@@ -112,9 +118,11 @@ export class BasePage {
       () => {
         return condition();
       },
-      timeout ?? this.waitForPageTimeout,
-      errorMsg ?? 'Error. Please see /errorShots and logs for more information.',
-      1000,
+      {
+        timeout: timeout ?? this.waitForPageTimeout,
+        timeoutMsg: errorMsg ?? 'Error. Please see /errorShots and logs for more information.',
+        interval: 1000,
+      },
     );
   }