From 520355a6454cacb2b045197ca9e3775f8edeb70d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Pierzcha=C5=82a?= <thymikee@gmail.com>
Date: Wed, 3 Oct 2018 19:27:32 +0200
Subject: [PATCH] change shallow output to be more future proof

---
 README.md    | 9 +++++----
 src/index.js | 9 ++++++---
 2 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 6a1f83ff..4ca94a76 100644
--- a/README.md
+++ b/README.md
@@ -39,20 +39,21 @@ Deeply render given React component and returns helpers to query the output. For
 ```jsx
 import { render } from 'react-native-testing-library';
 
-const { ... } = render(<Component />);
+const { getByTestId, instance /*...*/ } = render(<Component />);
 ```
 
-You'll likely want to wrap `render` with some React Context Providers, creating your custom render. [Follow this great guide on how to set this up](https://github.com/kentcdodds/react-testing-library#custom-render).
+When using React context providers, like Redux Provider, you'll likely want to wrap rendered component with them. In such cases it's convenient to create your custom `render` method. [Follow this great guide on how to set this up](https://github.com/kentcdodds/react-testing-library#custom-render).
 
 ## `shallow`
 
-Shallowly render given React copmonents. Since it (currently) doesn't return helpers to query the output, it's mostly adviced to used for snapshot testing.
+Shallowly render given React copmonent. Since it doesn't return helpers to query the output, it's mostly adviced to used for snapshot testing (short snapshots are best for code reviewers).
 
 ```jsx
 import { shallow } from 'react-native-testing-library';
 
 test('Component has a structure', () => {
-  expect(shallow(<Component />)).toMatchSnapshot();
+  const { output } = shallow(<Component />);
+  expect(output).toMatchSnapshot();
 });
 ```
 
diff --git a/src/index.js b/src/index.js
index 2da3c4e9..86857ddb 100644
--- a/src/index.js
+++ b/src/index.js
@@ -60,9 +60,11 @@ export const shallow = (instance: ReactTestInstance | React.Element<*>) => {
   } else {
     renderer.render(React.createElement(instance.type, instance.props));
   }
-  const result = renderer.getRenderOutput();
+  const output = renderer.getRenderOutput();
 
-  return result;
+  return {
+    output,
+  };
 };
 
 /**
@@ -72,9 +74,10 @@ export const debug = (
   instance: ReactTestInstance | React.Element<*>,
   message?: any
 ) => {
+  const { output } = shallow(instance);
   // eslint-disable-next-line no-console
   console.log(
-    prettyFormat(shallow(instance), {
+    prettyFormat(output, {
       plugins: [plugins.ReactTestComponent, plugins.ReactElement],
     }),
     message