-
Notifications
You must be signed in to change notification settings - Fork 249
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(pointer)!: change selection per pointer #763
Conversation
BREAKING CHANGE: `userEvent.type` does no longer move the cursor if used with `skipClick=false` and without `initialSelectionStart`.
Codecov Report
@@ Coverage Diff @@
## alpha #763 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 64 65 +1
Lines 1245 1323 +78
Branches 469 510 +41
=========================================
+ Hits 1245 1323 +78
Continue to review full report at Codecov.
|
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. Latest deployment of this branch, based on commit 37490aa:
|
f1c82c8
to
835801f
Compare
mousedown
🎉 This PR is included in version 14.0.0-alpha.3 🎉 The release is available on: Your semantic-release bot 📦🚀 |
* feat!: change input selection on `mousedown` * change selection on different elements and with offset * stop moving selection after pointerup BREAKING CHANGE: `userEvent.type` does no longer move the cursor if used with `skipClick=false` and without `initialSelectionStart`.
BREAKING CHANGE:
userEvent.type
does no longer move the cursorif used with
skipClick=false
and withoutinitialSelectionStart
.What:
The browser changes the selection range on
mousedown
events andmousemove
events if the mouse button is still pressed.We can not apply the exact behavior like the browser does, as it moves the cursor to the character closest to the
mousedown
event which we can not determine in a no-layout environment.This PR tries an approximation of the browser behavior.
Why:
E.g. in the browser performing a
dblClick
on an element<input value="abc"/>
selects the input and the next keystroke overrides it.But this was not the case with
userEvent
.How:
Treat every mouse event as if it happens in the area after the
textContent
/value
.In
userEvent.type
we moved the selection if the selectionRange was at the default0, 0
. So thatuserEvent.type(el, 'text')
would append thetext
per default. This was determined the expected behavior by the user.I think that might have been the result of
mousedown
moving the cursor in the browser - when focussing an input by clicking in the blank area after the input value.I think with this change it is reasonable to change this default behavior as our
click
intype
now does exactly this.I also removed the check of selection range position if the user calls
userEvent.type
withinitialSelectionStart
so it is always applied if given.This PR introduces two new options to the pointer actions:
pointer({node: E})
treatsE
as the DOM node containing the character closest to the pointer actionpointer({offset: 5})
treats thetextContent
/value
position5
as the character closest to the pointer actionoffset
represents the DOM offset insteadChecklist:
Additional information
See this the scenario regarding the gap between the user interaction as it might be perceived by our users and the actual events in the browser:
=> The pointer event target is
E1
and the corresponding selection position isnode: E1->#text, offset: 0
=> The pointer event target is
C
and the corresponding selection position isnode: E1->#text, offset: 0
=> The pointer event target is
C
and the corresponding selection position isnode: C, offset: 1
Even if we don't implement every aspect of it right away, we need a solution what input our API should accept that can be translated into these results.
The blunt solution would be to expect our users to supply the correct node and offset. But I feel that should only be a fallback for such complicated edge cases.