Restructuring E2E Testing (#215)
* Yarn * Adding Appium Testing - Unable to open FluentTester * Fluent Tester app is booting * Runs tests * Opnes + clicks on test pages, some tests still fail though * Simplified tsconfig * Opening pages * Commit * Removing local paths, replacing with path.resolve() * Azure-Pipeline additions * Change files * yarn lock * Fixing app command-line agrs * Pipeline Test * Pipeline changes * Testing a failed E2E scenario with CI * Finalized CI * Small Link test page update * Nit fix * PR Fixes * PR Fixes * PR Fixes * Small PR change * Small PR Fix * Nit removing './' in import statement * Delete appium.txt Not needed * Delete appium.txt * PR Fix * PR Remove comments * PR Fixes - Created BasePage * PR Change fixes * PR Fixes * Adding E2E reports to .gitignore * Delete appium.txt * New structure - Checkbox/Button test * Chaning structure of E2E Testing, taking into account we'll be adding support for iOS, Mac, UWP, Android. * Adding E2E Testing README * Removing old files * Readme fix * Updating ReadME * PR Fixes - Adding newlines * Adding new exports for constants
This commit is contained in:
Samuel Freiberg
GitHub
Родитель
d6cfb45492
Коммит
c53ef0fc65
|
|
@ -4,7 +4,7 @@ logs
|
|||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
/apps/win32/src/reports/
|
||||
/apps/win32/reports/
|
||||
|
||||
# Runtime data
|
||||
pids
|
||||
|
|
|
|||
|
|
@ -1,19 +1,17 @@
|
|||
import {
|
||||
HOMEPAGE_BUTTON_BUTTON,
|
||||
HOMEPAGE_CALLOUT_BUTTON,
|
||||
HOMEPAGE_CHECKBOX_BUTTON,
|
||||
HOMEPAGE_FOCUSTRAPZONE_BUTTON,
|
||||
HOMEPAGE_LINK_BUTTON,
|
||||
HOMEPAGE_PERSONA_BUTTON,
|
||||
HOMEPAGE_PERSONACOIN_BUTTON,
|
||||
HOMEPAGE_PRESSABLE_BUTTON,
|
||||
HOMEPAGE_RADIOGROUP_BUTTON,
|
||||
HOMEPAGE_SEPARATOR_BUTTON,
|
||||
HOMEPAGE_SVG_BUTTON,
|
||||
HOMEPAGE_TEXT_BUTTON,
|
||||
HOMEPAGE_THEME_BUTTON
|
||||
} from '../../RNTester/Consts';
|
||||
import { By } from './BasePage';
|
||||
import { HOMEPAGE_CHECKBOX_BUTTON } from '../../../RNTester/TestComponents/Checkbox/consts';
|
||||
import { HOMEPAGE_BUTTON_BUTTON } from '../../../RNTester/TestComponents/Button/consts';
|
||||
import { HOMEPAGE_CALLOUT_BUTTON } from '../../../RNTester/TestComponents/Callout/consts';
|
||||
import { HOMEPAGE_FOCUSTRAPZONE_BUTTON } from '../../../RNTester/TestComponents/FocusTrapZone/consts';
|
||||
import { HOMEPAGE_LINK_BUTTON } from '../../../RNTester/TestComponents/Link/consts';
|
||||
import { HOMEPAGE_PERSONA_BUTTON } from '../../../RNTester/TestComponents/Persona/consts';
|
||||
import { HOMEPAGE_PERSONACOIN_BUTTON } from '../../../RNTester/TestComponents/PersonaCoin/consts';
|
||||
import { HOMEPAGE_PRESSABLE_BUTTON } from '../../../RNTester/TestComponents/Pressable/consts';
|
||||
import { HOMEPAGE_RADIOGROUP_BUTTON } from '../../../RNTester/TestComponents/RadioGroup/consts';
|
||||
import { HOMEPAGE_SEPARATOR_BUTTON } from '../../../RNTester/TestComponents/Separator/consts';
|
||||
import { HOMEPAGE_SVG_BUTTON } from '../../../RNTester/TestComponents/Svg/consts';
|
||||
import { HOMEPAGE_TEXT_BUTTON } from '../../../RNTester/TestComponents/Text/consts';
|
||||
import { HOMEPAGE_THEME_BUTTON } from '../../../RNTester/TestComponents/Theme/consts';
|
||||
import { By } from '../../common/BasePage';
|
||||
|
||||
class BootTestPage {
|
||||
clickAndGoToButtonPage() {
|
||||
|
|
@ -1,16 +1,16 @@
|
|||
import BootTestPage from '../pages/BootTestPage';
|
||||
import ButtonTestPage from '../pages/ButtonTestPage';
|
||||
import CheckboxTestPage from '../pages/CheckboxTestPage';
|
||||
import CalloutTestPage from '../pages/CalloutTestPage';
|
||||
import FocusTrapZoneTestPage from '../pages/FocusTrapZonePage';
|
||||
import LinkTestPage from '../pages/LinkTestPage';
|
||||
import PersonaCoinTestPage from '../pages/PersonaCoinTestPage';
|
||||
import PersonaTestPage from '../pages/PersonaTestPage';
|
||||
import PressableTestPage from '../pages/PressableTestPage';
|
||||
import RadioGroupTestPage from '../pages/RadioGroupTestPage';
|
||||
import SeparatorTestPage from '../pages/SeparatorTestPage';
|
||||
import TextTestPage from '../pages/TextTestPage';
|
||||
import ThemeTestPage from '../pages/ThemeTestPage';
|
||||
import BootTestPage from '../pages/BootTestPage.win';
|
||||
import ButtonTestPage from '../../Button/pages/ButtonTestPage.win';
|
||||
import CheckboxTestPage from '../../Checkbox/pages/CheckboxTestPage.win';
|
||||
import CalloutTestPage from '../../Callout/pages/CalloutTestPage.win';
|
||||
import FocusTrapZoneTestPage from '../../FocusTrapZone/pages/FocusTrapZonePage.win';
|
||||
import LinkTestPage from '../../Link/pages/LinkTestPage.win';
|
||||
import PersonaCoinTestPage from '../../PersonaCoin/pages/PersonaCoinTestPage.win';
|
||||
import PersonaTestPage from '../../Persona/pages/PersonaTestPage.win';
|
||||
import PressableTestPage from '../../Pressable/pages/PressableTestPage.win';
|
||||
import RadioGroupTestPage from '../../RadioGroup/pages/RadioGroupTestPage.win';
|
||||
import SeparatorTestPage from '../../Separator/pages/SeparatorTestPage.win';
|
||||
import TextTestPage from '../../Text/pages/TextTestPage.win';
|
||||
import ThemeTestPage from '../../Theme/pages/ThemeTestPage.win';
|
||||
|
||||
describe('Click on each test page and check if it renders', function() {
|
||||
it('Button Test Page', () => {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { BUTTON_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { BUTTON_TESTPAGE } from '../../../RNTester/TestComponents/Button/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class ButtonTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { CALLOUT_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { CALLOUT_TESTPAGE } from '../../../RNTester/TestComponents/Callout/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class CalloutTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { CHECKBOX_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { CHECKBOX_TESTPAGE } from '../../../RNTester/TestComponents/Checkbox/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class CheckboxTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { FOCUSTRAPZONE_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { FOCUSTRAPZONE_TESTPAGE } from '../../../RNTester/TestComponents/FocusTrapZone/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class FocusTrapZonePage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { LINK_TESTPAGE } from '../../../RNTester/TestComponents/Link/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class LinkTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(LINK_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new LinkTestPage();
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { PERSONA_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { PERSONA_TESTPAGE } from '../../../RNTester/TestComponents/Persona/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class PersonaTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { PERSONACOIN_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { PERSONACOIN_TESTPAGE } from '../../../RNTester/TestComponents/PersonaCoin/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class PersonaCoinTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { PRESSABLE_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { PRESSABLE_TESTPAGE } from '../../../RNTester/TestComponents/Pressable/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class PressableTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
# E2E Testing Overview
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- [Node.js](https://nodejs.org/en/download/) - Version 10.19 or higher.
|
||||
- [React Native Windows Development Dependencies](https://microsoft.github.io/react-native-windows/docs/rnw-dependencies)
|
||||
- **NOTE:** Please make sure you grab all of the items listed there and the appropriate versions.
|
||||
- [WinAppDriver](https://github.com/microsoft/WinAppDriver) - Version 1.1
|
||||
- Enable [_Developer Mode_](https://docs.microsoft.com/en-us/windows/uwp/get-started/enable-your-device-for-development) in Windows settings
|
||||
|
||||
## E2E Project Structure
|
||||
|
||||
- E2E - The root E2E testing folder containing test components and their respective platform-specific page objects and spec documents.
|
||||
- reports - Each platform folder (apple, win32, windows) contains this folder that saves the test reports from Appium/WebDriverIO.
|
||||
- wdio.conf.js - Each platform folder contains this file. It's the configuration file for WebDriverIO, which also configures Appium and WinAppDriver parameters.
|
||||
|
||||
# Running E2E Tests
|
||||
|
||||
1. Install node packages, build JS
|
||||
- C:\repo> `cd fluentui-react-native`
|
||||
- C:\repo\fluentui-react-native> `yarn`
|
||||
- C:\repo\fluentui-react-native> `yarn build`
|
||||
2. Bundle the test app (pick specific platform you want to test, we'll use win32)
|
||||
- C:\repo\fluentui-react-native>`cd apps\win32`
|
||||
- C:\repo\fluentui-react-native\apps\win32> `yarn bundle`
|
||||
3. Run E2E tests
|
||||
- C:\repo\fluentui-react-native\apps\win32> `yarn run e2etest`
|
||||
|
||||
# Authoring E2E Test
|
||||
|
||||
## Create a new Page Object
|
||||
|
||||
Page Object is a design pattern which has become popular in test automation for enhancing test maintenance and reducing code duplication. A [page object](https://webdriver.io/docs/pageobjects.html) is an object-oriented class that serves as an interface to a page of you testing app. The tests then use the methods of this Page Object whenever they need to interact with the UI of that page.
|
||||
The benefit is that if the UI changes for the test page, the tests themselves don’t need to change, only the code within the page object needs to change.
|
||||
|
||||
Page Objects should be put in apps/fluent-tester/src/E2E/_ *ComponentToBeTested* _/pages/.
|
||||
|
||||
```
|
||||
// CheckboxTestPage.win.ts
|
||||
class CheckboxTestPage extends BasePage {
|
||||
|
||||
toggleCheckbox() {
|
||||
this._testPage.click();
|
||||
}
|
||||
|
||||
get _testPage() {
|
||||
return By(CHECKBOX_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new CheckboxTestPage();
|
||||
```
|
||||
|
||||
### **Selectors**
|
||||
|
||||
- In order for a Page Object to access a component from the test page, you must use [selectors](https://webdriver.io/docs/selectors.html). The WebDriver Protocol provides several selector strategies to query an element.
|
||||
|
||||
- If [testID](https://reactnative.dev/docs/picker-item#testid) is specified in React Native app for Windows, the locator strategy should choose accessibility id.
|
||||
A unique accessiblity id/testID per Window is recommended for React Native Windows E2E testing when authoring the test app and test cases.
|
||||
|
||||
- To use this, we must add a prop to our component or UI element in question called “testID”. In our test page, set the “testID” for the component, and we can then select it in our Page Object using the imported **_By_** method above from a base class.
|
||||
|
||||
## Write a Test Spec
|
||||
|
||||
The spec document is where the tests will be written. We use [Jasmine](https://jasmine.github.io/), an open-sourced testing framework for JavaScript.
|
||||
The spec document imports a page object and uses it to manipulate the UI and uses 'expect' and other Jasmine statements to ensure proper functionality.
|
||||
|
||||
Spec documents should be put in apps/fluent-tester/src/E2E/\_ _ComponentToBeTested_ /specs/.
|
||||
|
||||
```
|
||||
describe('Click on each test page and check if it renders', function() {
|
||||
it('Checkbox Test Page', () => {
|
||||
BootTestPage.clickAndGoToCheckboxPage();
|
||||
expect(CheckboxTestPage.isPageLoaded()).toBeTruthy();
|
||||
});
|
||||
});
|
||||
```
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { RADIOGROUP_TESTPAGE } from '../../../RNTester/TestComponents/RadioGroup/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class RadioGroupPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(RADIOGROUP_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new RadioGroupPage();
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { SEPARATOR_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { SEPARATOR_TESTPAGE } from '../../../RNTester/TestComponents/Separator/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class SeparatorTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { SVG_TESTPAGE } from '../../../RNTester/TestComponents/Svg/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class SvgTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(SVG_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new SvgTestPage();
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { TEXT_TESTPAGE } from '../../../RNTester/TestComponents/Text/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class TextTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(TEXT_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new TextTestPage();
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
import { THEME_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
import { THEME_TESTPAGE } from '../../../RNTester/TestComponents/Theme/consts';
|
||||
import { BasePage, By } from '../../common/BasePage';
|
||||
|
||||
class ThemeTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { LINK_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
|
||||
class LinkTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(LINK_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new LinkTestPage();
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { RADIOGROUP_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
|
||||
class RadioGroupPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(RADIOGROUP_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new RadioGroupPage();
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { SVG_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
|
||||
class SvgTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(SVG_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new SvgTestPage();
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { TEXT_TESTPAGE } from '../../RNTester/Consts';
|
||||
import { BasePage, By } from './BasePage';
|
||||
|
||||
class TextTestPage extends BasePage {
|
||||
get _testPage() {
|
||||
return By(TEXT_TESTPAGE);
|
||||
}
|
||||
}
|
||||
|
||||
export default new TextTestPage();
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
// Button Test Page
|
||||
export const HOMEPAGE_BUTTON_BUTTON = 'Homepage_Button_Button'; // Button on the homepage that navigates to the selected test page
|
||||
export const BUTTON_TESTPAGE = 'Button_TestPage'; // A component on each specific test page.
|
||||
|
||||
// Callout Test Page
|
||||
export const HOMEPAGE_CALLOUT_BUTTON = 'Homepage_Callout_Button';
|
||||
export const CALLOUT_TESTPAGE = 'Callout_TestPage';
|
||||
|
||||
// Checkbox Test Page
|
||||
export const HOMEPAGE_CHECKBOX_BUTTON = 'Homepage_Checkbox_Button';
|
||||
export const CHECKBOX_TESTPAGE = 'Checkbox_TestPage';
|
||||
|
||||
// FocusTrapZone Test Page
|
||||
export const HOMEPAGE_FOCUSTRAPZONE_BUTTON = 'Homepage_FocusTrapZone_Button';
|
||||
export const FOCUSTRAPZONE_TESTPAGE = 'FocusTrapZone_TestPage';
|
||||
|
||||
// Link Test Page
|
||||
export const HOMEPAGE_LINK_BUTTON = 'Homepage_Link_Button';
|
||||
export const LINK_TESTPAGE = 'Link_TestPage';
|
||||
|
||||
// Persona Page
|
||||
export const HOMEPAGE_PERSONA_BUTTON = 'Homepage_Persona_Button';
|
||||
export const PERSONA_TESTPAGE = 'Persona_TestPage';
|
||||
|
||||
// PersonaCoin Test Page
|
||||
export const HOMEPAGE_PERSONACOIN_BUTTON = 'Homepage_PersonaCoin_Button';
|
||||
export const PERSONACOIN_TESTPAGE = 'PersonaCoin_TestPage';
|
||||
|
||||
// Pressable Test Page
|
||||
export const HOMEPAGE_PRESSABLE_BUTTON = 'Homepage_Pressable_Button';
|
||||
export const PRESSABLE_TESTPAGE = 'Pressable_TestPage';
|
||||
|
||||
// RadioGroup Test Page
|
||||
export const HOMEPAGE_RADIOGROUP_BUTTON = 'Homepage_RadioGroup_Button';
|
||||
export const RADIOGROUP_TESTPAGE = 'RadioGroup_TestPage';
|
||||
|
||||
// Separator Test Page
|
||||
export const HOMEPAGE_SEPARATOR_BUTTON = 'Homepage_Separator_Button';
|
||||
export const SEPARATOR_TESTPAGE = 'Separator_TestPage';
|
||||
|
||||
// SVG Test Page
|
||||
export const HOMEPAGE_SVG_BUTTON = 'Homepage_Svg_Button';
|
||||
export const SVG_TESTPAGE = 'Svg_TestPage';
|
||||
|
||||
// Text Test Page
|
||||
export const HOMEPAGE_TEXT_BUTTON = 'Homepage_Text_Button';
|
||||
export const TEXT_TESTPAGE = 'Text_TestPage';
|
||||
|
||||
// Theme Test Page
|
||||
export const HOMEPAGE_THEME_BUTTON = 'Homepage_Theme_Button';
|
||||
export const THEME_TESTPAGE = 'Theme_TestPage';
|
||||
|
|
@ -2,7 +2,7 @@ import * as React from 'react';
|
|||
import { Button, IFocusable } from '@fluentui/react-native';
|
||||
import { Stack } from '@fluentui-react-native/stack';
|
||||
import { stackStyle } from '../Common/styles';
|
||||
import { BUTTON_TESTPAGE } from '../../Consts';
|
||||
import { BUTTON_TESTPAGE } from './consts';
|
||||
|
||||
export const ButtonFocusTest: React.FunctionComponent<{}> = () => {
|
||||
const [state, setState] = React.useState({
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_BUTTON_BUTTON = 'Homepage_Button_Button'; // Button on the homepage that navigates to the selected test page
|
||||
export const BUTTON_TESTPAGE = 'Button_TestPage'; // A component on each specific test page.
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './ButtonFocusTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import * as React from 'react';
|
|||
import { ScreenRect, Text, View } from 'react-native';
|
||||
import { Button, Callout, Separator } from '@fluentui/react-native';
|
||||
import { fabricTesterStyles } from '../Common/styles';
|
||||
import { CALLOUT_TESTPAGE } from '../../Consts';
|
||||
import { CALLOUT_TESTPAGE } from './consts';
|
||||
|
||||
export const CalloutTest: React.FunctionComponent<{}> = () => {
|
||||
const [showStandardCallout, setShowStandardCallout] = React.useState(false);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_CALLOUT_BUTTON = 'Homepage_Callout_Button';
|
||||
export const CALLOUT_TESTPAGE = 'Callout_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './CalloutTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Checkbox } from '@fluentui/react-native';
|
|||
import { Separator } from '@fluentui/react-native';
|
||||
import { commonTestStyles as commonStyles } from '../Common/styles';
|
||||
import { useTheme } from '@uifabricshared/theming-react-native';
|
||||
import { CHECKBOX_TESTPAGE } from '../../Consts';
|
||||
import { CHECKBOX_TESTPAGE } from './consts';
|
||||
|
||||
const CircularCheckbox = Checkbox.customize({ tokens: { borderRadius: 50 } });
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_CHECKBOX_BUTTON = 'Homepage_Checkbox_Button';
|
||||
export const CHECKBOX_TESTPAGE = 'Checkbox_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './CheckboxTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { TouchableHighlight, TouchableHighlightProps, View, ViewProps } from 're
|
|||
import { useFocusState } from '@fluentui/react-native';
|
||||
import * as React from 'react';
|
||||
import { stackStyle } from '../Common/styles';
|
||||
import { FOCUSTRAPZONE_TESTPAGE } from '../../Consts';
|
||||
import { FOCUSTRAPZONE_TESTPAGE } from './consts';
|
||||
|
||||
const trapZoneStyle: IFocusTrapZoneProps['style'] = {
|
||||
padding: 10,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_FOCUSTRAPZONE_BUTTON = 'Homepage_FocusTrapZone_Button';
|
||||
export const FOCUSTRAPZONE_TESTPAGE = 'FocusTrapZone_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './FocusTrapZoneTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { Alert } from 'react-native';
|
|||
import { Link } from '@fluentui/react-native';
|
||||
import { Stack } from '@fluentui-react-native/stack';
|
||||
import { stackStyle } from '../Common/styles';
|
||||
import { LINK_TESTPAGE } from '../../Consts';
|
||||
import { LINK_TESTPAGE } from './consts';
|
||||
import { Text, View } from 'react-native';
|
||||
import { commonTestStyles as commonStyles } from '../Common/styles';
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_LINK_BUTTON = 'Homepage_Link_Button';
|
||||
export const LINK_TESTPAGE = 'Link_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './LinkTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Separator, Text } from '@fluentui/react-native';
|
|||
import { commonTestStyles } from '../Common/styles';
|
||||
import { StandardUsage } from './StandardUsage';
|
||||
import { CustomizeUsage } from './CustomizeUsage';
|
||||
import { PERSONA_TESTPAGE } from '../../Consts';
|
||||
import { PERSONA_TESTPAGE } from './consts';
|
||||
|
||||
export const PersonaTest: React.FunctionComponent<{}> = () => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_PERSONA_BUTTON = 'Homepage_Persona_Button';
|
||||
export const PERSONA_TESTPAGE = 'Persona_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './PersonaTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Separator } from '@fluentui/react-native';
|
|||
import { StandardUsage } from './StandardUsage';
|
||||
import { CustomizeUsage } from './CustomizeUsage';
|
||||
import { commonTestStyles as commonStyles } from '../Common/styles';
|
||||
import { PERSONACOIN_TESTPAGE } from '../../Consts';
|
||||
import { PERSONACOIN_TESTPAGE } from './consts';
|
||||
|
||||
export const PersonaCoinTest: React.FunctionComponent<{}> = () => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_PERSONACOIN_BUTTON = 'Homepage_PersonaCoin_Button';
|
||||
export const PERSONACOIN_TESTPAGE = 'PersonaCoin_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './PersonaCoinTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Stack } from '@fluentui-react-native/stack';
|
|||
import { useHoverState, useFocusState, usePressState } from '@fluentui/react-native';
|
||||
import { Square } from '../Common/Square';
|
||||
import { Alert, GestureResponderEvent, StyleSheet, View, ViewProps, ViewStyle } from 'react-native';
|
||||
import { PRESSABLE_TESTPAGE } from '../../Consts';
|
||||
import { PRESSABLE_TESTPAGE } from './consts';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
dottedBorder: {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_PRESSABLE_BUTTON = 'Homepage_Pressable_Button';
|
||||
export const PRESSABLE_TESTPAGE = 'Pressable_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './PressableTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react';
|
||||
import { RadioButton, RadioGroup } from '@fluentui/react-native';
|
||||
import { View } from 'react-native';
|
||||
import { RADIOGROUP_TESTPAGE } from '../../Consts';
|
||||
import { RADIOGROUP_TESTPAGE } from './consts';
|
||||
|
||||
export const RadioGroupTest: React.FunctionComponent<{}> = () => {
|
||||
// Client's example onChange function
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_RADIOGROUP_BUTTON = 'Homepage_RadioGroup_Button';
|
||||
export const RADIOGROUP_TESTPAGE = 'RadioGroup_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './RadioGroupTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import * as React from 'react';
|
|||
import { Button, Separator, Text } from '@fluentui/react-native';
|
||||
import { stackStyle, separatorStackStyle } from '../Common/styles';
|
||||
import { Stack } from '@fluentui-react-native/stack';
|
||||
import { SEPARATOR_TESTPAGE } from '../../Consts';
|
||||
import { SEPARATOR_TESTPAGE } from './consts';
|
||||
|
||||
const BlueSeparator = Separator.customize({ tokens: { color: 'blue' } });
|
||||
const RedSeparator = Separator.customize({ tokens: { color: 'red' } });
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_SEPARATOR_BUTTON = 'Homepage_Separator_Button';
|
||||
export const SEPARATOR_TESTPAGE = 'Separator_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './SeparatorTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import * as React from 'react';
|
||||
import { View, StyleSheet, Text } from 'react-native';
|
||||
import { Svg, Path, Circle, Defs, RadialGradient, Stop, Line, SvgCssUri, G, Rect, Use, Polygon } from 'react-native-svg';
|
||||
import { SVG_TESTPAGE } from '../../Consts';
|
||||
import { SVG_TESTPAGE } from './consts';
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
svg: {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_SVG_BUTTON = 'Homepage_Svg_Button';
|
||||
export const SVG_TESTPAGE = 'Svg_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './SvgTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import * as React from 'react';
|
|||
import { View } from 'react-native';
|
||||
import { Text } from '@fluentui-react-native/text';
|
||||
import { styles } from './styles';
|
||||
import { TEXT_TESTPAGE } from '../../Consts';
|
||||
import { TEXT_TESTPAGE } from './consts';
|
||||
|
||||
export const StandardUsage: React.FunctionComponent<{}> = () => {
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_TEXT_BUTTON = 'Homepage_Text_Button';
|
||||
export const TEXT_TESTPAGE = 'Text_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './TextTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import { commonTestStyles } from '../Common/styles';
|
|||
import { Button, PrimaryButton, Separator, StealthButton, Text, RadioGroup, RadioButton } from '@fluentui/react-native';
|
||||
import { ITheme, IPartialTheme } from '@uifabricshared/theming-ramp';
|
||||
import { customRegistry } from './CustomThemes';
|
||||
import { THEME_TESTPAGE } from '../../Consts';
|
||||
import { THEME_TESTPAGE } from './consts';
|
||||
|
||||
let brand = 'Office';
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
export const HOMEPAGE_THEME_BUTTON = 'Homepage_Theme_Button';
|
||||
export const THEME_TESTPAGE = 'Theme_TestPage';
|
||||
|
|
@ -1 +1,2 @@
|
|||
export * from './ThemeTest';
|
||||
export * from './consts';
|
||||
|
|
|
|||
|
|
@ -1,32 +1,17 @@
|
|||
import * as React from 'react';
|
||||
import { ButtonFocusTest } from './Button';
|
||||
import { CalloutTest } from './Callout';
|
||||
import { CheckboxTest } from './Checkbox';
|
||||
import { FocusTrapTest } from './FocusTrapZone';
|
||||
import { LinkTest } from './Link';
|
||||
import { PersonaTest } from './Persona';
|
||||
import { PersonaCoinTest } from './PersonaCoin';
|
||||
import { PressableTest } from './Pressable';
|
||||
import { RadioGroupTest } from './RadioGroup';
|
||||
import { SeparatorTest } from './Separator';
|
||||
import { SvgTest } from './Svg';
|
||||
import { TextTest } from './Text';
|
||||
import { ThemeTest } from './Theme';
|
||||
import {
|
||||
HOMEPAGE_BUTTON_BUTTON,
|
||||
HOMEPAGE_CALLOUT_BUTTON,
|
||||
HOMEPAGE_CHECKBOX_BUTTON,
|
||||
HOMEPAGE_FOCUSTRAPZONE_BUTTON,
|
||||
HOMEPAGE_LINK_BUTTON,
|
||||
HOMEPAGE_PERSONA_BUTTON,
|
||||
HOMEPAGE_PERSONACOIN_BUTTON,
|
||||
HOMEPAGE_PRESSABLE_BUTTON,
|
||||
HOMEPAGE_RADIOGROUP_BUTTON,
|
||||
HOMEPAGE_SEPARATOR_BUTTON,
|
||||
HOMEPAGE_SVG_BUTTON,
|
||||
HOMEPAGE_TEXT_BUTTON,
|
||||
HOMEPAGE_THEME_BUTTON
|
||||
} from '../Consts';
|
||||
import { ButtonFocusTest, HOMEPAGE_BUTTON_BUTTON } from './Button';
|
||||
import { CalloutTest, HOMEPAGE_CALLOUT_BUTTON } from './Callout';
|
||||
import { CheckboxTest, HOMEPAGE_CHECKBOX_BUTTON } from './Checkbox';
|
||||
import { FocusTrapTest, HOMEPAGE_FOCUSTRAPZONE_BUTTON } from './FocusTrapZone';
|
||||
import { LinkTest, HOMEPAGE_LINK_BUTTON } from './Link';
|
||||
import { PersonaTest, HOMEPAGE_PERSONA_BUTTON } from './Persona';
|
||||
import { PersonaCoinTest, HOMEPAGE_PERSONACOIN_BUTTON } from './PersonaCoin';
|
||||
import { PressableTest, HOMEPAGE_PRESSABLE_BUTTON } from './Pressable';
|
||||
import { RadioGroupTest, HOMEPAGE_RADIOGROUP_BUTTON } from './RadioGroup';
|
||||
import { SeparatorTest, HOMEPAGE_SEPARATOR_BUTTON } from './Separator';
|
||||
import { SvgTest, HOMEPAGE_SVG_BUTTON } from './Svg';
|
||||
import { TextTest, HOMEPAGE_TEXT_BUTTON } from './Text';
|
||||
import { ThemeTest, HOMEPAGE_THEME_BUTTON } from './Theme';
|
||||
|
||||
export type TestDescription = {
|
||||
name: string;
|
||||
|
|
|
|||
|
|
@ -9,5 +9,5 @@
|
|||
},
|
||||
"types": ["@wdio/sync", "@wdio/jasmine-framework", "node", "@types/jasmine"]
|
||||
},
|
||||
"include": ["./src/**/*.ts", "../fluent-tester/src/**/*.ts"]
|
||||
"include": ["src", "../fluent-tester/src"]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@ const baseUrl = 'https://webdriver.io';
|
|||
|
||||
exports.config = {
|
||||
runner: 'local', // Where should your test be launched
|
||||
specs: ['../fluent-tester/src/E2E/test/**/*.ts'],
|
||||
specs: ['../fluent-tester/src/E2E/**/specs/*.ts'],
|
||||
exclude: [
|
||||
/* 'path/to/excluded/files' */
|
||||
],
|
||||
|
|
@ -44,7 +44,7 @@ exports.config = {
|
|||
port: 4723, // default appium port
|
||||
services: ['appium'],
|
||||
appium: {
|
||||
logPath: './src/reports/',
|
||||
logPath: './reports/',
|
||||
args: {
|
||||
port: '4723'
|
||||
}
|
||||
|
|
@ -143,7 +143,7 @@ exports.config = {
|
|||
afterTest: function(test) {
|
||||
if (test.error !== undefined) {
|
||||
const name = 'ERROR-' + Date.now();
|
||||
browser.saveScreenshot('./src/errorShots/' + name + '.png');
|
||||
browser.saveScreenshot('./reports/errorShots/' + name + '.png');
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче