@fluentui-react-native/tester 0.52.1 → 0.53.2

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

@@ -13,7 +13,7 @@ import {
 describe('RadioGroup/RadioButton Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to RadioGroup test page', () => {
@@ -25,7 +25,8 @@ describe('RadioGroup/RadioButton Testing Initialization', function () {
     NavigateAppPage.clickAndGoToRadioGroupPage();
     RadioGroupPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(RadioGroupPageObject.isPageLoaded()).toBeTruthy();
+    expect(RadioGroupPageObject.isPageLoaded()).toBeTruthy(RadioGroupPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });
 
@@ -38,26 +39,32 @@ describe('RadioGroup/RadioButton Accessibility Testing', () => {
 
   it("Validate RadioGroup's accessibilityRole is correct", () => {
     expect(RadioGroupPageObject.getAccessibilityRole()).toEqual(RADIOGROUP_A11Y_ROLE);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it("Validate RadioButton's accessibilityRole is correct", () => {
     expect(RadioGroupPageObject.getRadioButtonAccesibilityRole()).toEqual(RADIOBUTTON_A11Y_ROLE);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('RadioGroup - Set accessibilityLabel', () => {
     expect(RadioGroupPageObject.getAccessibilityLabel(ComponentSelector.Primary)).toEqual(RADIOGROUP_ACCESSIBILITY_LABEL);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('RadioGroup - Do not set accessibilityLabel -> Default to RadioGroup label', () => {
     expect(RadioGroupPageObject.getAccessibilityLabel(ComponentSelector.Secondary)).toEqual(RADIOGROUP_TEST_COMPONENT_LABEL);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('RadioButton - Set accessibilityLabel', () => {
     expect(RadioGroupPageObject.getRBAccessibilityLabel(RadioButtonSelector.First)).toEqual(FIRST_RADIO_BUTTON_ACCESSIBILITY_LABEL);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('RadioButton - Do not set accessibilityLabel -> Default to RadioButton label', () => {
     expect(RadioGroupPageObject.getRBAccessibilityLabel(RadioButtonSelector.Second)).toEqual(SECOND_RADIO_BUTTON_LABEL);
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 });
 
@@ -80,6 +87,7 @@ describe('RadioGroup Functional Testing', () => {
 
     /* Validate the RadioButton is selected */
     expect(RadioGroupPageObject.isRadioButtonSelected(RadioButtonSelector.Second)).toBeTruthy();
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('Keyboard to RadioButton and check for Selection state', () => {
@@ -89,6 +97,7 @@ describe('RadioGroup Functional Testing', () => {
 
     /* Validate the RadioButton is selected */
     expect(RadioGroupPageObject.isRadioButtonSelected(RadioButtonSelector.Second)).toBeTruthy();
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it("Keyboard to DISABLED RadioButton and validate it doesn't get selected", () => {
@@ -98,5 +107,6 @@ describe('RadioGroup Functional Testing', () => {
 
     /* Validate the RadioButton is selected */
     expect(RadioGroupPageObject.isRadioButtonSelected(RadioButtonSelector.Fourth)).toBeTruthy();
+    expect(RadioGroupPageObject.didAssertPopup()).toBeFalsy(RadioGroupPageObject.ERRORMESSAGE_ASSERT);
   });
 });

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

@@ -6,7 +6,7 @@ import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 describe('Separator Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Separator test page', () => {
@@ -18,6 +18,7 @@ describe('Separator Testing Initialization', function () {
     NavigateAppPage.clickAndGoToSeparatorPage();
     SeparatorPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(SeparatorPageObject.isPageLoaded()).toBeTruthy();
+    expect(SeparatorPageObject.isPageLoaded()).toBeTruthy(SeparatorPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(SeparatorPageObject.didAssertPopup()).toBeFalsy(SeparatorPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });

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

@@ -6,7 +6,7 @@ import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 describe('Shimmer Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Shimmer test page', () => {
@@ -18,6 +18,7 @@ describe('Shimmer Testing Initialization', function () {
     NavigateAppPage.clickAndGoToShimmerPage();
     ShimmerPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(ShimmerPageObject.isPageLoaded()).toBeTruthy();
+    expect(ShimmerPageObject.isPageLoaded()).toBeTruthy(ShimmerPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(ShimmerPageObject.didAssertPopup()).toBeFalsy(ShimmerPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });

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

@@ -6,7 +6,7 @@ import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 describe('Svg Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Svg test page', () => {
@@ -18,6 +18,7 @@ describe('Svg Testing Initialization', function () {
     NavigateAppPage.clickAndGoToSvgPage();
     SvgPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(SvgPageObject.isPageLoaded()).toBeTruthy();
+    expect(SvgPageObject.isPageLoaded()).toBeTruthy(SvgPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(SvgPageObject.didAssertPopup()).toBeFalsy(SvgPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });

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

@@ -6,7 +6,7 @@ import { TAB_A11Y_ROLE, BOOT_APP_TIMEOUT, PAGE_TIMEOUT, TABITEM_A11Y_ROLE, Keys
 describe('Tabs Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Tabs test page', () => {
@@ -18,7 +18,8 @@ describe('Tabs Testing Initialization', function () {
     NavigateAppPage.clickAndGoToTabsPage();
     TabsPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(TabsPageObject.isPageLoaded()).toBeTruthy();
+    expect(TabsPageObject.isPageLoaded()).toBeTruthy(TabsPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(TabsPageObject.didAssertPopup()).toBeFalsy(TabsPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });
 
@@ -31,10 +32,12 @@ describe('Tabs Accessibility Testing', () => {
 
   it("Validate Tab's accessibilityRole is correct", () => {
     expect(TabsPageObject.getAccessibilityRole()).toEqual(TAB_A11Y_ROLE);
+    expect(TabsPageObject.didAssertPopup()).toBeFalsy(TabsPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it("Validate TabItem's accessibilityRole is correct", () => {
     expect(TabsPageObject.getTabItemAccesibilityRole(TabItemSelector.First)).toEqual(TABITEM_A11Y_ROLE);
+    expect(TabsPageObject.didAssertPopup()).toBeFalsy(TabsPageObject.ERRORMESSAGE_ASSERT);
   });
 });
 
@@ -53,6 +56,7 @@ describe('Tabs Functional Tests', () => {
     TabsPageObject.waitForTabsItemsToOpen(TabItemSelector.Second, PAGE_TIMEOUT);
 
     expect(TabsPageObject.didTabItemContentLoad(TabItemSelector.Second)).toBeTruthy();
+    expect(TabsPageObject.didAssertPopup()).toBeFalsy(TabsPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('Keyboarding: Arrow Navigation: Right -> Down -> Left -> Up -> Validate the correct TabItem content is shown', () => {
@@ -79,5 +83,6 @@ describe('Tabs Functional Tests', () => {
     TabsPageObject.waitForTabsItemsToOpen(TabItemSelector.First, PAGE_TIMEOUT);
 
     expect(TabsPageObject.didTabItemContentLoad(TabItemSelector.First)).toBeTruthy();
+    expect(TabsPageObject.didAssertPopup()).toBeFalsy(TabsPageObject.ERRORMESSAGE_ASSERT);
   });
 });

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

@@ -6,7 +6,7 @@ import { TAB_A11Y_ROLE, TABITEM_A11Y_ROLE, BOOT_APP_TIMEOUT, PAGE_TIMEOUT } from
 describe('Experimental Tabs Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Experimental Tabs test page', () => {
@@ -18,7 +18,8 @@ describe('Experimental Tabs Testing Initialization', function () {
     NavigateAppPage.clickAndGoToExperimentalTabsPage();
     ExperimentalTabsPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(ExperimentalTabsPageObject.isPageLoaded()).toBeTruthy();
+    expect(ExperimentalTabsPageObject.isPageLoaded()).toBeTruthy(ExperimentalTabsPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(ExperimentalTabsPageObject.didAssertPopup()).toBeFalsy(ExperimentalTabsPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });
 
@@ -26,12 +27,16 @@ describe('Experimental Tabs Accessibility Testing', () => {
   it("Validate Experimental Tab's accessibilityRole is correct", () => {
     ExperimentalTabsPageObject.scrollToTestElement();
     ExperimentalTabsPageObject.waitForPrimaryElementDisplayed(PAGE_TIMEOUT);
+
     expect(ExperimentalTabsPageObject.getAccessibilityRole()).toEqual(TAB_A11Y_ROLE);
+    expect(ExperimentalTabsPageObject.didAssertPopup()).toBeFalsy(ExperimentalTabsPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it("Validate Experimental TabItem's accessibilityRole is correct", () => {
     ExperimentalTabsPageObject.scrollToTestElement();
     ExperimentalTabsPageObject.waitForPrimaryElementDisplayed(PAGE_TIMEOUT);
+
     expect(ExperimentalTabsPageObject.getTabItemAccesibilityRole()).toEqual(TABITEM_A11Y_ROLE);
+    expect(ExperimentalTabsPageObject.didAssertPopup()).toBeFalsy(ExperimentalTabsPageObject.ERRORMESSAGE_ASSERT);
   });
 });

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

@@ -8,7 +8,7 @@ import { TEXT_ACCESSIBILITY_LABEL, TEXT_COMPONENT_CONTENT } from '../../../Fluen
 describe('Text Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Text test page', () => {
@@ -20,7 +20,8 @@ describe('Text Testing Initialization', function () {
     NavigateAppPage.clickAndGoToTextPage();
     TextPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(TextPageObject.isPageLoaded()).toBeTruthy();
+    expect(TextPageObject.isPageLoaded()).toBeTruthy(TextPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(TextPageObject.didAssertPopup()).toBeFalsy(TextPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });
 
@@ -32,13 +33,16 @@ describe('Text Accessibility Testing', () => {
 
   it('Text - Validate accessibilityRole is correct', () => {
     expect(TextPageObject.getAccessibilityRole()).toEqual(TEXT_A11Y_ROLE);
+    expect(TextPageObject.didAssertPopup()).toBeFalsy(TextPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('Text - Set accessibilityLabel', () => {
     expect(TextPageObject.getAccessibilityLabel(ComponentSelector.Primary)).toEqual(TEXT_ACCESSIBILITY_LABEL);
+    expect(TextPageObject.didAssertPopup()).toBeFalsy(TextPageObject.ERRORMESSAGE_ASSERT);
   });
 
   it('Text - Do not accessibilityLabel -> Default to content', () => {
     expect(TextPageObject.getAccessibilityLabel(ComponentSelector.Secondary)).toEqual(TEXT_COMPONENT_CONTENT);
+    expect(TextPageObject.didAssertPopup()).toBeFalsy(TextPageObject.ERRORMESSAGE_ASSERT);
   });
 });

package/src/E2E/TextExperimental/specs/ExperimentalText.spec.win.ts

@@ -6,7 +6,7 @@ import { TEXT_A11Y_ROLE, PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/con
 describe('Experimental Text Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Experimental Text test page', () => {
@@ -18,7 +18,8 @@ describe('Experimental Text Testing Initialization', function () {
     NavigateAppPage.clickAndGoToExperimentalTextPage();
     ExperimentalTextPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(ExperimentalTextPageObject.isPageLoaded()).toBeTruthy();
+    expect(ExperimentalTextPageObject.isPageLoaded()).toBeTruthy(ExperimentalTextPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(ExperimentalTextPageObject.didAssertPopup()).toBeFalsy(ExperimentalTextPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });
 
@@ -26,6 +27,8 @@ describe('Experimental Text Accessibility Testing', () => {
   it('Text - Validate accessibilityRole is correct', () => {
     ExperimentalTextPageObject.scrollToTestElement();
     ExperimentalTextPageObject.waitForPrimaryElementDisplayed(PAGE_TIMEOUT);
+
     expect(ExperimentalTextPageObject.getAccessibilityRole()).toEqual(TEXT_A11Y_ROLE);
+    expect(ExperimentalTextPageObject.didAssertPopup()).toBeFalsy(ExperimentalTextPageObject.ERRORMESSAGE_ASSERT);
   });
 });

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

@@ -6,7 +6,7 @@ import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 describe('Theme Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Theme test page', () => {
@@ -18,6 +18,7 @@ describe('Theme Testing Initialization', function () {
     NavigateAppPage.clickAndGoToThemePage();
     ThemePageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(ThemePageObject.isPageLoaded()).toBeTruthy();
+    expect(ThemePageObject.isPageLoaded()).toBeTruthy(ThemePageObject.ERRORMESSAGE_PAGELOAD);
+    expect(ThemePageObject.didAssertPopup()).toBeFalsy(ThemePageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });

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

@@ -6,7 +6,7 @@ import { PAGE_TIMEOUT, BOOT_APP_TIMEOUT } from '../../common/consts';
 describe('Tokens Testing Initialization', function () {
   it('Wait for app load', () => {
     NavigateAppPage.waitForPageDisplayed(BOOT_APP_TIMEOUT);
-    expect(NavigateAppPage.isPageLoaded()).toBeTruthy();
+    expect(NavigateAppPage.isPageLoaded()).toBeTruthy(NavigateAppPage.ERRORMESSAGE_APPLOAD);
   });
 
   it('Click and navigate to Tokens test page', () => {
@@ -18,6 +18,7 @@ describe('Tokens Testing Initialization', function () {
     NavigateAppPage.clickAndGoToTokensPage();
     TokenPageObject.waitForPageDisplayed(PAGE_TIMEOUT);
 
-    expect(TokenPageObject.isPageLoaded()).toBeTruthy();
+    expect(TokenPageObject.isPageLoaded()).toBeTruthy(TokenPageObject.ERRORMESSAGE_PAGELOAD);
+    expect(TokenPageObject.didAssertPopup()).toBeFalsy(TokenPageObject.ERRORMESSAGE_ASSERT); // Ensure no asserts popped up
   });
 });

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

@@ -131,6 +131,23 @@ export class BasePage {
     );
   }
 
+  /* FUNCTIONALITY: Determines if an Assert has fired. True if yes; false otherwise
+   *
+   * WHY/HOW: Unfortunately, some Asserts don't take focus away from the test app. Because of this, the test execution is able
+   * to continue without realizing an assert as popped up (unless the assert is a crashing one).
+   *
+   * In order to detect an assert, this function gets the number of window handles currently open within the test app.
+   * Only one instance SHOULD be open at a time (the app itself). If another instance of the app is open, we know an assert dialogue
+   * has popped up. With this information, we know to fail the test.
+   *
+   * Additionally, you might think it's logical to simply place this in the afterEach() hook so it's called after every test (rather than duplicating this call in every test).
+   * Unfortunately, afterEach() is designed for setup/teardown - not for determining if a test should fail or not.
+   * */
+  didAssertPopup(): boolean {
+    // If more than 1 instance of the app is open, we know an assert dialogue popped up.
+    return browser.getWindowHandles().length > 1;
+  }
+
   /*****************************************/
   /**************** Getters ****************/
   /*****************************************/
@@ -172,6 +189,23 @@ export class BasePage {
     return DUMMY_CHAR;
   }
 
+  /****************** Error Messages ******************/
+  get ERRORMESSAGE_SUFFIX(): string {
+    return 'Please review logs and error screenshots for more information.';
+  }
+
+  get ERRORMESSAGE_APPLOAD(): string {
+    return 'The FluentTester app did not load correctly. ' + this.ERRORMESSAGE_SUFFIX;
+  }
+
+  get ERRORMESSAGE_PAGELOAD(): string {
+    return 'The ' + this._pageName + ' test page did not load correctly. ' + this.ERRORMESSAGE_SUFFIX;
+  }
+
+  get ERRORMESSAGE_ASSERT(): string {
+    return 'An assert popped up. ' + this.ERRORMESSAGE_SUFFIX;
+  }
+
   // Default timeout to wait until page is displayed (10s)
   waitForPageTimeout: number = 15000;
 }

package/src/FluentTester/TestComponents/ButtonExperimental/ButtonIconTestSection.tsx

@@ -1,11 +1,15 @@
 import { Button } from '@fluentui-react-native/experimental-button';
 import * as React from 'react';
-import { Platform, View } from 'react-native';
+import { Platform, View, StyleSheet } from 'react-native';
 import { commonTestStyles, stackStyle } from '../Common/styles';
 import { SvgIconProps } from '@fluentui-react-native/icon';
 import TestSvg from './test.svg';
 import { SvgXml } from 'react-native-svg';
 
+const styles = StyleSheet.create({
+  chevron: { paddingStart: 4 },
+});
+
 export const ButtonIconTest: React.FunctionComponent = () => {
   const fontBuiltInProps = {
     fontFamily: 'Arial',
@@ -39,12 +43,6 @@ export const ButtonIconTest: React.FunctionComponent = () => {
       >
         Icon after
       </Button>
-      {svgIconsEnabled && (
-        <Button style={commonTestStyles.vmargin} icon={{ svgSource: svgProps }}>
-          Icon Button and Chevron
-          <SvgXml xml={chevronXml} />
-        </Button>
-      )}
       <Button icon={{ fontSource: fontBuiltInProps }} style={commonTestStyles.vmargin}>
         Font icon
       </Button>
@@ -67,6 +65,14 @@ export const ButtonIconTest: React.FunctionComponent = () => {
       <Button icon={testImage} style={commonTestStyles.vmargin}>
         PNG
       </Button>
+      {svgIconsEnabled && (
+        <Button style={commonTestStyles.vmargin} icon={{ svgSource: svgProps }}>
+          Icon Button and Chevron
+          <View style={styles.chevron}>
+            <SvgXml xml={chevronXml} />
+          </View>
+        </Button>
+      )}
     </View>
   );
 };

package/src/FluentTester/TestComponents/ButtonExperimental/ButtonSizeTestSection.tsx

@@ -16,9 +16,27 @@ export const ButtonSizeTest: React.FunctionComponent = () => {
     <View style={[stackStyle, commonTestStyles.view]}>
       {svgIconsEnabled && (
         <>
-          <Button iconOnly size="small" icon={{ svgSource: svgProps }} style={commonTestStyles.vmargin} />
-          <Button iconOnly size="medium" icon={{ svgSource: svgProps }} style={commonTestStyles.vmargin} />
-          <Button iconOnly size="large" icon={{ svgSource: svgProps }} style={commonTestStyles.vmargin} />
+          <Button
+            iconOnly
+            size="small"
+            icon={{ svgSource: svgProps }}
+            accessibilityLabel="Small size button with accessibility icon"
+            style={commonTestStyles.vmargin}
+          />
+          <Button
+            iconOnly
+            size="medium"
+            icon={{ svgSource: svgProps }}
+            accessibilityLabel="Medium size button with accessibility icon"
+            style={commonTestStyles.vmargin}
+          />
+          <Button
+            iconOnly
+            size="large"
+            icon={{ svgSource: svgProps }}
+            accessibilityLabel="Large size button with accessibility icon"
+            style={commonTestStyles.vmargin}
+          />
           <Button size="small" icon={{ svgSource: svgProps }} style={commonTestStyles.vmargin}>
             Small Button with icon
           </Button>

package/src/FluentTester/TestComponents/ButtonExperimental/ToggleButtonTestSection.tsx

@@ -34,10 +34,13 @@ export const ToggleButtonTest: React.FunctionComponent = () => {
         Unchecked Default Toggle
       </ToggleButton>
       <ToggleButton appearance="primary" style={commonTestStyles.vmargin}>
-        Primary Toggle
+        Checked Primary Toggle
+      </ToggleButton>
+      <ToggleButton disabled defaultChecked appearance="primary" style={commonTestStyles.vmargin}>
+        Checked Primary Toggle Disabled
       </ToggleButton>
       <ToggleButton defaultChecked appearance="primary" style={commonTestStyles.vmargin}>
-        Primary Toggle
+        Unchecked Primary Toggle
       </ToggleButton>
       <View style={styles.row}>
         <ToggleButton appearance="subtle" onClick={onGhostClicked} checked={subtleChecked} style={commonTestStyles.vmargin}>

package/src/FluentTester/theme/CustomThemes.ts

@@ -42,7 +42,7 @@ export class TesterThemeReference extends ThemeReference {
     super(
       baseTheme,
       (parent) => applyTheme(parent, this._themeName, this.options.appearance),
-      () => applyBrand(this._themeName, this._brand),
+      (parent) => applyBrand(parent, this._themeName, this._brand),
     );
     this.baseTheme = baseTheme;
     this.options = themeOptions;

package/src/FluentTester/theme/applyBrand.ts

@@ -1,4 +1,4 @@
-import { PartialTheme } from '@fluentui-react-native/theme-types';
+import { PartialTheme, Theme } from '@fluentui-react-native/theme-types';
 import { getCurrentBrandAliasTokens } from '@fluentui-react-native/win32-theme';
 
 export type OfficeBrand = 'Default' | 'Office' | 'Word' | 'Excel' | 'Powerpoint' | 'Outlook';
@@ -123,7 +123,11 @@ const brandColors: BrandRamps = {
 
 export const brandOptions = Object.keys(brandColors).map((brand) => ({ label: brand, value: brand }));
 
-export const applyBrand = (themeName: string, currentBrand: string): PartialTheme => {
+export const applyBrand = (parent: Theme, themeName: string, currentBrand: string): PartialTheme => {
+  if (parent.name === 'HighContrast') {
+    return {};
+  }
+
   const ramp = brandColors[currentBrand];
   return ramp
     ? {