Skip to content

Commit

Permalink
DOC: API: add DOM query helper examples
Browse files Browse the repository at this point in the history
Let's add an example usage of all of the DOM query helpers (find,
findAll, getRootElement) to the API docs.

(cherry picked from commit 7bd16c1)
  • Loading branch information
geneukum authored and chriskrycho committed Dec 15, 2022
1 parent 335019d commit 83b7f5f
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 4 deletions.
33 changes: 29 additions & 4 deletions API.md
Original file line number Diff line number Diff line change
Expand Up @@ -493,6 +493,14 @@ Find the first element matched by the given selector. Equivalent to calling

* `selector` **[string][64]** the selector to search for

#### Examples

Find all of the elements matching '.my-selector'.

```javascript
findAll('.my-selector');
```

Returns **[Element][65]** matched element or null

### findAll
Expand All @@ -505,12 +513,29 @@ of a `NodeList`.

* `selector` **[string][64]** the selector to search for

#### Examples

Finding the first element with id 'foo'

```javascript
find('#foo');
```

Returns **[Array][70]** array of matched elements

### getRootElement

Get the root element of the application under test (usually `#ember-testing`)

#### Examples

Getting the root element of the application and checking that it is equal
to the element with id 'ember-testing'.

```javascript
assert.equal(getRootElement(), document.querySelector('#ember-testing'));
```

Returns **[Element][65]** the root element

## Routing Helpers
Expand Down Expand Up @@ -1216,23 +1241,23 @@ Returns **([Array][70]\<Warning> | [Promise][66]<[Array][70]\<Warning>>)** An ar

[54]: #getdeprecations

[55]: #examples-19
[55]: #examples-22

[56]: #getdeprecationsduringcallback

[57]: #parameters-29

[58]: #examples-20
[58]: #examples-23

[59]: #getwarnings

[60]: #examples-21
[60]: #examples-24

[61]: #getwarningsduringcallback

[62]: #parameters-30

[63]: #examples-22
[63]: #examples-25

[64]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String

Expand Down
6 changes: 6 additions & 0 deletions addon-test-support/@ember/test-helpers/dom/find-all.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,12 @@ import { toArray } from '../ie-11-polyfills';
@public
@param {string} selector the selector to search for
@return {Array} array of matched elements
@example
<caption>
Finding the first element with id 'foo'
</caption>
find('#foo');
*/
export default function findAll(selector: string): Element[] {
if (!selector) {
Expand Down
7 changes: 7 additions & 0 deletions addon-test-support/@ember/test-helpers/dom/find.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,13 @@ import getElement from './-get-element';
@public
@param {string} selector the selector to search for
@return {Element} matched element or null
@example
<caption>
Find all of the elements matching '.my-selector'.
</caption>
findAll('.my-selector');
*/
export default function find(selector: string): Element | null {
if (!selector) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,13 @@ import { isDocument, isElement } from './-target';
@public
@returns {Element} the root element
@example
<caption>
Getting the root element of the application and checking that it is equal
to the element with id 'ember-testing'.
</caption>
assert.equal(getRootElement(), document.querySelector('#ember-testing'));
*/
export default function getRootElement(): Element | Document {
let context = getContext();
Expand Down

0 comments on commit 83b7f5f

Please sign in to comment.