feat: spread all of options on component (#2)

README.md

@@ -4,15 +4,15 @@
 
 ## Installation
 
-`npm i -D svelte-testing-library`
+`npm i -D svlt-testing-library`
 
 ## Usage
 
 App.svelte
 
 ```html
 <script>
-  export let name;
+  export let name
 </script>
 
 <style>
@@ -27,13 +27,23 @@ App.svelte
 App.spec.js
 
 ```javascript
-import App from "../src/App.svelte";
-import { render } from "../src";
-describe("App", () => {
-  test("should render", () => {
-    const { getByText } = render(App, { name: "world" });
-
-    expect(getByText("Hello world!"));
-  });
-});
+import App from '../src/App.svelte'
+import {render} from '../src'
+describe('App', () => {
+  test('should render greeting', () => {
+    const {getByText} = render(App, {props: {name: 'world'}})
+
+    expect(getByText('Hello world!'))
+  })
+
+  test('should change button text after click', async () => {
+    const {getByText} = render(App, {props: {name: 'world'}})
+
+    fireEvent.click(getByText('Button Text'))
+
+    const button = await waitForElement(() => getByText('Button Clicked'))
+
+    expect(button).toBeInTheDocument()
+  })
+})
 ```

src/index.js

@@ -2,12 +2,12 @@ import {getQueriesForElement} from 'dom-testing-library'
 
 export * from 'dom-testing-library'
 const mountedContainers = new Set()
-export const render = (Component, props) => {
-  const container = document.body.appendChild(document.createElement('div'))
+export const render = (Component, options) => {
+  const target = document.body.appendChild(document.createElement('div'))
 
   const rendered = new Component({
-    target: container,
-    props,
+    ...options,
+    target,
   })
 
   mountedContainers.add(rendered)

tests/queries.spec.js

@@ -5,13 +5,13 @@ import 'jest-dom/extend-expect'
 afterEach(cleanup)
 describe('queries', () => {
   test('getByText', () => {
-    const {getByText} = render(App, {name: 'world'})
+    const {getByText} = render(App, {props: {name: 'world'}})
 
     expect(getByText('Hello world!')).toBeInTheDocument()
   })
 
   test('click button', async () => {
-    const {getByText} = render(App, {name: 'world'})
+    const {getByText} = render(App, {props: {name: 'world'}})
 
     fireEvent.click(getByText('Button Text'))