[Docs] debug: Added documentation for verbose flag

- also for `ignoreProps` flag
enzymejs · Apr 18, 2019 · 2862195 · 2862195
1 parent ee12c43
commit 2862195
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 7 deletions.
diff --git a/docs/api/ReactWrapper/debug.md b/docs/api/ReactWrapper/debug.md
@@ -31,7 +31,7 @@ function Bar() {
   return (
     <div className="bar">
       <span>Non-Foo</span>
-      <Foo baz="bax" />
+      <Foo baz="bax" object={{ a: 1, b: 2 }} />
     </div>
   );
 }
@@ -50,7 +50,7 @@ Would output the following to the console:
     <span>
       Non-Foo
     </span>
-    <Foo baz="bax">
+    <Foo baz="bax" object={{...}}>
       <div className="foo">
         <span>
           Foo
@@ -92,3 +92,19 @@ Would output the following to the console:
   </div>
 </Foo>
 ```
+
+and:
+```jsx
+console.log(mount(<Bar id="2" />).find(Foo).debug({ verbose: true }));
+```
+Would output the following to the console:
+<!-- eslint-disable -->
+```jsx
+<Foo baz="bax" object={{ a: 1, b: 2 }}>
+  <div className="foo">
+    <span>
+      Foo
+    </span>
+  </div>
+</Foo>
+```
diff --git a/docs/api/ShallowWrapper/debug.md b/docs/api/ShallowWrapper/debug.md
@@ -8,6 +8,7 @@ console when tests are not passing when you expect them to.
 
 `options` (`Object` [optional]):
 - `options.ignoreProps`: (`Boolean` [optional]): Whether props should be omitted in the resulting string. Props are included by default.
+- `options.verbose`: (`Boolean` [optional]): Whether arrays and objects passed as props should be verbosely printed.
 
 #### Returns
 
@@ -21,7 +22,12 @@ function Book({ title, pages }) {
   return (
     <div>
       <h1 className="title">{title}</h1>
-      {pages && <NumberOfPages pages={pages} />}
+      {pages && (
+        <NumberOfPages
+          pages={pages}
+          object={{ a: 1, b: 2 }}
+        />
+      )}
     </div>
   );
 }
@@ -56,8 +62,8 @@ console.log(wrapper.debug());
 Outputs to console:
 ```text
 <div>
- <h1 className="title">Huckleberry Finn</h1>
- <NumberOfPages pages="633 pages" />
+  <h1 className="title">Huckleberry Finn</h1>
+  <NumberOfPages pages="633 pages" object={{...}}/>
 </div>
 ```
 
@@ -73,7 +79,25 @@ console.log(wrapper.debug({ ignoreProps: true }));
 Outputs to console:
 ```text
 <div>
- <h1>Huckleberry Finn</h1>
- <NumberOfPages />
+  <h1>Huckleberry Finn</h1>
+  <NumberOfPages />
+</div>
+```
+
+
+```jsx
+const wrapper = shallow((
+  <Book
+    title="Huckleberry Finn"
+    pages="633 pages"
+  />
+));
+console.log(wrapper.debug({ verbose: true }));
+```
+Outputs to console:
+```text
+<div>
+  <h1 className="title">Huckleberry Finn</h1>
+  <NumberOfPages pages="633 pages" object={{ a: 1, b: 2 }}/>
 </div>
 ```