@@ -163,27 +163,19 @@ expect(getByTestId(container, 'delete-button')).not.toHaveClass('btn-link')
163
163
164
164
### Using with Typescript
165
165
166
- When you use custom Jest Matchers with Typescript, you will need to extend the
167
- type signature of ` jest.Matchers<void> ` , then cast the result of ` expect `
168
- accordingly. Here's a handy usage example :
166
+ When you use custom Jest Matchers with Typescript, you can extend ` jest.Matchers `
167
+ interface provided by ` @types/ jest` package by creating ` .d.ts ` file somewhere
168
+ in your project with following content :
169
169
170
170
``` typescript
171
- // this adds custom expect matchers once
172
- import ' jest-dom/extend-expect'
173
-
174
- interface ExtendedMatchers extends jest .Matchers <void > {
175
- toHaveTextContent: (htmlElement : string ) => object
176
- toBeInTheDOM: () => void
171
+ declare namespace jest {
172
+ interface Matchers <R > {
173
+ toHaveAttribute: (attr : string , value ? : string ) => R
174
+ toHaveTextContent: (htmlElement : string ) => R
175
+ toHaveClass: (className : string ) => R
176
+ toBeInTheDOM: () => R
177
+ }
177
178
}
178
-
179
- test (' renders the tooltip as expected' , async () => {
180
- // however you render it:
181
- // render(`<div><span>hello world</span></div>`)
182
- ;(expect (
183
- container ,
184
- document .querySelector (' span' ),
185
- ) as ExtendedMatchers ).toHaveTextContent (' hello world' )
186
- })
187
179
```
188
180
189
181
## Inspiration
0 commit comments