Skip to content

Commit a20a636

Browse files
committed
Added example for container (#114)
* Added example for container This should be merged after testing-library/svelte-testing-library#24 will be published * Created new section for containers
1 parent 3a35111 commit a20a636

File tree

1 file changed

+37
-0
lines changed

1 file changed

+37
-0
lines changed

docs/svelte-testing-library/intro.md

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,43 @@ describe('App', () => {
6969
})
7070
```
7171

72+
### Containers
73+
74+
Useful for snapshot tests. You can use query the container if you need more granular tests.
75+
76+
App.svelte
77+
78+
```html
79+
<script>
80+
export let name
81+
</script>
82+
83+
<style>
84+
h1 {
85+
color: purple;
86+
}
87+
</style>
88+
89+
<h1>Hello {name}!</h1>
90+
```
91+
92+
App.spec.js
93+
94+
```javascript
95+
import App from '../src/App.svelte'
96+
import { render, cleanup } from 'svelte-testing-library'
97+
beforeEach(cleanup)
98+
describe('App', () => {
99+
test('should render greeting', () => {
100+
const { container } = render(App, { props: { name: 'world' } })
101+
102+
expect(container.querySelector('h1').innerHTML).toBe('Hello world!')
103+
expect(container.firstChild).toMatchSnapshot()
104+
})
105+
106+
})
107+
```
108+
72109
### Cleanup
73110

74111
You can ensure [`cleanup`](./api#cleanup) is called after each test and import

0 commit comments

Comments
 (0)