InputEvent is not supported Error on previously passing tests

[davidlukerice]

• react-testing-library version: 5.2.0
• dom-testing-library version: 3.8.3
• react version:16.5.2
• node version: v8.12.0
• npm version: 6.4.1

Relevant code or config:

Running via create-react-app v1 through react-testing-library.

What you did:

Ran tests in CI. Once I saw they were broken, cleared my local node_modules and started having the same issues

What happened:

1/5th of our tests started breaking in our CI about an hour ago when 3.8.3 came out with the following errors:

InputEvent is not supported
      at Function.fireEvent.(anonymous function) [as change] (node_modules/dom-testing-library/dist/events.js:344:13)
      at Object.it ([redacted]/index.test.js:42:36)
          at <anonymous>

The index.test.js line the error points to is

const firstNameField = await waitForElement(() =>
  getByLabelText('First Name')
);

fireEvent.change(firstNameField, { // line 42
  target: { value: 'testFirstName' },
});

Reproduction:

Run previously working tests.

Problem description:

This was just a bugfix release so shouldn't cause this many issues, right?

Suggested solution:

Still digging into what changed and is causing the issue.

[kentcdodds]

This is definitely a bug. Sorry about that. Let me know what you come up with. I'll look into it as well until I have to wrap up my day.

[davidlukerice]

Is it from the jest-dom bump to 2.0? I have 1.12.1 locally, which pulls in jsdom 11.12.0. InputEvent doesn't come in until jsdom 12 (https://github.com/jsdom/jsdom/blob/master/Changelog.md#1200).

I think the new window check on https://github.com/kentcdodds/dom-testing-library/pull/114/files#diff-4607e46b15da8ae44c4b47730c6d5963R322 is new?

[kentcdodds]

It came from this: #114

[JeffBaumgardt]

I'm so glad it isn't just me. I've already spent 2 hours on this thinking my ci server somehow wasn't getting the correct jsdom or something.

[davidlukerice]

ah, before it was defaulting the InputEvent to Event in https://github.com/kentcdodds/dom-testing-library/pull/114/files#diff-4607e46b15da8ae44c4b47730c6d5963L319 since it's undefined in jsdom < 12, but now since it's the string "InputEvent", it passes the destructuring defaults since "InputEvent" is a truthy value and doesn't fall back to Event correctly.

[kentcdodds]

I worked through it in a debugger and I don't think that's the issue. The issue is probably related to: node.ownerDocument.defaultView !== global.window

I'm not sure why, but I think that's what's going on.

[davidlukerice]

What version of jsdom are you testing with?

I forced the install of dom-testing-library back to 3.8.2 and am stepping through it.
window.InputEvent is undefined with the version of jsdom I'm running, so EventType defaults to Event in https://github.com/kentcdodds/dom-testing-library/pull/114/files#diff-4607e46b15da8ae44c4b47730c6d5963L319.

When jumping back to 3.8.3 where it's passing strings around for event types, EventType stays as "InputEvent" in https://github.com/kentcdodds/dom-testing-library/pull/114/files#diff-4607e46b15da8ae44c4b47730c6d5963R303 and makes it down to the window[EventType] check without being changed to "Event".
Should InputEvent be shimmed somehow by that point?

[kentcdodds]

Should InputEvent be shimmed somehow by that point?

I believe that JSDOM supports all event types out of the box. No shim necessary.

[davidlukerice]

I didn't think InputEvent was implemented until v12?

[sheerun]

JSDOM doesn't support some events at all, that's why I needed to shim them in tests to pass: https://github.com/kentcdodds/dom-testing-library/blob/1b12385032841c14633c5061f3ab38f938df4c03/src/__tests__/helpers/document.js

I think it's by pure chance some package included shims for these events on window. For example there's no mention of ClipboardEvent in JSDOM source yet you had passing tests for it.

[sheerun]

My personal guess it that previously CliboardEvent, InputEvent etc. were referenced directly in source while now they are referenced indirectly, and because of that packager you use for bundling dom-testing-library now doesn't bother to include shims for these events.

I guess if you want to preserve 100% backward compatibility then you need to manually add these shims to global or jsdom window if you start listening for these events, instead of throwing an error.

[sheerun]

this issue can be closed, it's fixed in latests release

[maufarinelli]

I am using "@testing-library/dom": "^6.10.1" and "@testing-library/react": "^9.3.2",
and I still see ReferenceError: InputEvent is not defined.
Any clue why?

[kentcdodds]

@maufarinelli, could you open a new issue with a reproduction please.