|
1 | 1 | # Ember-cli-test-recorder |
2 | | - |
3 | | -[](https://gitter.im/QuantumInformation/ember-cli-test-recorder?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) |
4 | | -#Record steps in an Ember app to them be added to an integration test. |
5 | | - |
6 | | -It needs some additional properties set from the parent application. |
7 | | -* currentRoute: The component observes this. |
8 | | - |
9 | | - |
10 | | - |
11 | | - |
12 | | -The test records what you do and records the changes in the app. |
| 2 | +Recording your steps used to interact with an Ember applications |
| 3 | + to then be added to an integration test. The idea is to save you time writing these |
| 4 | + tests by hand. |
| 5 | + |
13 | 6 | You should only add this component to your app when your app behaves as |
14 | 7 | expected as the mutations will be recorded. |
15 | 8 |
|
16 | | -The point of this is that if you record mutations in a page behaving as expected |
17 | | -this should make for useful tests as you continue development. |
18 | | - |
19 | 9 | ###Current UI interactions that are recorded for acceptance tests: |
20 | 10 |
|
21 | 11 | * Button clicks, they also generate andThen code blocks. |
22 | | -* Record any changes to route after 1 second |
| 12 | +* Record any changes to route |
23 | 13 | * Changes in whether items are present in the DOM, only items with ID's are recorded |
24 | 14 |
|
25 | | - |
26 | | - |
27 | 15 | ##Usage |
28 | 16 |
|
29 | | -The component requires information from the applicationController and should be placed |
| 17 | +The component requires the currentRouteName information from the applicationController and should be placed |
30 | 18 | inside the application.hbs template |
31 | 19 |
|
32 | 20 | ```hbs |
33 | 21 | {{test-recorder currentRouteName=currentRouteName}} |
34 | 22 | ``` |
35 | 23 | If you want a particular node to be tested for being in the active dom then give it an id |
36 | | -eg an element of `<p></p>` will not be tested, but `<p id='foo'></p>` will have a test generated like: |
| 24 | +eg an element of `<p></p>` will not be recorded, but `<p id='foo'></p>` will have a test generated like: |
37 | 25 | ```js |
38 | 26 |
|
| 27 | +click("html>body>div>div:eq(0)>button"); |
| 28 | +andThen(function () { |
| 29 | + equal(find("#foo").length, 0, "foo removed AFTER user [INSERT REASON]"); |
| 30 | +}); |
39 | 31 |
|
40 | 32 | ``` |
41 | 33 | If you don't want an element to be recorded, and any of its children add this class to it `doNotRecord` |
42 | 34 |
|
43 | | -TIPS |
| 35 | +##TIPS |
44 | 36 |
|
45 | | -Avoid making multiple button clicks (or other interactions that cause asynchronous) |
46 | | -updates until DOM has finished updating. This |
47 | | -will allow code generated by the mutations observer to be placed in the in the |
| 37 | +Avoid making multiple button clicks (or other interactions that cause asynchronous) updates until DOM has |
| 38 | +finished updating. This will allow code generated by the mutations observer to be placed in the in the |
48 | 39 | generated code. |
49 | 40 |
|
50 | 41 | There are currently some hacks as this is designed not to be embedded into your application, |
51 | 42 | ie require code modification. |
52 | 43 |
|
53 | 44 |
|
54 | 45 | ## Roadmap |
55 | | -* Record text enter in inputs and button clicks to be recorded |
| 46 | +* Record text that is entered into inputs |
56 | 47 | * Allow more complex click actions like the steps to click on inputs like select2 to be recorded |
57 | 48 | * Ignore clicks on ember elements with no effect |
58 | 49 |
|
|
0 commit comments