feat: native typescript support (#246)

Author: Meemaw

.gitignore

@@ -7,3 +7,4 @@ dist
 # when working with contributors
 package-lock.json
 yarn.lock
+yarn-error.log

.travis.yml

@@ -5,7 +5,7 @@ cache: npm
 notifications:
   email: false
 node_js:
-  - 10.14
+  - 10.18
   - 12
   - node
 install: npm install

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "typescript.tsdk": "node_modules/typescript/lib"
+}

extend-expect.d.ts

@@ -0,0 +1 @@
+import './dist/typings'

matchers.d.ts

@@ -0,0 +1 @@
+export * from './dist/typings/matchers'

package.json

@@ -3,13 +3,16 @@
   "version": "0.0.0-semantically-released",
   "description": "Custom jest matchers to test the state of the DOM",
   "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "engines": {
     "node": ">=8",
     "npm": ">=6",
     "yarn": ">=1"
   },
   "scripts": {
-    "build": "kcd-scripts build",
+    "build": "npm run build:source && npm run build:types",
+    "build:source": "kcd-scripts build",
+    "build:types": "tsc -p tsconfig.build.json --emitDeclarationOnly",
     "format": "kcd-scripts format",
     "lint": "kcd-scripts lint",
     "setup": "npm install && npm run validate -s",
@@ -20,7 +23,9 @@
   "files": [
     "dist",
     "extend-expect.js",
-    "matchers.js"
+    "extend-expect.d.ts",
+    "matchers.js",
+    "matchers.d.ts"
   ],
   "keywords": [
     "testing",
@@ -32,7 +37,6 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.9.2",
-    "@types/testing-library__jest-dom": "^5.0.2",
     "chalk": "^3.0.0",
     "css": "^2.2.4",
     "css.escape": "^1.5.1",
@@ -42,11 +46,16 @@
     "redent": "^3.0.0"
   },
   "devDependencies": {
+    "@types/css": "^0.0.31",
+    "@types/jsdom": "^16.2.1",
+    "@types/lodash": "^4.14.150",
     "jest-environment-jsdom-sixteen": "^1.0.3",
     "jest-watch-select-projects": "^2.0.0",
     "jsdom": "^16.2.1",
     "kcd-scripts": "^5.6.0",
-    "pretty-format": "^25.1.0"
+    "pretty-format": "^25.1.0",
+    "ts-jest": "^25.5.0",
+    "typescript": "^3.8.3"
   },
   "eslintConfig": {
     "extends": "./node_modules/kcd-scripts/eslint.js",

src/__tests__/helpers/document.js

@@ -0,0 +1,25 @@
+import * as extensions from '../../matchers'
+
+let document: Document
+
+const globalWithDocument = global as {
+  document?: Document
+}
+
+if (globalWithDocument.document) {
+  document = globalWithDocument.document
+} else {
+  const {JSDOM} = require('jsdom')
+  const {window} = new JSDOM()
+  document = window.document
+}
+
+export default document
+
+type Extensions = typeof extensions
+
+declare global {
+  namespace jest {
+    interface Matchers<R, T> extends Extensions {}
+  }
+}

src/__tests__/helpers/document.ts

@@ -1,9 +1,9 @@
 import document from './document'
 
-function render(html) {
+function render(html: string) {
   const container = document.createElement('div')
   container.innerHTML = html
-  const queryByTestId = testId =>
+  const queryByTestId = (testId: string) =>
     container.querySelector(`[data-testid="${testId}"]`)
 
   // Some tests need to look up global ids with document.getElementById()