Skip to content
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

[Bug Report][2.6.4] Cursor jumps to the end of textfield if you're using v-model.trim modifier. #14935

Closed
atomiomi opened this issue Apr 7, 2022 · 2 comments · Fixed by #16759
Assignees
Labels
C: VTextField VTextField T: bug Functionality that does not work as intended/expected
Milestone

Comments

@atomiomi
Copy link

atomiomi commented Apr 7, 2022

Environment

Vuetify Version: 2.6.4
Vue Version: 2.6.14
Browsers: Chrome 99.0.4844.84
OS: Mac OS 10.15.7

Steps to reproduce

Fill in text into the textfield, adding a space at the end
Move the cursor to the middle of the text
Delete one character

Expected Behavior

Cursor remains in place

Actual Behavior

Cursor jumps to the end of the text

Reproduction Link

https://codepen.io/yopyaatom/pen/OJzpVXL

@scscgit
Copy link
Contributor

scscgit commented Apr 17, 2022

This (internal implementation) may be also related to a similar issue of v-autocomplete, where it isn't possible to change value without resetting input to immediately match the new value:

I've been also trying to implement a similar trim feature for a custom textbox component, but for now without successful completion, as there were still edge cases to be considered :(
Just for reference, I was progressing along these lines when brainstorming:

:value="
    currentInternalInput ===
    (trim ? valueAsText.trim() : valueAsText)
        ? currentInternalInput
        : valueAsText
"
@blur="
    // Normalize input on blur to match the bound value
    textRef.internalValue = trim ? valueAsText.trim() : valueAsText
"

And the same issue occurs if our use-case is a normalization numbers, e.g. 3.00 to 3.

@KaelWD KaelWD added T: bug Functionality that does not work as intended/expected C: VTextField VTextField and removed S: triage labels Feb 23, 2023
@KaelWD KaelWD added this to the v3.1.x milestone Feb 23, 2023
@KaelWD KaelWD self-assigned this Feb 23, 2023
@KaelWD
Copy link
Member

KaelWD commented Feb 23, 2023

@scscgit that looks more like #16743

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VTextField VTextField T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants