feat(config): add new eventWrapper config for wrapping fireEvent

This is intended for supporting `act` in React, but should be useful for
other frameworks (I think it could help with triggering change detection
for angular for example).

Ref: testing-library/user-event#188,
testing-library/user-event#255,
https://github.com/testing-library/user-event/issues/277

Author: kentcdodds

src/__tests__/event-wrapper.js

@@ -0,0 +1,31 @@
+import {configure, fireEvent} from '..'
+
+let originalConfig
+
+beforeEach(() => {
+  configure(oldConfig => {
+    originalConfig = oldConfig
+    return null
+  })
+})
+
+afterEach(() => {
+  jest.clearAllMocks()
+  configure(originalConfig)
+})
+
+test('fireEvent calls the eventWrapper', () => {
+  const mockEventWrapper = jest.fn()
+  configure(() => {
+    return {eventWrapper: mockEventWrapper}
+  })
+  const el = document.createElement('div')
+  fireEvent.click(el)
+  expect(mockEventWrapper).toHaveBeenCalledWith(expect.any(Function))
+  expect(mockEventWrapper).toHaveBeenCalledTimes(1)
+})
+
+test('fireEvent has a default eventWrapper', () => {
+  const el = document.createElement('div')
+  expect(() => fireEvent.click(el)).not.toThrow()
+})

src/config.js

@@ -14,6 +14,7 @@ let config = {
   // react-testing-library to use. For that reason, this feature will remain
   // undocumented.
   asyncWrapper: cb => cb(),
+  eventWrapper: cb => cb(),
   // default value for the `hidden` option in `ByRole` queries
   defaultHidden: false,
   // showOriginalStackTrace flag to show the full error stack traces for async errors

src/events.js

@@ -1,16 +1,21 @@
+import {getConfig} from './config'
 import {getWindowFromNode} from './helpers'
 import {eventMap, eventAliasMap} from './event-map'
 
 function fireEvent(element, event) {
-  if (!event) {
-    throw new Error(`Unable to fire an event - please provide an event object.`)
-  }
-  if (!element) {
-    throw new Error(
-      `Unable to fire a "${event.type}" event - please provide a DOM element.`,
-    )
-  }
-  return element.dispatchEvent(event)
+  return getConfig().eventWrapper(() => {
+    if (!event) {
+      throw new Error(
+        `Unable to fire an event - please provide an event object.`,
+      )
+    }
+    if (!element) {
+      throw new Error(
+        `Unable to fire a "${event.type}" event - please provide a DOM element.`,
+      )
+    }
+    return element.dispatchEvent(event)
+  })
 }
 
 const createEvent = {}
@@ -64,11 +69,11 @@ Object.keys(eventMap).forEach(key => {
       /* istanbul ignore if  */
       if (typeof window.DataTransfer === 'function') {
         Object.defineProperty(event, 'dataTransfer', {
-          value: Object.assign(new window.DataTransfer(), dataTransfer)
+          value: Object.assign(new window.DataTransfer(), dataTransfer),
         })
       } else {
         Object.defineProperty(event, 'dataTransfer', {
-          value: dataTransfer
+          value: dataTransfer,
         })
       }
     }

types/config.d.ts

@@ -1,6 +1,7 @@
 export interface Config {
     testIdAttribute: string;
     asyncWrapper(cb: (...args: any[]) => any): Promise<any>;
+    eventWrapper(cb: (...args: any[]) => any): void;
     asyncUtilTimeout: number;
     defaultHidden: boolean;
     throwSuggestions: boolean;