diff --git a/package.json b/package.json index b168955..1c1770c 100644 --- a/package.json +++ b/package.json @@ -76,12 +76,11 @@ "eslint-plugin-svelte3": "^2.7.3", "husky": "^3.0.8", "jest": "^24.7.1", - "jest-transform-svelte": "^2.1.0", "lint-staged": "^9.4.1", "npm-run-all": "^4.1.5", "prettier": "^1.18.2", "svelte": "^3.0.0", - "svelte-test": "^0.4.0" + "svelte-jester": "^1.0.3" }, "husky": { "hooks": { @@ -122,8 +121,8 @@ ], "transform": { "^.+\\.js$": "babel-jest", - "^.+\\.svelte$": "jest-transform-svelte", - "^.+\\.html$": "svelte-test/transform" + "^.+\\.svelte$": "svelte-jester", + "^.+\\.html$": "svelte-jester" }, "moduleFileExtensions": [ "js", diff --git a/src/__tests__/__snapshots__/render.test.js.snap b/src/__tests__/__snapshots__/render.test.js.snap new file mode 100644 index 0000000..3a921d0 --- /dev/null +++ b/src/__tests__/__snapshots__/render.test.js.snap @@ -0,0 +1,20 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`render should accept svelte component options 1`] = ` + +
+

+ Hello + World + ! +

+ + +
+
+ +`; diff --git a/src/__tests__/render.test.js b/src/__tests__/render.test.js index 17170e6..bf8a58d 100644 --- a/src/__tests__/render.test.js +++ b/src/__tests__/render.test.js @@ -40,6 +40,24 @@ describe('render', () => { expect(getByText('Hello Worlds!')).toBeInTheDocument() }) + test('should accept props directly', () => { + const { getByText } = stlRender(Comp, { name: 'World' }) + expect(getByText('Hello World!')).toBeInTheDocument() + }) + + test('should accept svelte component options', () => { + const target = document.createElement('div') + const div = document.createElement('div') + document.body.appendChild(target) + target.appendChild(div) + const { container } = stlRender(Comp, { + target, + anchor: div, + props: { name: 'World' } + }) + expect(container).toMatchSnapshot() + }) + test('should return a container object, which contains the DOM of the rendered component', () => { const { container } = render() diff --git a/src/pure.js b/src/pure.js index 456213b..1e6316f 100644 --- a/src/pure.js +++ b/src/pure.js @@ -4,6 +4,8 @@ import { tick } from 'svelte' const containerCache = new Map() const componentCache = new Set() +const svleteComponentOptions = ['anchor', 'props', 'hydrate', 'intro'] + const render = ( Component, { target, ...options } = {}, @@ -13,10 +15,11 @@ const render = ( target = target || container.appendChild(document.createElement('div')) const ComponentConstructor = Component.default || Component + const isProps = !Object.keys(options).some(option => svleteComponentOptions.includes(option)) const component = new ComponentConstructor({ target, - ...options + ...(isProps ? { props: options } : options) }) containerCache.set(container, { target, component })