fix: handle bare div mount (#118)

Author: bahmutov

cypress/integration/empty-spec.js

@@ -0,0 +1,16 @@
+/// <reference types="cypress" />
+/// <reference types="../../lib" />
+import React from 'react'
+
+/* eslint-env mocha */
+describe('Empty div jsx', () => {
+  it('works with El', () => {
+    const El = () => <div>foo</div>
+    cy.mount(<El></El>)
+  })
+
+  it('works with div', () => {
+    cy.mount(<div>I am a div</div>)
+    cy.contains('I am a div').should('be.visible')
+  })
+})

lib/getDisplayName.ts

@@ -49,4 +49,4 @@ export default function getDisplayName(type: JSX, fallbackName: string = 'Unknow
   cachedDisplayNames.set(type, displayName)
 
   return displayName
-}
+}

lib/index.ts

@@ -108,7 +108,8 @@ Cypress.Commands.add('copyComponentStyles', component => {
  **/
 export const mount = (jsx: JSXElement, alias?: string) => {
   // Get the display name property via the component constructor
-  const displayname = getDisplayName(jsx.type, alias)
+  const jsxType = typeof jsx.type === 'string' ? jsx as unknown as JSX : jsx.type
+  const displayname = getDisplayName(jsxType, alias)
 
   let cmd: Cypress.Log;