Clarify docs for contains() and containsMatchingElement()

docs/api/ReactWrapper/contains.md

@@ -1,7 +1,7 @@
 # `.contains(nodeOrNodes) => Boolean`
 
-Returns whether or not the current wrapper has a node anywhere in it's render tree that looks like
-the one passed in.
+Returns whether or not all given react elements match elements in the render tree.
+It will determine if an element in the wrapper matches the expected element by checking if the expected element has the same props as the wrapper's element and share the same values.
 
 
 #### Arguments
@@ -13,17 +13,27 @@ render tree.
 
 #### Returns
 
-`Boolean`: whether or not the current wrapper has a node anywhere in it's render tree that looks
-like the one passed in.
+`Boolean`: whether or not the current wrapper has nodes anywhere in its render tree that match
+the ones passed in.
 
 
 
 #### Example
 
 
 ```jsx
-const wrapper = mount(<MyComponent />);
-expect(wrapper.contains(<div className="foo bar" />)).to.equal(true);
+const wrapper = mount(
+  <div>
+    <div data-foo="foo" data-bar="bar">Hello</div>
+  </div>
+);
+
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar">Hello</div>)).to.equal(true);
+
+expect(wrapper.contains(<div data-foo="foo">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar" data-baz="baz">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="Hello">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar" />)).to.equal(false);
 ```
 
 ```jsx
@@ -39,6 +49,11 @@ expect(wrapper.contains([
   <span>Hello</span>,
   <div>Goodbye</div>,
 ])).to.equal(true);
+
+expect(wrapper.contains([
+  <span>Hello</span>,
+  <div>World</div>,
+])).to.equal(false);
 ```
 
 

docs/api/ReactWrapper/containsMatchingElement.md

@@ -1,7 +1,7 @@
 # `.containsMatchingElement(node) => Boolean`
 
-Returns whether or not a given react element is matching one element in the render tree.
-It will determine if an element in the wrapper __looks like__ the expected element by checking if all props of the expected element are present on the wrappers element and equals to each other.
+Returns whether or not a given react element matches one element in the render tree.
+It will determine if an element in the wrapper matches the expected element by checking if all props of the expected element are present on the wrapper's element and equals to each other.
 
 
 #### Arguments
@@ -13,35 +13,37 @@ render tree.
 
 #### Returns
 
-`Boolean`: whether or not the current wrapper has a node anywhere in its render tree that looks
-like the one passed in.
+`Boolean`: whether or not the current wrapper has a node anywhere in its render tree that matches
+the one passed in.
 
 
 
 #### Example
 
 
 ```jsx
-const MyComponent = React.createClass({
-  handleClick() {
-    ...
-  },
-  render() {
-    return (
-      <div>
-        <div onClick={this.handleClick} className="foo bar">Hello</div>
-      </div>
-    );
-  }
-});
-
-const wrapper = mount(<MyComponent />);
+const wrapper = mount(
+  <div>
+    <div data-foo="foo" data-bar="bar">Hello</div>
+  </div>
+);
+
 expect(wrapper.containsMatchingElement(
-  <div>Hello</div>
+  <div data-foo="foo" data-bar="bar">Hello</div>
 )).to.equal(true);
 expect(wrapper.containsMatchingElement(
-  <div className="foo bar">Hello</div>
+  <div data-foo="foo">Hello</div>
 )).to.equal(true);
+
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="bar" data-baz="baz">Hello</div>
+)).to.equal(false);
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="Hello">Hello</div>
+)).to.equal(false);
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="bar" />
+)).to.equal(false);
 ```
 
 #### Common Gotchas

docs/api/ShallowWrapper/contains.md

@@ -1,7 +1,7 @@
 # `.contains(nodeOrNodes) => Boolean`
 
-Returns whether or not the current wrapper has a node anywhere in its render tree that looks like
-the one passed in.
+Returns whether or not all given react elements match elements in the render tree.
+It will determine if an element in the wrapper matches the expected element by checking if the expected element has the same props as the wrapper's element and share the same values.
 
 
 #### Arguments
@@ -13,17 +13,27 @@ render tree.
 
 #### Returns
 
-`Boolean`: whether or not the current wrapper has a node anywhere in its render tree that looks
-like the one passed in.
+`Boolean`: whether or not the current wrapper has nodes anywhere in its render tree that match
+the ones passed in.
 
 
 
 #### Example
 
 
 ```jsx
-const wrapper = shallow(<MyComponent />);
-expect(wrapper.contains(<div className="foo bar" />)).to.equal(true);
+const wrapper = shallow(
+  <div>
+    <div data-foo="foo" data-bar="bar">Hello</div>
+  </div>
+);
+
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar">Hello</div>)).to.equal(true);
+
+expect(wrapper.contains(<div data-foo="foo">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar" data-baz="baz">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="Hello">Hello</div>)).to.equal(false);
+expect(wrapper.contains(<div data-foo="foo" data-bar="bar" />)).to.equal(false);
 ```
 
 ```jsx
@@ -39,6 +49,11 @@ expect(wrapper.contains([
   <span>Hello</span>,
   <div>Goodbye</div>,
 ])).to.equal(true);
+
+expect(wrapper.contains([
+  <span>Hello</span>,
+  <div>World</div>,
+])).to.equal(false);
 ```
 
 

docs/api/ShallowWrapper/containsMatchingElement.md

@@ -1,7 +1,7 @@
 # `.containsMatchingElement(node) => Boolean`
 
-Returns whether or not a given react element is matching one element in the shallow render tree.
-It will determine if an element in the wrapper __looks like__ the expected element by checking if all props of the expected element are present on the wrappers element and equals to each other.
+Returns whether or not a given react element matches one element in the render tree.
+It will determine if an element in the wrapper matches the expected element by checking if all props of the expected element are present on the wrapper's element and equals to each other.
 
 
 #### Arguments
@@ -13,35 +13,37 @@ render tree.
 
 #### Returns
 
-`Boolean`: whether or not the current wrapper has a node anywhere in its render tree that looks
-like the one passed in.
+`Boolean`: whether or not the current wrapper has a node anywhere in its render tree that matches
+the one passed in.
 
 
 
 #### Example
 
 
 ```jsx
-const MyComponent = React.createClass({
-  handleClick() {
-    ...
-  },
-  render() {
-    return (
-      <div>
-        <div onClick={this.handleClick} className="foo bar">Hello</div>
-      </div>
-    );
-  }
-});
-
-const wrapper = shallow(<MyComponent />);
+const wrapper = shallow(
+  <div>
+    <div data-foo="foo" data-bar="bar">Hello</div>
+  </div>
+);
+
 expect(wrapper.containsMatchingElement(
-  <div>Hello</div>
+  <div data-foo="foo" data-bar="bar">Hello</div>
 )).to.equal(true);
 expect(wrapper.containsMatchingElement(
-  <div className="foo bar">Hello</div>
+  <div data-foo="foo">Hello</div>
 )).to.equal(true);
+
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="bar" data-baz="baz">Hello</div>
+)).to.equal(false);
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="Hello">Hello</div>
+)).to.equal(false);
+expect(wrapper.containsMatchingElement(
+  <div data-foo="foo" data-bar="bar" />
+)).to.equal(false);
 ```
 
 #### Common Gotchas