[Fix] selectors: fix descendant selector.

(Selectors like '.foo div' should not match on `<div className="foo" />`)
enzymejs · Jun 17, 2018 · 40a2ce3 · 40a2ce3
1 parent a50570d
commit 40a2ce3
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 4 deletions.
diff --git a/packages/enzyme-test-suite/test/selector-spec.jsx b/packages/enzyme-test-suite/test/selector-spec.jsx
@@ -46,6 +46,7 @@ describe('selectors', () => {
 
         expect(wrapper.find('span')).to.have.lengthOf(2);
         expect(wrapper.find('.top-div span')).to.have.lengthOf(1);
+        expect(wrapper.find('div div')).to.have.lengthOf(2);
       });
 
       it('nested descendent', () => {
@@ -68,7 +69,7 @@ describe('selectors', () => {
       });
 
       it('deep descendent', () => {
-        const wrapper = renderMethod((
+        const htmlWrapper = renderMethod((
           <div>
             <div>
               <div className="inner">
@@ -83,8 +84,43 @@ describe('selectors', () => {
           </div>
         ));
 
-        expect(wrapper.find('h1')).to.have.lengthOf(2);
-        expect(wrapper.find('div .inner span .way-inner h1')).to.have.lengthOf(1);
+        expect(htmlWrapper.find('h1')).to.have.lengthOf(2);
+        expect(htmlWrapper.find('div .inner span .way-inner h1')).to.have.lengthOf(1);
+        expect(htmlWrapper.find('div div div div')).to.have.lengthOf(1);
+        expect(htmlWrapper.find('div div div')).to.have.lengthOf(2);
+        expect(htmlWrapper.find('div span div')).to.have.lengthOf(1);
+
+        class ExampleComponent extends React.Component {
+          render() {
+            return <span>Hello world</span>;
+          }
+        }
+
+        const complexWrapper = renderMethod((
+          <div>
+            <div>
+              <ExampleComponent>
+                <main />
+              </ExampleComponent>
+            </div>
+            <ExampleComponent>
+              <nav />
+              <main />
+            </ExampleComponent>
+          </div>
+        ));
+
+        expect(complexWrapper.find('div ExampleComponent')).to.have.lengthOf(2);
+        expect(complexWrapper.find('div div ExampleComponent')).to.have.lengthOf(1);
+        if (name === 'shallow') {
+          expect(complexWrapper.find('div ExampleComponent nav')).to.have.lengthOf(1);
+          expect(complexWrapper.find('div ExampleComponent main')).to.have.lengthOf(2);
+        } else { // shallow does not render the contents of components
+          expect(complexWrapper.find('div ExampleComponent span')).to.have.lengthOf(2);
+          expect(complexWrapper.find('div div ExampleComponent span')).to.have.lengthOf(1);
+          expect(complexWrapper.find('div span')).to.have.lengthOf(2);
+          expect(complexWrapper.find('div div span')).to.have.lengthOf(1);
+        }
       });
 
       it('direct descendent', () => {

diff --git a/packages/enzyme/src/selectors.js b/packages/enzyme/src/selectors.js
@@ -343,7 +343,7 @@ function matchDirectChild(nodes, predicate) {
 function matchDescendant(nodes, predicate) {
   return uniqueReduce(
     (matches, node) => matches.concat(treeFilter(node, predicate)),
-    nodes,
+    flat(nodes.map(childrenOfNode)),
   );
 }