feat: support asyncUtilsTimeout option via configure() API

Closes #460
testing-library · Jul 25, 2022 · 081814d · 081814d
1 parent 1ffcd7b
commit 081814d
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 16 deletions.
diff --git a/lib/index.ts b/lib/index.ts
@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-unsafe-argument */
+
 import {readFileSync} from 'fs'
 import * as path from 'path'
 
@@ -177,14 +179,21 @@ export function configure(options: Partial<ConfigurationOptions>): void {
     return
   }
 
-  const {testIdAttribute} = options
+  const {testIdAttribute, asyncUtilTimeout} = options
 
   if (testIdAttribute) {
     delegateFnBodyToExecuteInPage = delegateFnBodyToExecuteInPageInitial.replace(
       /testIdAttribute: (['|"])data-testid(['|"])/g,
       `testIdAttribute: $1${testIdAttribute}$2`,
     )
   }
+
+  if (asyncUtilTimeout) {
+    delegateFnBodyToExecuteInPage = delegateFnBodyToExecuteInPageInitial.replace(
+      /asyncUtilTimeout: \d+/g,
+      `asyncUtilTimeout: ${asyncUtilTimeout}`,
+    )
+  }
 }
 
 export function getQueriesForElement<T>(

diff --git a/lib/typedefs.ts b/lib/typedefs.ts
@@ -191,4 +191,5 @@ export interface Queries extends QueryMethods {
 
 export interface ConfigurationOptions {
   testIdAttribute: string
+  asyncUtilTimeout: number
 }
diff --git a/test/standalone/index.test.ts b/test/standalone/index.test.ts
@@ -124,6 +124,22 @@ describe('lib/index.ts', () => {
     expect(await queries.getNodeText(element)).toEqual('Hello h1')
   })
 
+  it('should support regex on raw queries object', async () => {
+    const scope = await page.$('#scoped')
+    if (!scope) throw new Error('Should have scope')
+    const element = await queries.getByText(scope, /Hello/i)
+    expect(await queries.getNodeText(element)).toEqual('Hello h3')
+  })
+
+  it('should bind getQueriesForElement', async () => {
+    // FIXME: I think it will take some work to get the types in a
+    // place to prevent @typescript-eslint from flagging this
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    const {getByText} = getQueriesForElement(await getDocument(page))
+    const element = await getByText('Hello h1')
+    expect(await queries.getNodeText(element)).toEqual('Hello h1')
+  })
+
   describe('configuration', () => {
     afterEach(() => {
       configure({testIdAttribute: 'data-testid'}) // cleanup
@@ -148,34 +164,42 @@ describe('lib/index.ts', () => {
       'should keep the default data-testid when input passed is invalid (%s)',
       async options => {
         const document = await getDocument(page)
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
         configure(options as any)
         const element = await queries.getByTestId(document, 'testid-label')
         expect(await queries.getNodeText(element)).toEqual('Label A')
       },
     )
-  })
-  it('should support regex on raw queries object', async () => {
-    const scope = await page.$('#scoped')
-    if (!scope) throw new Error('Should have scope')
-    const element = await queries.getByText(scope, /Hello/i)
-    expect(await queries.getNodeText(element)).toEqual('Hello h3')
-  })
 
-  it('should bind getQueriesForElement', async () => {
-    // FIXME: I think it will take some work to get the types in a
-    // place to prevent @typescript-eslint from flagging this
-    // eslint-disable-next-line @typescript-eslint/unbound-method
-    const {getByText} = getQueriesForElement(await getDocument(page))
-    const element = await getByText('Hello h1')
-    expect(await queries.getNodeText(element)).toEqual('Hello h1')
+    describe('async utils timeout', () => {
+      beforeEach(async () =>
+        page.goto(`file://${path.join(__dirname, '../fixtures/late-page.html')}`),
+      )
+
+      it('supports configuring timeout for findBy* queries', async () => {
+        configure({asyncUtilTimeout: 9000})
+
+        const element = await queries.findByText(await getDocument(page), 'Loaded!')
+
+        expect(element).toBeTruthy()
+      }, 9000)
+    })
   })
 
   describe('loading the deferred page', () => {
     beforeEach(async () =>
       page.goto(`file://${path.join(__dirname, '../fixtures/late-page.html')}`),
     )
 
-    it('should use `wait` properly', async () => {
+    it('waits for deferred element using findBy* queries', async () => {
+      const element = await queries.findByText(await getDocument(page), 'Loaded!', undefined, {
+        timeout: 9000,
+      })
+
+      expect(element).toBeTruthy()
+    }, 9000)
+
+    it('waits for deferred element using `waitFor`', async () => {
       // FIXME: I think it will take some work to get the types in a
       // place to prevent @typescript-eslint from flagging this
       // eslint-disable-next-line @typescript-eslint/unbound-method