mirror of
https://github.com/callstack/react-native-testing-library.git
synced 2026-09-18 23:09:04 +08:00
feat: add debug.deep and debug.shallow (#37)
<!-- Please provide enough information so that others can review your pull request. --> <!-- Keep pull requests small and focused on a single change. --> ### Summary Adds API proposed by https://github.com/callstack/react-native-testing-library/pull/33#issuecomment-430302079. Also component output is now highlighted: <img width="259" alt="screenshot 2018-10-16 at 19 33 25" src="https://user-images.githubusercontent.com/5106466/47035614-c10efb80-d17a-11e8-99ac-00f648880008.png"> ### Test plan Added tests for `debug`.
This commit is contained in:
committed by
GitHub
parent
03e2c4b0f2
commit
05db7bcaac
@@ -273,12 +273,52 @@ Log prettified shallowly rendered component or test instance (just like snapshot
|
||||
import { debug } from 'react-native-testing-library';
|
||||
|
||||
debug(<Component />);
|
||||
// console.log:
|
||||
// <View>
|
||||
// <Text>Component</Text>
|
||||
// </View>
|
||||
debug.shallow(<Component />); // an alias for `debug`
|
||||
```
|
||||
|
||||
logs:
|
||||
|
||||
```jsx
|
||||
<TouchableOpacity
|
||||
activeOpacity={0.2}
|
||||
onPress={[Function bound fn]}
|
||||
>
|
||||
<TextComponent
|
||||
text="Press me"
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
```
|
||||
|
||||
There's also `debug.deep` that renders deeply to stdout.
|
||||
|
||||
```jsx
|
||||
import { debug } from 'react-native-testing-library';
|
||||
|
||||
debug.deep(<Component />);
|
||||
```
|
||||
|
||||
logs:
|
||||
|
||||
```jsx
|
||||
<View
|
||||
accessible={true}
|
||||
isTVSelectable={true}
|
||||
onResponderGrant={[Function bound touchableHandleResponderGrant]}
|
||||
// ... more props
|
||||
style={
|
||||
Object {
|
||||
\\"opacity\\": 1,
|
||||
}
|
||||
}
|
||||
>
|
||||
<Text>
|
||||
Press me
|
||||
</Text>
|
||||
</View>
|
||||
```
|
||||
|
||||
Optionally you can provide a string message as a second argument to `debug`, which will be displayed right after the component.
|
||||
|
||||
## `flushMicrotasksQueue`
|
||||
|
||||
Wait for microtasks queue to flush. Useful if you want to wait for some promises with `async/await`.
|
||||
|
||||
Reference in New Issue
Block a user