chore(types): Typescript migrate src/screen.js -> src/screen.ts (#494)

Also update test snapshots

Author: Rayat Rahman

src/__tests__/get-user-code-frame.js

@@ -39,13 +39,13 @@ test('it returns only user code frame when code frames from node_modules are fir
   const userTrace = getUserCodeFrame(stack)
 
   expect(userTrace).toMatchInlineSnapshot(`
-    /sample-error/error-example.js:7:14
-      5 |         document.createTextNode('Hello world')
-      6 |       )
-    > 7 |       screen.debug()
-        |              ^
-    
-  `)
+"/sample-error/error-example.js:7:14
+  5 |         document.createTextNode('Hello world')
+  6 |       )
+> 7 |       screen.debug()
+    |              ^
+"
+`)
 })
 
 test('it returns only user code frame when node code frames are present afterwards', () => {
@@ -59,13 +59,13 @@ test('it returns only user code frame when node code frames are present afterwar
   const userTrace = getUserCodeFrame()
 
   expect(userTrace).toMatchInlineSnapshot(`
-    /sample-error/error-example.js:7:14
-      5 |         document.createTextNode('Hello world')
-      6 |       )
-    > 7 |       screen.debug()
-        |              ^
-    
-  `)
+"/sample-error/error-example.js:7:14
+  5 |         document.createTextNode('Hello world')
+  6 |       )
+> 7 |       screen.debug()
+    |              ^
+"
+`)
 })
 
 test("it returns empty string if file from code frame can't be read", () => {

src/screen.js renamed to src/screen.ts

@@ -1,33 +1,40 @@
 import {compressToEncodedURIComponent} from 'lz-string'
-import * as queries from './queries'
+import type {OptionsReceived} from 'pretty-format'
 import {getQueriesForElement} from './get-queries-for-element'
-import {logDOM} from './pretty-dom'
 import {getDocument} from './helpers'
+import {logDOM} from './pretty-dom'
+import * as queries from './queries'
 
-function unindent(string) {
+function unindent(string: string) {
   // remove white spaces first, to save a few bytes.
   // testing-playground will reformat on load any ways.
   return string.replace(/[ \t]*[\n][ \t]*/g, '\n')
 }
 
-function encode(value) {
+function encode(value: string) {
   return compressToEncodedURIComponent(unindent(value))
 }
 
-function getPlaygroundUrl(markup) {
+function getPlaygroundUrl(markup: string) {
   return `https://testing-playground.com/#markup=${encode(markup)}`
 }
 
-const debug = (element, maxLength, options) =>
+const debug = (
+  element: (Element | HTMLDocument)[],
+  maxLength?: number,
+  options?: OptionsReceived,
+) =>
   Array.isArray(element)
     ? element.forEach(el => logDOM(el, maxLength, options))
     : logDOM(element, maxLength, options)
 
 const logTestingPlaygroundURL = (element = getDocument().body) => {
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
   if (!element || !('innerHTML' in element)) {
     console.log(`The element you're providing isn't a valid DOM element.`)
     return
   }
+  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
   if (!element.innerHTML) {
     console.log(`The provided element doesn't have any children.`)
     return
@@ -37,15 +44,22 @@ const logTestingPlaygroundURL = (element = getDocument().body) => {
   )
 }
 
-const initialValue = {debug, logTestingPlaygroundURL}
+const initialValue: {
+  [key in keyof typeof queries | 'debug' | 'logTestingPlaygroundURL']?: Function
+} = {debug, logTestingPlaygroundURL}
+
 export const screen =
-  typeof document !== 'undefined' && document.body
+  typeof document !== 'undefined' && document.body // eslint-disable-line @typescript-eslint/no-unnecessary-condition
     ? getQueriesForElement(document.body, queries, initialValue)
-    : Object.keys(queries).reduce((helpers, key) => {
+    : typedKeysOf(queries).reduce<typeof initialValue>((helpers, key) => {
         helpers[key] = () => {
           throw new TypeError(
             'For queries bound to document.body a global document has to be available... Learn more: https://testing-library.com/s/screen-global-error',
           )
         }
         return helpers
       }, initialValue)
+
+function typedKeysOf<O extends Object>(o: O) {
+  return Object.keys(o) as Array<keyof O>
+}