fix: apply changes before input event

[ph-fritsche]

What:

Apply new value and selection range before input event so that input handlers can use it.
Get correct selection range for [ArrowLeft] and [ArrowRight] when active element does not support selectionRange.

Why:

Closes #515

Checklist:

• N/A Documentation
• Tests
• Ready to be merged

[codecov]

Codecov Report

Merging #622 (4512027) into master (0882e4d) will not change coverage.
The diff coverage is 100.00%.

@@            Coverage Diff            @@
##            master      #622   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           46        46           
  Lines          881       884    +3     
  Branches       330       330           
=========================================
+ Hits           881       884    +3     

Impacted Files	Coverage Δ
src/utils/edit/selectionRange.ts	100.00% <ø> (ø)
src/keyboard/plugins/arrow.ts	100.00% <100.00%> (ø)
src/keyboard/shared/fireInputEventIfNeeded.ts	100.00% <100.00%> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 0882e4d...4512027. Read the comment docs.

[github-actions]

🎉 This PR is included in version 13.0.13 🎉

The release is available on:

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

Your semantic-release bot 📦🚀

[stefcameron]

@ph-fritsche Hey! 👋 Thanks for your work on this awesome library! I'm trying to figure out why tests are breaking now, either after this or #619, though this one, based on the code changes (which I don't fully understand) feels like it's the more likely culprit.

So far, I've been using the React Testing Library, and using user-event to type into an <input type="text"> and expecting it to cause the input's change event to fire, and a state update to my component. But now, nothing happens. There's no change event triggered.

Here's a simplification, which is breaking:

const handler = jest.fn();
const { container } = render(<div><input type="text" onChange={handler} /></div>);
const inputEl = container.querySelector('input');
expect(inputEl).toHaveValue('');
userEvent.type(inputEl, 'red');
expect(inputEl).toHaveValue('red');
expect(handler).toHaveBeenCalled();               // <- fails, but should succeed

The above tests all pass under v13.0.10...

[stefcameron]

To be clear, my test is breaking under 13.0.13, so it's some patch 11, 12, or 13, that's causing the issue.

[ph-fritsche]

@stefcameron Yes, this fix caused #624 which is fixed in #626 . Update to the latest version and you should be good 🚀 😃

[stefcameron]

@ph-fritsche Nice! Glad it should be fixed already. I'll check this out in 13.0.15!

[stefcameron]

Fixed, thank you!