[New] shallow/mount: .find: find HTML elements by their constru…

…ctor

packages/enzyme-test-suite/package.json

@@ -32,6 +32,7 @@
     "chai": "^4.1.2",
     "enzyme": "^3.8.0",
     "enzyme-adapter-utils": "^1.9.1",
+    "html-element-map": "^1.0.0",
     "jsdom": "^6.5.1",
     "lodash.isequal": "^4.5.0",
     "mocha-wrap": "^2.1.2",

packages/enzyme-test-suite/test/ReactWrapper-spec.jsx

@@ -5,6 +5,7 @@ import { expect } from 'chai';
 import sinon from 'sinon';
 import wrap from 'mocha-wrap';
 import isEqual from 'lodash.isequal';
+import getData from 'html-element-map/getData';
 import {
   mount,
   render,
@@ -1526,6 +1527,29 @@ describeWithDOM('mount', () => {
         expect(wrapper.find(Component.displayName)).to.have.lengthOf(2);
       });
     });
+
+    describeWithDOM('find DOM elements by constructor', () => {
+      const { elements, all } = getData();
+
+      elements.filter(({ constructor: C }) => C && C !== all).forEach(({
+        tag: Tag,
+        constructorName: name,
+      }) => {
+        class Foo extends React.Component {
+          render() {
+            return <Tag />;
+          }
+        }
+
+        it(`${Tag}: finds by constructor “${name}”`, () => {
+          const wrapper = mount(<Foo />);
+
+          expect(wrapper.childAt(0).type()).to.equal(Tag);
+          expect(wrapper.childAt(0).is(Tag)).to.equal(true);
+          expect(wrapper.find(Tag)).to.have.lengthOf(1);
+        });
+      });
+    });
   });
 
   describe('.findWhere(predicate)', () => {

packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx

@@ -4,6 +4,7 @@ import { expect } from 'chai';
 import sinon from 'sinon';
 import wrap from 'mocha-wrap';
 import isEqual from 'lodash.isequal';
+import getData from 'html-element-map/getData';
 import {
   shallow,
   render,
@@ -32,6 +33,7 @@ import {
 } from './_helpers/react-compat';
 import {
   describeIf,
+  describeWithDOM,
   itIf,
   itWithData,
   generateEmptyRenderData,
@@ -1523,6 +1525,29 @@ describe('shallow', () => {
         expect(wrapper.find(Component.displayName)).to.have.lengthOf(2);
       });
     });
+
+    describeWithDOM('find DOM elements by constructor', () => {
+      const { elements, all } = getData();
+
+      elements.filter(({ constructor: C }) => C && C !== all).forEach(({
+        tag: Tag,
+        constructorName: name,
+      }) => {
+        class Foo extends React.Component {
+          render() {
+            return <Tag />;
+          }
+        }
+
+        it(`${Tag}: finds by constructor “${name}”`, () => {
+          const wrapper = shallow(<Foo />);
+
+          expect(wrapper.type()).to.equal(Tag);
+          expect(wrapper.is(Tag)).to.equal(true);
+          expect(wrapper.filter(Tag)).to.have.lengthOf(1);
+        });
+      });
+    });
   });
 
   describe('.findWhere(predicate)', () => {

packages/enzyme/package.json

@@ -38,6 +38,7 @@
     "cheerio": "^1.0.0-rc.2",
     "function.prototype.name": "^1.1.0",
     "has": "^1.0.3",
+    "html-element-map": "^1.0.0",
     "is-boolean-object": "^1.0.0",
     "is-callable": "^1.1.4",
     "is-number-object": "^1.0.3",

packages/enzyme/src/selectors.js

@@ -3,6 +3,7 @@ import values from 'object.values';
 import flat from 'array.prototype.flat';
 import is from 'object-is';
 import has from 'has';
+import elementsByConstructor from 'html-element-map/byConstructor';
 import {
   treeFilter,
   nodeHasId,
@@ -362,10 +363,22 @@ function matchDescendant(nodes, predicate) {
  * the selector. The selector can be a simple selector, which
  * is handled by `buildPredicate`, or a complex CSS selector which
  * reduceTreeBySelector parses and reduces the tree based on the combinators.
- * @param {Function|Object|String} selector
+ *
+ * @param {EnzymeSelector} selector
  * @param {RSTNode} root
  */
 export function reduceTreeBySelector(selector, root) {
+  if (typeof selector !== 'string') {
+    const elements = elementsByConstructor(selector);
+    if (elements.length > 0) {
+      return flat(elements.map(x => reduceTreeBySelector(x.tag, root)));
+
+      // when https://github.com/aweary/rst-selector-parser/issues/15 is resolved
+      // const htmlTagNames = elements.map(x => x.tag).join(', ');
+      // return reduceTreeBySelector(htmlTagNames, root);
+    }
+  }
+
   if (typeof selector === 'function' || typeof selector === 'object') {
     return treeFilter(root, buildPredicate(selector));
   }