diff --git a/README.md b/README.md index f3f0d05ca..6e6b89d62 100644 --- a/README.md +++ b/README.md @@ -273,12 +273,52 @@ Log prettified shallowly rendered component or test instance (just like snapshot import { debug } from 'react-native-testing-library'; debug(); -// console.log: -// -// Component -// +debug.shallow(); // an alias for `debug` ``` +logs: + +```jsx + + + +``` + +There's also `debug.deep` that renders deeply to stdout. + +```jsx +import { debug } from 'react-native-testing-library'; + +debug.deep(); +``` + +logs: + +```jsx + + + Press me + + +``` + +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`. diff --git a/package.json b/package.json index 9aad03b10..5736f17bf 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "react": "16.6.0-alpha.8af6728", "react-native": "^0.57.3", "react-test-renderer": "16.6.0-alpha.8af6728", + "strip-ansi": "^5.0.0", "typescript": "^3.1.1" }, "peerDependencies": { diff --git a/src/__tests__/__snapshots__/debug.test.js.snap b/src/__tests__/__snapshots__/debug.test.js.snap new file mode 100644 index 000000000..2a595cfa1 --- /dev/null +++ b/src/__tests__/__snapshots__/debug.test.js.snap @@ -0,0 +1,34 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`debug 1`] = ` +" + +" +`; + +exports[`debug.deep 1`] = ` +" + + Press me + +" +`; diff --git a/src/__tests__/debug.test.js b/src/__tests__/debug.test.js new file mode 100644 index 000000000..758280cea --- /dev/null +++ b/src/__tests__/debug.test.js @@ -0,0 +1,60 @@ +// @flow +/* eslint-disable no-console */ +import React from 'react'; +import { TouchableOpacity, Text } from 'react-native'; +import stripAnsi from 'strip-ansi'; +import { debug } from '..'; + +function TextComponent({ text }) { + return {text}; +} + +class Button extends React.Component<*> { + render() { + return ( + + + + ); + } +} + +test('debug', () => { + // $FlowFixMe + console.log = jest.fn(); + const component =