Skip to content

Commit 49e56b3

Browse files
MeemawMeemaw
authored
feat: native typescript support (#246)
1 parent 17787f3 commit 49e56b3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

62 files changed

+677
-338
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,3 +7,4 @@ dist
77
# when working with contributors
88
package-lock.json
99
yarn.lock
10+
yarn-error.log

‎.travis.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ cache: npm
55
notifications:
66
email: false
77
node_js:
8-
- 10.14
8+
- 10.18
99
- 12
1010
- node
1111
install: npm install

‎.vscode/settings.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"typescript.tsdk": "node_modules/typescript/lib"
3+
}

‎extend-expect.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import './dist/typings'

‎matchers.d.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './dist/typings/matchers'

‎package.json

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,16 @@
33
"version": "0.0.0-semantically-released",
44
"description": "Custom jest matchers to test the state of the DOM",
55
"main": "dist/index.js",
6+
"types": "dist/index.d.ts",
67
"engines": {
78
"node": ">=8",
89
"npm": ">=6",
910
"yarn": ">=1"
1011
},
1112
"scripts": {
12-
"build": "kcd-scripts build",
13+
"build": "npm run build:source && npm run build:types",
14+
"build:source": "kcd-scripts build",
15+
"build:types": "tsc -p tsconfig.build.json --emitDeclarationOnly",
1316
"format": "kcd-scripts format",
1417
"lint": "kcd-scripts lint",
1518
"setup": "npm install && npm run validate -s",
@@ -20,7 +23,9 @@
2023
"files": [
2124
"dist",
2225
"extend-expect.js",
23-
"matchers.js"
26+
"extend-expect.d.ts",
27+
"matchers.js",
28+
"matchers.d.ts"
2429
],
2530
"keywords": [
2631
"testing",
@@ -32,7 +37,6 @@
3237
"license": "MIT",
3338
"dependencies": {
3439
"@babel/runtime": "^7.9.2",
35-
"@types/testing-library__jest-dom": "^5.0.2",
3640
"chalk": "^3.0.0",
3741
"css": "^2.2.4",
3842
"css.escape": "^1.5.1",
@@ -42,11 +46,16 @@
4246
"redent": "^3.0.0"
4347
},
4448
"devDependencies": {
49+
"@types/css": "^0.0.31",
50+
"@types/jsdom": "^16.2.1",
51+
"@types/lodash": "^4.14.150",
4552
"jest-environment-jsdom-sixteen": "^1.0.3",
4653
"jest-watch-select-projects": "^2.0.0",
4754
"jsdom": "^16.2.1",
4855
"kcd-scripts": "^5.6.0",
49-
"pretty-format": "^25.1.0"
56+
"pretty-format": "^25.1.0",
57+
"ts-jest": "^25.5.0",
58+
"typescript": "^3.8.3"
5059
},
5160
"eslintConfig": {
5261
"extends": "./node_modules/kcd-scripts/eslint.js",

‎src/__tests__/helpers/document.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

‎src/__tests__/helpers/document.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import * as extensions from '../../matchers'
2+
3+
let document: Document
4+
5+
const globalWithDocument = global as {
6+
document?: Document
7+
}
8+
9+
if (globalWithDocument.document) {
10+
document = globalWithDocument.document
11+
} else {
12+
const {JSDOM} = require('jsdom')
13+
const {window} = new JSDOM()
14+
document = window.document
15+
}
16+
17+
export default document
18+
19+
type Extensions = typeof extensions
20+
21+
declare global {
22+
namespace jest {
23+
interface Matchers<R, T> extends Extensions {}
24+
}
25+
}

‎src/__tests__/helpers/test-utils.js renamed to ‎src/__tests__/helpers/test-utils.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import document from './document'
22

3-
function render(html) {
3+
function render(html: string) {
44
const container = document.createElement('div')
55
container.innerHTML = html
6-
const queryByTestId = testId =>
6+
const queryByTestId = (testId: string) =>
77
container.querySelector(`[data-testid="${testId}"]`)
88

99
// Some tests need to look up global ids with document.getElementById()

‎src/__tests__/to-be-checked.js renamed to ‎src/__tests__/to-be-checked.ts

File renamed without changes.

‎src/__tests__/to-be-disabled.js renamed to ‎src/__tests__/to-be-disabled.ts

File renamed without changes.

‎src/__tests__/to-be-empty.js renamed to ‎src/__tests__/to-be-empty.ts

File renamed without changes.

‎src/__tests__/to-be-in-the-document.js renamed to ‎src/__tests__/to-be-in-the-document.ts

File renamed without changes.

‎src/__tests__/to-be-in-the-dom.js renamed to ‎src/__tests__/to-be-in-the-dom.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@ test('.toBeInTheDOM', () => {
5252
).toThrowError()
5353

5454
expect(() => {
55+
// @ts-ignore
5556
expect(valueElement).toBeInTheDOM(fakeElement)
5657
}).toThrowError()
5758

‎src/__tests__/to-be-invalid.js renamed to ‎src/__tests__/to-be-invalid.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import {render} from './helpers/test-utils'
1919
* @link https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation
2020
* @link https://github.com/jsdom/jsdom
2121
*/
22-
function getDOMElement(htmlString, selector) {
22+
function getDOMElement(htmlString: string, selector: string) {
2323
return new JSDOM(htmlString).window.document.querySelector(selector)
2424
}
2525

‎src/__tests__/to-be-required.js renamed to ‎src/__tests__/to-be-required.ts

File renamed without changes.

‎src/__tests__/to-be-visible.js renamed to ‎src/__tests__/to-be-visible.ts

Lines changed: 30 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ describe('.toBeVisible', () => {
3838

3939
// eslint-disable-next-line max-lines-per-function
4040
describe('with a <details /> element', () => {
41-
let subject
41+
let subject: ReturnType<typeof render> | undefined
4242

4343
afterEach(() => {
4444
subject = undefined
@@ -55,26 +55,26 @@ describe('.toBeVisible', () => {
5555
})
5656

5757
it('returns true to the details content', () => {
58-
expect(subject.container.querySelector('div')).toBeVisible()
58+
expect(subject!.container.querySelector('div')).toBeVisible()
5959
})
6060

6161
it('returns true to the most inner details content', () => {
62-
expect(subject.container.querySelector('small')).toBeVisible()
62+
expect(subject!.container.querySelector('small')).toBeVisible()
6363
})
6464

6565
it('returns true to the details summary', () => {
66-
expect(subject.container.querySelector('summary')).toBeVisible()
66+
expect(subject!.container.querySelector('summary')).toBeVisible()
6767
})
6868

6969
describe('when the user clicks on the summary', () => {
70-
beforeEach(() => subject.container.querySelector('summary').click())
70+
beforeEach(() => subject!.container.querySelector('summary')!.click())
7171

7272
it('returns false to the details content', () => {
73-
expect(subject.container.querySelector('div')).not.toBeVisible()
73+
expect(subject!.container.querySelector('div')).not.toBeVisible()
7474
})
7575

7676
it('returns true to the details summary', () => {
77-
expect(subject.container.querySelector('summary')).toBeVisible()
77+
expect(subject!.container.querySelector('summary')).toBeVisible()
7878
})
7979
})
8080
})
@@ -90,22 +90,22 @@ describe('.toBeVisible', () => {
9090
})
9191

9292
it('returns false to the details content', () => {
93-
expect(subject.container.querySelector('div')).not.toBeVisible()
93+
expect(subject!.container.querySelector('div')).not.toBeVisible()
9494
})
9595

9696
it('returns true to the summary content', () => {
97-
expect(subject.container.querySelector('summary')).toBeVisible()
97+
expect(subject!.container.querySelector('summary')).toBeVisible()
9898
})
9999

100100
describe('when the user clicks on the summary', () => {
101-
beforeEach(() => subject.container.querySelector('summary').click())
101+
beforeEach(() => subject!.container.querySelector('summary')!.click())
102102

103103
it('returns true to the details content', () => {
104-
expect(subject.container.querySelector('div')).toBeVisible()
104+
expect(subject!.container.querySelector('div')).toBeVisible()
105105
})
106106

107107
it('returns true to the details summary', () => {
108-
expect(subject.container.querySelector('summary')).toBeVisible()
108+
expect(subject!.container.querySelector('summary')).toBeVisible()
109109
})
110110
})
111111
})
@@ -121,11 +121,11 @@ describe('.toBeVisible', () => {
121121
})
122122

123123
it('returns false to the details content', () => {
124-
expect(subject.container.querySelector('div')).not.toBeVisible()
124+
expect(subject!.container.querySelector('div')).not.toBeVisible()
125125
})
126126

127127
it('returns false to the details summary', () => {
128-
expect(subject.container.querySelector('summary')).not.toBeVisible()
128+
expect(subject!.container.querySelector('summary')).not.toBeVisible()
129129
})
130130
})
131131

@@ -146,23 +146,25 @@ describe('.toBeVisible', () => {
146146

147147
it('returns true to the nested details content', () => {
148148
expect(
149-
subject.container.querySelector('details > details > div'),
149+
subject!.container.querySelector('details > details > div'),
150150
).toBeVisible()
151151
})
152152

153153
it('returns true to the nested details summary', () => {
154154
expect(
155-
subject.container.querySelector('details > details > summary'),
155+
subject!.container.querySelector('details > details > summary'),
156156
).toBeVisible()
157157
})
158158

159159
it('returns true to the outer details content', () => {
160-
expect(subject.container.querySelector('details > div')).toBeVisible()
160+
expect(
161+
subject!.container.querySelector('details > div'),
162+
).toBeVisible()
161163
})
162164

163165
it('returns true to the outer details summary', () => {
164166
expect(
165-
subject.container.querySelector('details > summary'),
167+
subject!.container.querySelector('details > summary'),
166168
).toBeVisible()
167169
})
168170
})
@@ -183,23 +185,25 @@ describe('.toBeVisible', () => {
183185

184186
it('returns false to the nested details content', () => {
185187
expect(
186-
subject.container.querySelector('details > details > div'),
188+
subject!.container.querySelector('details > details > div'),
187189
).not.toBeVisible()
188190
})
189191

190192
it('returns true to the nested details summary', () => {
191193
expect(
192-
subject.container.querySelector('details > details > summary'),
194+
subject!.container.querySelector('details > details > summary'),
193195
).toBeVisible()
194196
})
195197

196198
it('returns true to the outer details content', () => {
197-
expect(subject.container.querySelector('details > div')).toBeVisible()
199+
expect(
200+
subject!.container.querySelector('details > div'),
201+
).toBeVisible()
198202
})
199203

200204
it('returns true to the outer details summary', () => {
201205
expect(
202-
subject.container.querySelector('details > summary'),
206+
subject!.container.querySelector('details > summary'),
203207
).toBeVisible()
204208
})
205209
})
@@ -220,25 +224,25 @@ describe('.toBeVisible', () => {
220224

221225
it('returns false to the nested details content', () => {
222226
expect(
223-
subject.container.querySelector('details > details > div'),
227+
subject!.container.querySelector('details > details > div'),
224228
).not.toBeVisible()
225229
})
226230

227231
it('returns false to the nested details summary', () => {
228232
expect(
229-
subject.container.querySelector('details > details > summary'),
233+
subject!.container.querySelector('details > details > summary'),
230234
).not.toBeVisible()
231235
})
232236

233237
it('returns false to the outer details content', () => {
234238
expect(
235-
subject.container.querySelector('details > div'),
239+
subject!.container.querySelector('details > div'),
236240
).not.toBeVisible()
237241
})
238242

239243
it('returns true to the outer details summary', () => {
240244
expect(
241-
subject.container.querySelector('details > summary'),
245+
subject!.container.querySelector('details > summary'),
242246
).toBeVisible()
243247
})
244248
})

‎src/__tests__/to-contain-element.js renamed to ‎src/__tests__/to-contain-element.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ test('.toContainElement negative test cases', () => {
4444
expect(nonExistantElement).toContainElement(nonExistantElement),
4545
).toThrowError()
4646
expect(() =>
47+
// @ts-ignore
4748
expect(nonExistantElement).toContainElement(fakeElement),
4849
).toThrowError()
4950
expect(() =>
@@ -53,7 +54,9 @@ test('.toContainElement negative test cases', () => {
5354
expect(fakeElement).not.toContainElement(nonExistantElement),
5455
).toThrowError()
5556
expect(() => expect(fakeElement).toContainElement(grandparent)).toThrowError()
57+
// @ts-ignore
5658
expect(() => expect(grandparent).toContainElement(fakeElement)).toThrowError()
59+
// @ts-ignore
5760
expect(() => expect(fakeElement).toContainElement(fakeElement)).toThrowError()
5861
expect(() => expect(grandparent).not.toContainElement(child)).toThrowError()
5962
expect(() =>

‎src/__tests__/to-contain-html.js renamed to ‎src/__tests__/to-contain-html.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,9 +38,11 @@ test('.toContainHTML', () => {
3838
expect(nonExistantElement).not.toContainHTML(stringChildElement),
3939
).toThrowError()
4040
expect(() =>
41+
// @ts-ignore
4142
expect(nonExistantElement).not.toContainHTML(nonExistantElement),
4243
).toThrowError()
4344
expect(() =>
45+
// @ts-ignore
4446
expect(stringChildElement).not.toContainHTML(fakeElement),
4547
).toThrowError()
4648
expect(() =>
@@ -63,9 +65,12 @@ test('.toContainHTML', () => {
6365
expect(() =>
6466
expect(grandparent).toContainHTML(nonExistantString),
6567
).toThrowError()
68+
// @ts-ignore
6669
expect(() => expect(child).toContainHTML(nonExistantElement)).toThrowError()
70+
// @ts-ignore
6771
expect(() => expect(parent).toContainHTML(nonExistantElement)).toThrowError()
6872
expect(() =>
73+
// @ts-ignore
6974
expect(grandparent).toContainHTML(nonExistantElement),
7075
).toThrowError()
7176
expect(() =>

‎src/__tests__/to-have-attribute.js renamed to ‎src/__tests__/to-have-attribute.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ test('.toHaveAttribute', () => {
3939
expect(queryByTestId('svg-element')).not.toHaveAttribute('width', '12'),
4040
).toThrowError()
4141
expect(() =>
42+
// @ts-ignore
4243
expect({thisIsNot: 'an html element'}).not.toHaveAttribute(),
4344
).toThrowError()
4445

‎src/__tests__/to-have-class.js renamed to ‎src/__tests__/to-have-class.ts

File renamed without changes.

‎src/__tests__/to-have-description.js renamed to ‎src/__tests__/to-have-description.ts

File renamed without changes.

0 commit comments

Comments
 (0)