Skip to content
This repository was archived by the owner on Aug 1, 2020. It is now read-only.

Commit e556305

Browse files
bcarroll22bcarroll22
committed
add docusaurus versions
1 parent dcfd340 commit e556305

35 files changed

+2551
-0
lines changed

‎website/pages/en/versions.js

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
/**
2+
* Copyright (c) 2017-present, Facebook, Inc.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*/
7+
8+
const React = require('react');
9+
10+
const CompLibrary = require('../../core/CompLibrary');
11+
12+
const Container = CompLibrary.Container;
13+
14+
const CWD = process.cwd();
15+
16+
const versions = require(`${CWD}/versions.json`);
17+
18+
function Versions(props) {
19+
const { config: siteConfig } = props;
20+
const latestVersion = versions[0];
21+
const repoUrl = `https://github.com/testing-library/native-testing-library`;
22+
return (
23+
<div className="docMainWrapper wrapper">
24+
<Container className="mainContainer versionsContainer">
25+
<div className="post">
26+
<header className="postHeader">
27+
<h1>{siteConfig.title} Versions</h1>
28+
</header>
29+
<p>New versions of this project are released every so often.</p>
30+
<h3 id="latest">Current version (Stable)</h3>
31+
<table className="versions">
32+
<tbody>
33+
<tr>
34+
<th>{latestVersion}</th>
35+
<td>
36+
<a href="">Documentation</a>
37+
</td>
38+
<td>
39+
<a href="">Release Notes</a>
40+
</td>
41+
</tr>
42+
</tbody>
43+
</table>
44+
<p>
45+
This is the version that is configured automatically when you first install this
46+
project.
47+
</p>
48+
<h3 id="archive">Past Versions</h3>
49+
<table className="versions">
50+
<tbody>
51+
{versions.map(
52+
version =>
53+
version !== latestVersion && (
54+
<tr>
55+
<th>{version}</th>
56+
<td>
57+
{/* You are supposed to fill this href by yourself
58+
Example: href={`docs/${version}/doc.html`} */}
59+
<a href={`docs/${version}/doc.html`}>Documentation</a>
60+
</td>
61+
<td>
62+
<a href={`${repoUrl}/releases/tag/v${version}`}>Changelog</a>
63+
</td>
64+
</tr>
65+
),
66+
)}
67+
</tbody>
68+
</table>
69+
<p>
70+
You can find past versions of this project on <a href={repoUrl}>GitHub</a>.
71+
</p>
72+
</div>
73+
</Container>
74+
</div>
75+
);
76+
}
77+
78+
module.exports = Versions;

‎website/versioned_docs/version-2.0.0/api-act.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
---
2+
id: version-2.0.0-api-act
3+
title: Act
4+
sidebar_label: Act
5+
original_id: api-act
6+
---
7+
8+
## `act`
9+
10+
This is a light wrapper around the
11+
[`react-test-renderer` `act` function](https://reactjs.org/docs/test-renderer.html). All it does is
12+
forward all arguments to the act function if your version of react supports `act`.

‎website/versioned_docs/version-2.0.0/api-async.md

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
---
2+
id: version-2.0.0-api-async
3+
title: Async
4+
sidebar_label: Async
5+
original_id: api-async
6+
---
7+
8+
Several utilities are provided for dealing with asynchronous code. These can be useful to wait for
9+
an element to appear or disappear in response to an action. (See the
10+
[guide to testing disappearance](guide-disappearance.md).)
11+
12+
## `wait`
13+
14+
```typescript
15+
function wait(
16+
callback?: () => void,
17+
options?: {
18+
timeout?: number;
19+
interval?: number;
20+
},
21+
): Promise<void>;
22+
```
23+
24+
When in need to wait for non-deterministic periods of time you can use `wait`, to wait for your
25+
expectations to pass. The `wait` function is a small wrapper around the
26+
[`wait-for-expect`](https://github.com/TheBrainFamily/wait-for-expect) module. Here's a simple
27+
example:
28+
29+
```javascript
30+
await wait(() => getByLabelText(container, 'username'));
31+
getByLabelText(container, 'username').value = 'chucknorris';
32+
```
33+
34+
This can be useful if you have a unit test that mocks API calls and you need to wait for your mock
35+
promises to all resolve.
36+
37+
The default `callback` is a no-op function (used like `await wait()`). This can be helpful if you
38+
only need to wait for one tick of the event loop (in the case of mocked API calls with promises that
39+
resolve immediately).
40+
41+
The default `timeout` is `4500ms` which will keep you under
42+
[Jest's default timeout of `5000ms`](https://facebook.github.io/jest/docs/en/jest-object.html#jestsettimeouttimeout).
43+
44+
The default `interval` is `50ms`. However it will run your callback immediately on the next tick of
45+
the event loop (in a `setTimeout`) before starting the intervals.
46+
47+
## `waitForElement`
48+
49+
```typescript
50+
function waitForElement<T>(
51+
callback: () => T,
52+
options?: {
53+
container?: ReactTestInstance;
54+
timeout?: number;
55+
interval?: number;
56+
},
57+
): Promise<T>;
58+
```
59+
60+
When in need to wait for DOM elements to appear, disappear, or change you can use `waitForElement`.
61+
The `waitForElement` function is a similar to `wait`, but is a helper specifically intended to wait
62+
for an element.
63+
64+
Here's a simple example:
65+
66+
```javascript
67+
const usernameElement = await waitForElement(() => getByA11yLabel(container, 'username'), {
68+
container,
69+
});
70+
expect(usernameElement.props.children).toBe('chucknorris');
71+
```
72+
73+
You can also wait for multiple elements at once:
74+
75+
```javascript
76+
const [usernameElement, passwordElement] = await waitForElement(
77+
() => [getByA11yLabel(container, 'username'), getByA11yLabel(container, 'password')],
78+
{ container },
79+
);
80+
```
81+
82+
The default `container` is the root `ReactTestInstance` that is the result of `render`. Make sure
83+
the elements you wait for will be attached to it, or set a different `ReactTestInstance` as a
84+
container.
85+
86+
The default `timeout` is `4500ms` which will keep you under
87+
[Jest's default timeout of `5000ms`](https://facebook.github.io/jest/docs/en/jest-object.html#jestsettimeouttimeout).
88+
89+
The default `interval` is `50ms`. However it will run your callback immediately on the next tick of
90+
the event loop (in a `setTimeout`) before starting the intervals.

‎website/versioned_docs/version-2.0.0/api-events.md

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
---
2+
id: version-2.0.0-api-events
3+
title: Firing Events
4+
sidebar_label: Firing Events
5+
original_id: api-events
6+
---
7+
8+
## Basic example
9+
10+
```javascript
11+
import { fireEvent, NativeEvent, render } from 'native-testing-library';
12+
13+
const { getByText } = render(<Button title="Submit" />);
14+
fireEvent(getByText(container, 'Submit'), new NativeEvent('press'));
15+
```
16+
17+
## `fireEvent[eventName]`
18+
19+
```typescript
20+
fireEvent[eventName](node: FiberRoot, eventProperties: NativeEvent)
21+
```
22+
23+
Convenience methods for firing events. Check out
24+
[src/events.js](https://github.com/testing-library/native-testing-library/blob/master/src/events.js)
25+
for a full list as well as `validTargets` for every event type.
26+
27+
```javascript
28+
import { fireEvent, render } from 'native-testing-library';
29+
30+
const { getByText } = render(<Button title="Submit" />);
31+
fireEvent.press(getByText('Submit'));
32+
```
33+
34+
**nativeEvent**: React Native tends to put everything relevant to their built-in events on an object
35+
called nativeEvent. When you fire an event using this library, you will have to build a mock event
36+
config. You will use this particularly for events like a change event:
37+
38+
```javascript
39+
fireEvent.change(getByA11yLabel(/username/i), { nativeEvent: { text: 'a' } });
40+
```
41+
42+
**changeText**: `Text` has a method for value updating called `onChangeText`. Since this is such a
43+
commonly used method, there is a special case in the library for this method.
44+
45+
```javascript
46+
fireEvent.changeText(getByA11yLabel(/username/i), 'a');
47+
```
48+
49+
**customEvent**: You may be using a library that has custom event listeners that you want to be able
50+
to fire. This is how you would fire one of these events:
51+
52+
```javascript
53+
fireEvent(getByTestId('swiper'), new NativeEvent('myEvent', { nativeEvent: { value: 'testing' } }));
54+
```

0 commit comments

Comments
 (0)