From d5c3afda2fd92569341456b58bca245af969bb35 Mon Sep 17 00:00:00 2001 From: Flarnie Marchan Date: Fri, 26 May 2017 07:47:18 -0700 Subject: [PATCH] Add 'Test Utils' docs back to main navigation (#9676) * Add 'Test Utils' docs back to main navigation **why make this change?:** We accidentally removed this - still supporting the use of Test Utilities, so we should have them in the docs. **test plan:** Manually tested the website - will insert a screenshot. **issue:** https://github.com/facebook/react/issues/9651 * Move test-utils docs to reference section **what is the change?:** Moved from 'advanced guides' to 'reference' **why make this change?:** It makes more sense as a reference **test plan:** Visual inspection (flarnie may add a screenshot) **issue:** * Add back the shallow renderer docs and remove outdated docs **what is the change?:** - Remove outdated 'shallow renderer' docs on 'test utils' page, and point to the updated 'shallow renderer' docs. - Re-add a link to the updated 'shallow renderer' docs on the main navigation. **why make this change?:** This was already approved in https://github.com/facebook/react/pull/9331 which was then cherry-picked to https://github.com/facebook/react/pull/9359/commits and landed on master. I'm not sure why some of these changes didn't persist. For now just adding back the changes we need. **test plan:** Manually inspected website - will insert screenshots. **issue:** * Further improvements to 'shallow rendering' and 'test utils' docs Thanks @gaearon for the improvements! **what is the change?:** - Remove
from end of 'shallow rendering' docs - 'documents' -> 'documentation' - Move 'shallow rendering' redirection section to top of 'test utils' docs - Add intro sentence about testing to 'shallow rendering' docs **why make this change?:** Documentation helps people learn. **test plan:** Visual inspection (cherry picked from commit 114b9c5500ba21ec9e60f814148d38276c9aaa50) --- docs/_data/nav_docs.yml | 4 ++++ docs/docs/addons-shallow-renderer.md | 3 +-- docs/docs/addons-test-utils.md | 36 ++++------------------------ 3 files changed, 10 insertions(+), 33 deletions(-) diff --git a/docs/_data/nav_docs.yml b/docs/_data/nav_docs.yml index 7b562e2891..b133b36186 100644 --- a/docs/_data/nav_docs.yml +++ b/docs/_data/nav_docs.yml @@ -67,3 +67,7 @@ title: DOM Elements - id: events title: SyntheticEvent + - id: test-utils + title: Test Utilities + - id: shallow-renderer + title: Shallow Renderer diff --git a/docs/docs/addons-shallow-renderer.md b/docs/docs/addons-shallow-renderer.md index b0f3bd6b05..fd1f962122 100644 --- a/docs/docs/addons-shallow-renderer.md +++ b/docs/docs/addons-shallow-renderer.md @@ -14,7 +14,7 @@ var ReactShallowRenderer = require('react-test-renderer/shallow'); // ES5 with n ``` ### Shallow Rendering -Shallow rendering lets you render a component "one level deep" and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM. +When writing unit tests for React, shallow rendering can be helpful. Shallow rendering lets you render a component "one level deep" and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM. - [`shallowRenderer.render()`](#shallowrenderer.render) - [`shallowRenderer.getRenderOutput()`](#shallowrenderer.getrenderoutput) @@ -57,4 +57,3 @@ Shallow testing currently has some limitations, namely not supporting refs. We also recommend checking out Enzyme's [Shallow Rendering API](http://airbnb.io/enzyme/docs/api/shallow.html). It provides a nicer higher-level API over the same functionality. -* * * diff --git a/docs/docs/addons-test-utils.md b/docs/docs/addons-test-utils.md index cda0cb2ac7..6e95410378 100644 --- a/docs/docs/addons-test-utils.md +++ b/docs/docs/addons-test-utils.md @@ -39,6 +39,11 @@ var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm ## Reference +## Shallow Rendering + +> Note: +> The shallow renderer has moved to `react-test-renderer/shallow`. [Please see the updated documentation.](/react/docs/shallow-renderer.html) + ### `Simulate` ```javascript @@ -250,34 +255,3 @@ Same as [`scryRenderedComponentsWithType()`](#scryrenderedcomponentswithtype) bu * * * -## Shallow Rendering - -### `createRenderer()` - -```javascript -createRenderer() -``` - -Call this in your tests to create a [shallow renderer](#shallow-rendering). - -* * * - -### `shallowRenderer.render()` - -```javascript -shallowRenderer.render( - element -) -``` - -Similar to [`ReactDOM.render`](/react/docs/react-dom.html#render) but it doesn't require DOM and only renders a single level deep. See [Shallow Rendering](#shallow-rendering). - -* * * - -### `shallowRenderer.getRenderOutput()` - -```javascript -shallowRenderer.getRenderOutput() -``` - -After [`shallowRenderer.render()`](#shallowrenderer.render) has been called, returns shallowly rendered output.