|
1 | 1 | # testcafe-angular-selectors |
| 2 | + |
| 3 | +This plugin provides selector extensions that make it easier to test Angular applications with [TestCafe](https://github.com/DevExpress/testcafe/). These extensions allow you to create a Selector to find elements on the page in a way that is native to Angular applications (like `binding`, `model` etc.. ). |
| 4 | + |
| 5 | +## Install |
| 6 | + |
| 7 | +``` |
| 8 | +npm install testcafe-angular-selectors |
| 9 | +``` |
| 10 | + |
| 11 | +## Usage |
| 12 | + |
| 13 | +```js |
| 14 | +import { Angular1Selector } from 'testcafe-angular-selectors'; |
| 15 | +import { Selector } from 'testcafe'; |
| 16 | + |
| 17 | +fixture `TestFixture` |
| 18 | + .page('http://todomvc.com/examples/angularjs/'); |
| 19 | + |
| 20 | +test('add new item', async t => { |
| 21 | + await t |
| 22 | + .typeText(Angular1Selector.byModel('newTodo'), 'new item') |
| 23 | + .pressKey('enter') |
| 24 | + .expect(Selector('#todo-list').visible).ok(); |
| 25 | +}); |
| 26 | +``` |
| 27 | + |
| 28 | +See more examples [here](/test/angular1-test.js). |
| 29 | + |
| 30 | +## Angular1 Selector extensions |
| 31 | + |
| 32 | +### byBinding |
| 33 | +Find elements by text binding. Does a partial match, so any elements bound to variables containing the input string will be returned. |
| 34 | +```js |
| 35 | +Angular1Selector.byBinding(bindingDescriptor, parentSelector) |
| 36 | +``` |
| 37 | +Parameter | Description |
| 38 | +--------------------------- | ----------- |
| 39 | +bindingDescriptor | The JavaScript expression to which the element's `textContent` is bound. |
| 40 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 41 | + |
| 42 | +> We don't support deprecated syntax `Angular1Selector.byBinding('{{person.name}}')` |
| 43 | +
|
| 44 | +### byExactBinding |
| 45 | +Find elements by exact binding. |
| 46 | +```js |
| 47 | +Angular1Selector.byExactBinding(bindingDescriptor, parentSelector) |
| 48 | +``` |
| 49 | +Parameter | Description |
| 50 | +--------------------------- | ----------- |
| 51 | +bindingDescriptor | The JavaScript expression to which the element's `textContent` is bound. |
| 52 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 53 | + |
| 54 | +### byModel |
| 55 | +Find elements by 'ng-model' expression |
| 56 | +```js |
| 57 | +Angular1Selector.byModel(model, parentSelector) |
| 58 | +``` |
| 59 | +Parameter | Description |
| 60 | +--------------------------- | ----------- |
| 61 | +model | The JavaScript expression used to bind a property on the scope to an input, select, textarea (or a custom form control). |
| 62 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 63 | + |
| 64 | +### byOptions |
| 65 | + |
| 66 | +Find elements by 'ng-options' expression. |
| 67 | +```js |
| 68 | +Angular1Selector.byOptions(optionsDescriptor, parentSelector) |
| 69 | +``` |
| 70 | +Parameter | Description |
| 71 | +--------------------------- | ----------- |
| 72 | +optionsDescriptor | The JavaScript expression used to generate a list of <option> elements for the <select> element. |
| 73 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 74 | + |
| 75 | +### byRepeater |
| 76 | +Find elements by repeater. Does a partial match, so any elements bound to variables containing the input string will be returned. |
| 77 | +```js |
| 78 | +Angular1Selector.byRepeater(repeatDescriptor, parentSelector) |
| 79 | +``` |
| 80 | +Parameter | Description |
| 81 | +--------------------------- | ----------- |
| 82 | +repeatDescriptor | The JavaScript expression used to instantiate a template. |
| 83 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 84 | + |
| 85 | +### byExactRepeat |
| 86 | +Find elements by exact repeater. |
| 87 | +```js |
| 88 | +Angular1Selector.byExactRepeater(repeatDescriptor, parentSelector) |
| 89 | +``` |
| 90 | +Parameter | Description |
| 91 | +--------------------------- | ----------- |
| 92 | +repeatDescriptor | The JavaScript expression used to instantiate a template. |
| 93 | +parentSelector *(optional)* | A TestCafe [selector](https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html). If specified, TestCafe will search for the target element among the descendants of the element identified by this selector. |
| 94 | + |
| 95 | + |
| 96 | +## Angular2 Selector extensions |
| 97 | +Angular2 component selectors is coming... |
0 commit comments