@fluentui-react-native/tester 0.82.8 → 0.82.11

package/lib-commonjs/testPages.windows.js.map

@@ -1 +1 @@
-{"version":3,"file":"testPages.windows.js","sourceRoot":"","sources":["../src/testPages.windows.ts"],"names":[],"mappings":";;;AAAA,kDAA6E;AAC7E,kDAA6E;AAC7E,gDAAmE;AACnE,oDAAgF;AAChF,sDAAmF;AACnF,2HAA2H;AAC3H,8CAAuE;AACvE,oDAAgF;AAChF,4DAA4F;AAC5F,wDAAsF;AACtF,wDAAsF;AACtF,8CAAuE;AACvE,gDAA0E;AAC1E,8CAAuE;AACvE,sEAA4G;AAC5G,kDAA2E;AAC3E,sEAA4G;AAC5G,wEAA+G;AAElG,QAAA,KAAK,GAAG;IACnB;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,yCAAqB;QAChC,QAAQ,EAAE,sDAAkC;KAC7C;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,mBAAU;QACrB,QAAQ,EAAE,+BAAsB;KACjC;IACD;QACE,IAAI,EAAE,YAAY;QAClB,SAAS,EAAE,iBAAS;QACpB,QAAQ,EAAE,sBAAc;KACzB;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,mBAAU;QACrB,QAAQ,EAAE,+BAAsB;KACjC;IACD;QACE,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,qBAAW;QACtB,QAAQ,EAAE,iCAAuB;KAClC;IACD;QACE,IAAI,EAAE,gBAAgB;QACtB,SAAS,EAAE,yBAAa;QACxB,QAAQ,EAAE,qCAAyB;KACpC;IACD,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,eAAQ,EAAE,QAAQ,EAAE,2BAAoB,EAAE;IAC1E;QACE,IAAI,EAAE,gBAAgB;QACtB,SAAS,EAAE,yBAAa;QACxB,QAAQ,EAAE,qCAAyB;KACpC;IACD,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,eAAQ,EAAE,QAAQ,EAAE,2BAAoB,EAAE;IAC1E;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,uCAAoB;QAC/B,QAAQ,EAAE,oDAAiC;KAC5C;IACD,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAS,EAAE,QAAQ,EAAE,6BAAqB,EAAE;IAC7E;QACE,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,6BAAe;QAC1B,QAAQ,EAAE,yCAA2B;KACtC;IACD;QACE,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,qBAAW;QACtB,QAAQ,EAAE,iCAAuB;KAClC;IACD;QACE,IAAI,EAAE,eAAe;QACrB,SAAS,EAAE,uBAAY;QACvB,QAAQ,EAAE,mCAAwB;KACnC;IACD,iEAAiE;IACjE,IAAI;IACJ,mCAAmC;IACnC,yCAAyC;IACzC,qDAAqD;IACrD,KAAK;IACL;QACE,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,eAAQ;QACnB,QAAQ,EAAE,2BAAoB;KAC/B;IACD;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,uCAAoB;QAC/B,QAAQ,EAAE,oDAAiC;KAC5C;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,kBAAS;QACpB,QAAQ,EAAE,8BAAqB;KAChC;IACD,6DAA6D;IAC7D,IAAI;IACJ,2BAA2B;IAC3B,6BAA6B;IAC7B,wCAAwC;IACxC,KAAK;CACN,CAAC"}
+{"version":3,"file":"testPages.windows.js","sourceRoot":"","sources":["../src/testPages.windows.ts"],"names":[],"mappings":";;;AAAA,kDAA6E;AAC7E,kDAA6E;AAC7E,gDAA0E;AAC1E,oDAAgF;AAChF,sDAAmF;AACnF,2HAA2H;AAC3H,8CAAuE;AACvE,oDAAgF;AAChF,4DAA4F;AAC5F,wDAAsF;AACtF,wDAAsF;AACtF,8CAAuE;AACvE,gDAA0E;AAC1E,8CAAuE;AACvE,sEAA4G;AAC5G,kDAA2E;AAC3E,sEAA4G;AAC5G,wEAA+G;AAElG,QAAA,KAAK,GAAG;IACnB;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,yCAAqB;QAChC,QAAQ,EAAE,sDAAkC;KAC7C;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,mBAAU;QACrB,QAAQ,EAAE,+BAAsB;KACjC;IACD;QACE,IAAI,EAAE,YAAY;QAClB,SAAS,EAAE,iBAAS;QACpB,QAAQ,EAAE,6BAAqB;KAChC;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,mBAAU;QACrB,QAAQ,EAAE,+BAAsB;KACjC;IACD;QACE,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,qBAAW;QACtB,QAAQ,EAAE,iCAAuB;KAClC;IACD;QACE,IAAI,EAAE,gBAAgB;QACtB,SAAS,EAAE,yBAAa;QACxB,QAAQ,EAAE,qCAAyB;KACpC;IACD,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,eAAQ,EAAE,QAAQ,EAAE,2BAAoB,EAAE;IAC1E;QACE,IAAI,EAAE,gBAAgB;QACtB,SAAS,EAAE,yBAAa;QACxB,QAAQ,EAAE,qCAAyB;KACpC;IACD,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,eAAQ,EAAE,QAAQ,EAAE,2BAAoB,EAAE;IAC1E;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,uCAAoB;QAC/B,QAAQ,EAAE,oDAAiC;KAC5C;IACD,EAAE,IAAI,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAS,EAAE,QAAQ,EAAE,6BAAqB,EAAE;IAC7E;QACE,IAAI,EAAE,kBAAkB;QACxB,SAAS,EAAE,6BAAe;QAC1B,QAAQ,EAAE,yCAA2B;KACtC;IACD;QACE,IAAI,EAAE,cAAc;QACpB,SAAS,EAAE,qBAAW;QACtB,QAAQ,EAAE,iCAAuB;KAClC;IACD;QACE,IAAI,EAAE,eAAe;QACrB,SAAS,EAAE,uBAAY;QACvB,QAAQ,EAAE,mCAAwB;KACnC;IACD,iEAAiE;IACjE,IAAI;IACJ,mCAAmC;IACnC,yCAAyC;IACzC,qDAAqD;IACrD,KAAK;IACL;QACE,IAAI,EAAE,WAAW;QACjB,SAAS,EAAE,eAAQ;QACnB,QAAQ,EAAE,2BAAoB;KAC/B;IACD;QACE,IAAI,EAAE,wBAAwB;QAC9B,SAAS,EAAE,uCAAoB;QAC/B,QAAQ,EAAE,oDAAiC;KAC5C;IACD;QACE,IAAI,EAAE,aAAa;QACnB,SAAS,EAAE,kBAAS;QACpB,QAAQ,EAAE,8BAAqB;KAChC;IACD,6DAA6D;IAC7D,IAAI;IACJ,2BAA2B;IAC3B,6BAA6B;IAC7B,wCAAwC;IACxC,KAAK;CACN,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/tester",
-  "version": "0.82.8",
+  "version": "0.82.11",
   "description": "A test app to test FluentUI React Native Components during development",
   "license": "MIT",
   "author": "Microsoft <fluentuinativeowners@microsoft.com>",
@@ -37,8 +37,8 @@
   "dependencies": {
     "@fluentui-react-native/android-theme": ">=0.11.0 <1.0.0",
     "@fluentui-react-native/apple-theme": ">=0.13.2 <1.0.0",
-    "@fluentui-react-native/avatar": "^1.1.30",
-    "@fluentui-react-native/badge": ">=0.1.15 <1.0.0",
+    "@fluentui-react-native/avatar": "^1.1.32",
+    "@fluentui-react-native/badge": ">=0.1.17 <1.0.0",
     "@fluentui-react-native/button": ">=0.24.13 <1.0.0",
     "@fluentui-react-native/default-theme": ">=0.14.0 <1.0.0",
     "@fluentui-react-native/experimental-activity-indicator": ">=0.6.0 <1.0.0",
@@ -58,7 +58,7 @@
     "@fluentui-react-native/menu": "^1.0.22",
     "@fluentui-react-native/notification": "0.11.4",
     "@fluentui-react-native/stack": ">=0.7.2 <1.0.0",
-    "@fluentui-react-native/switch": "^0.2.0",
+    "@fluentui-react-native/switch": "^0.3.0",
     "@fluentui-react-native/text": ">=0.13.0 <1.0.0",
     "@fluentui-react-native/theme": ">=0.7.0 <1.0.0",
     "@fluentui-react-native/theme-types": ">=0.18.0 <1.0.0",

package/src/E2E/Badge/pages/BasicBadgePageObject.ts

@@ -0,0 +1,40 @@
+import {
+  BADGE_TESTPAGE,
+  HOMEPAGE_BADGE_BUTTON,
+  BADGE_TEST_COMPONENT,
+  BADGE_SECONDARY_TEST_COMPONENT,
+} from '../../../TestComponents/Badge/consts';
+import { BasePage, By } from '../../common/BasePage.win';
+
+export const enum BadgeComponentSelector {
+  PrimaryComponent, //this._primaryComponent
+  SecondaryComponent, //this._secondaryComponent
+}
+class BasicBadgePageObject extends BasePage {
+  getPrimaryComponentAttribute(attribute: string): string {
+    return this._primaryComponent.getAttribute(attribute);
+  }
+  getSecondaryComponentAttribute(attribute: string): string {
+    return this._secondaryComponent.getAttribute(attribute);
+  }
+  /*****************************************/
+  /**************** Getters ****************/
+  /*****************************************/
+  get _testPage() {
+    return By(BADGE_TESTPAGE);
+  }
+
+  get _pageButton() {
+    return By(HOMEPAGE_BADGE_BUTTON);
+  }
+
+  get _primaryComponent() {
+    return By(BADGE_TEST_COMPONENT);
+  }
+
+  get _secondaryComponent() {
+    return By(BADGE_SECONDARY_TEST_COMPONENT);
+  }
+}
+
+export default new BasicBadgePageObject();

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

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

package/src/E2E/Switch/pages/SwitchPageObject.ts

@@ -1,10 +1,17 @@
-import { SWITCH_TESTPAGE, SWITCH_TEST_COMPONENT, HOMEPAGE_SWITCH_BUTTON, SWITCH_ON_PRESS } from '../../../TestComponents/Switch/consts';
+import {
+  SWITCH_TESTPAGE,
+  SWITCH_TEST_COMPONENT,
+  SWITCH_NO_A11Y_LABEL_COMPONENT,
+  HOMEPAGE_SWITCH_BUTTON,
+  SWITCH_ON_PRESS,
+} from '../../../TestComponents/Switch/consts';
 import { BasePage, By } from '../../common/BasePage.win';
 
 /* This enum gives the spec file an EASY way to interact with SPECIFIC UI elements on the page.
  * The spec file should import this enum and use it when wanting to interact with different elements on the page. */
 export const enum SwitchComponentSelector {
   PrimaryComponent, //this._primaryComponent
+  SecondaryComponent, // this._secondaryComponent
 }
 
 class SwitchPageObject extends BasePage {
@@ -59,6 +66,8 @@ class SwitchPageObject extends BasePage {
   getButtonSelector(switchSelector?: SwitchComponentSelector): WebdriverIO.Element {
     if (switchSelector == SwitchComponentSelector.PrimaryComponent) {
       return this._primaryComponent;
+    } else if (switchSelector === SwitchComponentSelector.SecondaryComponent) {
+      return this._secondaryComponent;
     }
     return this._primaryComponent;
   }
@@ -78,6 +87,10 @@ class SwitchPageObject extends BasePage {
     return By(SWITCH_TEST_COMPONENT);
   }
 
+  get _secondaryComponent() {
+    return By(SWITCH_NO_A11Y_LABEL_COMPONENT);
+  }
+
   get _pageButton() {
     return By(HOMEPAGE_SWITCH_BUTTON);
   }

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

@@ -1,6 +1,9 @@
 import NavigateAppPage from '../../common/NavigateAppPage.win';
-import SwitchPageObject, { SwitchComponentSelector } from '../pages/SwitchPageObject';
+import SwitchPageObject from '../pages/SwitchPageObject';
+import { SwitchComponentSelector } from '../pages/SwitchPageObject';
+import { ComponentSelector } from '../../common/BasePage.win';
 import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT, BUTTON_A11Y_ROLE, Keys } from '../../common/consts';
+import { SWITCH_TEST_COMPONENT_LABEL, SWITCH_ACCESSIBILITY_LABEL } from '../../../TestComponents/Switch/consts';
 
 // Before testing begins, allow up to 60 seconds for app to open
 describe('Switch Testing Initialization', function () {
@@ -34,6 +37,16 @@ describe('Switch Accessibility Testing', () => {
     expect(SwitchPageObject.getAccessibilityRole()).toEqual(BUTTON_A11Y_ROLE);
     expect(SwitchPageObject.didAssertPopup()).toBeFalsy(SwitchPageObject.ERRORMESSAGE_ASSERT);
   });
+
+  it('Switch - Set accessibilityLabel', () => {
+    expect(SwitchPageObject.getAccessibilityLabel(ComponentSelector.Primary)).toEqual(SWITCH_ACCESSIBILITY_LABEL);
+    expect(SwitchPageObject.didAssertPopup()).toBeFalsy(SwitchPageObject.ERRORMESSAGE_ASSERT);
+  });
+
+  it('Switch - Do not set accessibilityLabel -> Default to Switch label', () => {
+    expect(SwitchPageObject.getAccessibilityLabel(ComponentSelector.Secondary)).toEqual(SWITCH_TEST_COMPONENT_LABEL);
+    expect(SwitchPageObject.didAssertPopup()).toBeFalsy(SwitchPageObject.ERRORMESSAGE_ASSERT);
+  });
 });
 
 describe('Switch Functional Testing', () => {

package/src/E2E/common/NavigateAppPage.win.ts

@@ -1,5 +1,6 @@
 import { HOMEPAGE_ACTIVITY_INDICATOR_BUTTON } from '../../TestComponents/ActivityIndicator/consts';
 import { HOMEPAGE_AVATAR_BUTTON } from '../../TestComponents/Avatar/consts';
+import { HOMEPAGE_BADGE_BUTTON } from '../../TestComponents/Badge/consts';
 import { HOMEPAGE_CHECKBOX_BUTTON } from '../../TestComponents/Checkbox/consts';
 import { HOMEPAGE_CHECKBOX_EXPERIMENTAL_BUTTON } from '../../TestComponents/CheckboxExperimental/consts';
 import { HOMEPAGE_BUTTON_BUTTON } from '../../TestComponents/Button/consts';
@@ -38,6 +39,10 @@ class NavigateAppPage extends BasePage {
     this.avatarPage.click();
   }
 
+  clickAndGoToBadgePage() {
+    this.badgePage.click();
+  }
+
   clickAndGoToButtonPage() {
     this.buttonPage.click();
   }
@@ -158,6 +163,10 @@ class NavigateAppPage extends BasePage {
     return By(HOMEPAGE_AVATAR_BUTTON);
   }
 
+  private get badgePage() {
+    return By(HOMEPAGE_BADGE_BUTTON);
+  }
+
   private get buttonPage() {
     return By(HOMEPAGE_BUTTON_BUTTON);
   }

package/src/TestComponents/Badge/E2EBadgeTest.tsx

@@ -0,0 +1,15 @@
+import { Badge } from '@fluentui-react-native/badge';
+import * as React from 'react';
+import { View } from 'react-native';
+import { BADGE_TEST_COMPONENT, BADGE_SECONDARY_TEST_COMPONENT } from './consts';
+
+export const E2EBadgeTest: React.FunctionComponent = () => {
+  return (
+    <View>
+      <Badge testID={BADGE_TEST_COMPONENT} appearance="outline" size="extraLarge" color="success" shape="square">
+        Basic Badge
+      </Badge>
+      <Badge testID={BADGE_SECONDARY_TEST_COMPONENT}>Default Badge</Badge>
+    </View>
+  );
+};

package/src/TestComponents/Badge/consts.ts

@@ -1,2 +1,5 @@
-export const HOMEPAGE_BADGE = 'Homepage_Badge_Button';
+export const HOMEPAGE_BADGE_BUTTON = 'Homepage_Badge_Button';
 export const BADGE_TESTPAGE = 'Badge_TestPage';
+
+export const BADGE_TEST_COMPONENT = 'BADGE_TEST_COMPONENT';
+export const BADGE_SECONDARY_TEST_COMPONENT = 'BADGE_SECONDARY_TEST_COMPONENT';

package/src/TestComponents/Switch/E2ESwitchTest.tsx

@@ -3,7 +3,13 @@ import { Stack } from '@fluentui-react-native/stack';
 import { Switch } from '@fluentui-react-native/switch';
 import { Text } from 'react-native';
 import { stackStyle } from '../Common/styles';
-import { SWITCH_TEST_COMPONENT, SWITCH_ON_PRESS } from './consts';
+import {
+  SWITCH_TEST_COMPONENT,
+  SWITCH_ACCESSIBILITY_LABEL,
+  SWITCH_NO_A11Y_LABEL_COMPONENT,
+  SWITCH_TEST_COMPONENT_LABEL,
+  SWITCH_ON_PRESS,
+} from './consts';
 
 export const E2ESwitchTest: React.FunctionComponent = () => {
   const [switchPressed, setSwitchSwitchPressed] = React.useState(false);
@@ -17,8 +23,9 @@ export const E2ESwitchTest: React.FunctionComponent = () => {
 
   return (
     <Stack style={stackStyle}>
-      <Switch testID={SWITCH_TEST_COMPONENT} label={'Switch Test'} onChange={onToggle} />
+      <Switch testID={SWITCH_TEST_COMPONENT} label={'Switch Test'} onChange={onToggle} accessibilityLabel={SWITCH_ACCESSIBILITY_LABEL} />
       {switchPressed ? <Text testID={SWITCH_ON_PRESS}>Switch Toggled On</Text> : null}
+      <Switch label={SWITCH_TEST_COMPONENT_LABEL} testID={SWITCH_NO_A11Y_LABEL_COMPONENT} />
     </Stack>
   );
 };

package/src/TestComponents/Switch/consts.ts

@@ -1,8 +1,12 @@
 export const HOMEPAGE_SWITCH_BUTTON = 'Homepage_Switch_Button';
 export const SWITCH_TESTPAGE = 'Switch_TestPage';
 
-/* Text Switch 1 */
-export const SWITCH_TEST_COMPONENT = 'Switch_Test_Component';
+/* Test Switch 1 */
+export const SWITCH_TEST_COMPONENT = 'Switch_Test_Component'; // A component on each specific test page
 export const SWITCH_ACCESSIBILITY_LABEL = 'E2E testing Switch accessibility label';
 
-export const SWITCH_ON_PRESS = 'Switch_On_Press';
+/* Test Switch 2 */
+export const SWITCH_NO_A11Y_LABEL_COMPONENT = 'Switch_No_A11y_label_Component'; // A component on each specific test page
+export const SWITCH_TEST_COMPONENT_LABEL = 'Test Switch2 - No Accessibility Label';
+
+export const SWITCH_ON_PRESS = 'Switch_On_Press'; // For testing the press functionality on a Switch

package/src/testPages.android.ts

@@ -1,6 +1,6 @@
 import { TestDescription } from './TestComponents';
 import { AvatarTest, HOMEPAGE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './TestComponents/Callout';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
@@ -38,7 +38,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.ios.ts

@@ -1,6 +1,6 @@
 import { TestDescription } from './TestComponents';
 import { AvatarTest, NativeAvatarTest, HOMEPAGE_AVATAR_BUTTON, HOMEPAGE_NATIVE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
 import { ExperimentalCheckboxTest, HOMEPAGE_CHECKBOX_EXPERIMENTAL_BUTTON } from './TestComponents/CheckboxExperimental';
@@ -41,7 +41,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.macos.ts

@@ -1,6 +1,6 @@
 import { TestDescription } from './TestComponents';
 import { AvatarTest, NativeAvatarTest, HOMEPAGE_AVATAR_BUTTON, HOMEPAGE_NATIVE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './TestComponents/Callout';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
@@ -47,7 +47,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.ts

@@ -1,6 +1,6 @@
 import { TestDescription } from './TestComponents';
 import { NativeAvatarTest, HOMEPAGE_NATIVE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
 import { FocusTrapTest, HOMEPAGE_FOCUSTRAPZONE_BUTTON } from './TestComponents/FocusTrapZone';
@@ -43,7 +43,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.web.ts

@@ -1,6 +1,6 @@
 import { TestDescription } from './TestComponents';
 import { AvatarTest, HOMEPAGE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
 import { HOMEPAGE_LINK_BUTTON, LinkTest } from './TestComponents/Link';
@@ -29,7 +29,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.win32.ts

@@ -1,5 +1,5 @@
 import { AvatarTest, HOMEPAGE_AVATAR_BUTTON } from './TestComponents/Avatar';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
 import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './TestComponents/Callout';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
@@ -45,7 +45,7 @@ export const tests: TestDescription[] = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',

package/src/testPages.windows.ts

@@ -1,6 +1,6 @@
 import { AvatarTest, HOMEPAGE_AVATAR_BUTTON } from './TestComponents/Avatar';
 import { ButtonTest, HOMEPAGE_BUTTON_BUTTON } from './TestComponents/Button';
-import { BadgeTest, HOMEPAGE_BADGE } from './TestComponents/Badge';
+import { BadgeTest, HOMEPAGE_BADGE_BUTTON } from './TestComponents/Badge';
 import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './TestComponents/Callout';
 import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './TestComponents/Checkbox';
 // import { HOMEPAGE_CHECKBOX_EXPERIMENTAL_BUTTON, ExperimentalCheckboxTest } from './TestComponents/CheckboxExperimental';
@@ -31,7 +31,7 @@ export const tests = [
   {
     name: 'Badge Test',
     component: BadgeTest,
-    testPage: HOMEPAGE_BADGE,
+    testPage: HOMEPAGE_BADGE_BUTTON,
   },
   {
     name: 'Button Test',