Check the default property of Component for the constructor

jest.config.js

@@ -6,6 +6,7 @@ const config = Object.assign(jestConfig, {
   transform: {
     ...jestConfig.transform,
     '^.+\\.svelte$': 'jest-transform-svelte',
+    '^.+\\.html$': 'svelte-test/transform',
   },
   transformIgnorePatterns: [
     ...jestConfig.transformIgnorePatterns,

package.json

@@ -23,7 +23,8 @@
     "rollup-plugin-svelte": "^5.0.3",
     "rollup-plugin-terser": "^4.0.4",
     "sirv-cli": "^0.4.0",
-    "svelte": "^3.0.0"
+    "svelte": "^3.0.0",
+    "svelte-test": "^0.3.0"
   },
   "peerDependencies": {
     "svelte": "3.x"
@@ -58,4 +59,4 @@
     "dist",
     "public"
   ]
-}
+}

src/index.js

@@ -7,7 +7,8 @@ export const render = (Component, {target, ...options} = {}) => {
     target = document.body.appendChild(document.createElement('div'))
   }
 
-  const component = new Component({
+  const ComponentConstructor = Component.default || Component
+  const component = new ComponentConstructor({
     ...options,
     target,
   })

tests/example/App.html

@@ -0,0 +1,19 @@
+<script>
+	export let name;
+
+	let buttonText = "Button Text";
+
+	function handleClick() {
+	  buttonText = "Button Clicked";
+	}
+</script>
+
+<style>
+	h1 {
+	  color: purple;
+	}
+</style>
+
+<h1>Hello {name}!</h1>
+
+<button on:click={handleClick}>{buttonText}</button>

tests/render.spec.js

@@ -7,6 +7,7 @@ import {
   prettyDOM,
 } from '../src'
 import App from './example/App.svelte'
+import App2 from './example/App.html'
 import 'jest-dom/extend-expect'
 
 afterEach(cleanup)
@@ -82,4 +83,10 @@ describe('render', () => {
 
     cleanup()
   })
+
+  test('correctly find component constructor on the default property', () => {
+    const {getByText} = render(App2, {props: {name: 'world'}})
+
+    expect(getByText('Hello world!')).toBeInTheDocument()
+  })
 })