Skip to content

Commit

Permalink
Merge pull request #137 from kirovboris/docs
Browse files Browse the repository at this point in the history
.withKey docs
  • Loading branch information
kirovboris authored Feb 14, 2019
2 parents 09e269a + 66de823 commit f697e69
Showing 1 changed file with 12 additions and 2 deletions.
14 changes: 12 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,8 +34,8 @@ Suppose you have the following JSX.
<TodoApp className="todo-app">
<TodoInput />
<TodoList>
<TodoItem priority="High">Item 1</TodoItem>
<TodoItem priority="Low">Item 2</TodoItem>
<TodoItem priority="High" key="HighPriority">Item 1</TodoItem>
<TodoItem priority="Low" key="LowPriority">Item 2</TodoItem>
</TodoList>

<div className="items-count">Items count: <span>{this.state.itemCount}</span></div>
Expand Down Expand Up @@ -66,6 +66,16 @@ const itemsCount = ReactSelector('TodoApp div span');

Warning: if you specify a DOM element's tag name, React selectors search for the element among the component's children without looking into nested components. For instance, for the JSX above the `ReactSelector('TodoApp div')` selector will be equal to `Selector('.todo-app > div')`.

#### Selecting components by the component key

To obtain a component by its key, use the `withKey` method.

```js
import { ReactSelector } from 'testcafe-react-selectors';

const item = ReactSelector('TodoItem').withKey('HighPriority');
```

#### Selecting components by property values

React selectors allow you to select elements that have a specific property value. To do this, use the `withProps` method. You can pass the property and its value as two parameters or an object.
Expand Down

0 comments on commit f697e69

Please # to comment.