Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Badisi/wdio-harness
🔬 WebdriverIO support for Angular component test harnesses
https://github.com/Badisi/wdio-harness
angular cdk components harness harnesses test test-harnesses testing wdio webdriver webdriverio
Last synced: 2 months ago
JSON representation
🔬 WebdriverIO support for Angular component test harnesses
- Host: GitHub
- URL: https://github.com/Badisi/wdio-harness
- Owner: Badisi
- License: mit
- Created: 2021-11-15T21:52:35.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-10-28T22:16:14.000Z (3 months ago)
- Last Synced: 2024-11-08T01:09:44.087Z (2 months ago)
- Topics: angular, cdk, components, harness, harnesses, test, test-harnesses, testing, wdio, webdriver, webdriverio
- Language: TypeScript
- Homepage:
- Size: 1.85 MB
- Stars: 6
- Watchers: 2
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
- awesome-webdriverio - @badisi/wdio-harness - WebdriverIO support for Angular component test harnesses. (Plugins / Miscellaneous)
README
@badisi/wdio-harness
🔬 WebdriverIO support for Angular component test harnesses.
#### Component test harnesses
> A component harness is a class that lets a test interact with a component via a supported API. Each harness's API interacts with a component the same way a user would. By using the harness API, a test insulates itself against updates to the internals of a component, such as changing its DOM structure. The idea for component harnesses comes from the [PageObject](https://martinfowler.com/bliki/PageObject.html) pattern commonly used for integration testing.
[More info](https://material.angular.io/cdk/test-harnesses/overview)
## Installation
```sh
npm install @badisi/wdio-harness --save-dev
```
```sh
yarn add @badisi/wdio-harness --dev
```
## Usage
__Methods__
- `createHarnessEnvironment(rootElement)` - gets a HarnessLoader instance from a given element (defaults to body)
- `getHarness(harnessType, element)` - searches for an harness instance from a given ComponentHarness class and element
- `getHarness(harnessType)` - searches for an harness instance from a given ComponentHarness class
- `getHarness(query)` - searches for an harness instance from a given HarnessPredicate
- `getAllHarnesses(query)` - acts like getHarness, but returns an array of harness instances
- `waitForAngular()` - waits for Angular to finish bootstrapping
__Example__
```ts
import { MatDatepickerInputHarness } from '@angular/material/datepicker/testing';
import { getHarness } from '@badisi/wdio-harness';
describe('Angular Material Harness', () => {
beforeEach(async () => {
await browser.url('http://localhost:4200');
});
it('MatDatePicker', async () => {
const datepicker = await getHarness(MatDatepickerInputHarness.with({ selector: '#demo-datepicker-input' }));
await datepicker.setValue('9/27/1954');
expect(await datepicker.getValue()).withContext('Date should be 9/27/1954').toBe('9/27/1954');
await datepicker.openCalendar();
const calendar = await datepicker.getCalendar();
await calendar.next();
await calendar.selectCell({ text: '20' });
expect(await datepicker.getValue()).withContext('Date should be 10/20/1954').toBe('10/20/1954');
});
});
```
More examples [here][examples].
## Development
See the [developer docs][developer].
## Contributing
#### > Want to Help ?
Want to file a bug, contribute some code or improve documentation ? Excellent!
But please read up first on the guidelines for [contributing][contributing], and learn about submission process, coding rules and more.
#### > Code of Conduct
Please read and follow the [Code of Conduct][codeofconduct] and help me keep this project open and inclusive.
[developer]: https://github.com/badisi/wdio-harness/blob/main/DEVELOPER.md
[contributing]: https://github.com/badisi/wdio-harness/blob/main/CONTRIBUTING.md
[codeofconduct]: https://github.com/badisi/wdio-harness/blob/main/CODE_OF_CONDUCT.md
[examples]: https://github.com/badisi/wdio-harness/blob/main/projects/tests-e2e/harness.e2e.ts