test: identify browser/jsdom differences

[ph-fritsche]

What:

Identify the differences between Chrome and Jsdom environment.

Why:

Determine if failing tests in Chrome are the result of wrong assumptions in our tests or wrong implementations in our source.

Checklist:

• Ready to be merged

Findings:

Some of our tests rely on Jsdom-specific behavior and in at least one case the browser implementation has changed.
I've added TODOs (either in test or source) where i could identify the cause of different results in the test environments.

Any new discoveries of differences between Jsdom and Chrome should be added to tests/environment so that we can easily keep track of the quirks.

• .focus() does not fire focus events if window is not focussed #553
  prepareElement is triggered by focus. Therefore we fail to track any UI value/selection in browsers.
  

  user-event/src/event/focus.ts

  Lines 5 to 6 in 57c9b65

  	// Browsers do not dispatch FocusEvent if the document does not have focus.
  	// TODO: simulate FocusEvent in browsers

• Wrong Selection when <input/> inside contenteditable is focused #1248
  

  user-event/src/event/selection/updateSelectionOnFocus.ts

  Lines 3 to 6 in a76db96

  	// The browser implementation seems to have changed.
  	// When focus is inside <input type="text"/>,
  	// Chrome updates Selection to be collapsed at the position of the input element.
  	// TODO: update implementation to match that of current browsers

• Real DataTransferItem.getAsString() breaks Clipboard methods #1249
  

  user-event/src/utils/dataTransfer/DataTransfer.ts

  Line 160 in 5d0dcaf

  // TODO: await callback

• createDataTransfer fails to override real DataTransfer.types.
  With files parameter the method has only been used internally in our tests.
  

  user-event/tests/utils/dataTransfer/DataTransfer.ts

  Lines 49 to 52 in 98bc5e0

  	// TODO: Fix DataTransferStub
  	typeof window.DataTransfer === 'undefined'
  	? ['Files', 'text/html']
  	: ['text/html']

• user-event/tests/utils/edit/setFiles.ts

  Lines 44 to 48 in 5057e39

  	// Everything but an empty string throws an error in the browser
  	// TODO: Research why this behavior is inconsistent
  	// expect(() => {
  	// element.value = 'foo'
  	// }).toThrow()

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[codecov]

Codecov Report

Merging #1091 (2463be9) into main (7a305de) will increase coverage by 0.00%.
The diff coverage is 100.00%.

@@           Coverage Diff           @@
##             main    #1091   +/-   ##
=======================================
  Coverage   99.46%   99.47%           
=======================================
  Files          92       92           
  Lines        2070     2085   +15     
  Branches      714      706    -8     
=======================================
+ Hits         2059     2074   +15     
  Misses         11       11           

Impacted Files	Coverage Δ
src/system/keyboard.ts	100.00% <100.00%> (ø)
src/system/pointer/index.ts	100.00% <100.00%> (ø)

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

[github-actions]

🎉 This PR is included in version 14.6.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀