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

Text "cursor" going back on capacitor mode #17382

Open
Excel1 opened this issue Jul 18, 2024 · 1 comment
Open

Text "cursor" going back on capacitor mode #17382

Excel1 opened this issue Jul 18, 2024 · 1 comment
Labels

Comments

@Excel1
Copy link

Excel1 commented Jul 18, 2024

What happened?

By using q-input with a reverse-fill-mask, the cursor is going back by pressing backspace. It happens only on capacitor. In mobile browser or on desktop it works as expected.

q-input

<q-input
    filled
    v-model='amount'
    :label="$t('amount')"
    mask='#.##'
    fill-mask='0'
    reverse-fill-mask
    bottom-slots
    :error='valid === false'
    :error-message="$t('error_amountRestriction')"
    @update:model-value='(value) => validate(String(value))'
  >

related to: #5542

What did you expect to happen?

By pressing backspace the cursor should stand in place like in (mobile browser) or on Desktop.

Reproduction URL

https://stackblitz.com/edit/quasarframework-55neqn?file=src%2Fpages%2FIndexPage.vue

How to reproduce?

  1. Go to the reproduction link
  2. build for mobile (android)
  3. install the application
  4. type 3826
  5. press backspace (cursor moves)

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar), Capacitor Mode

Platforms/Browsers

Android

Quasar info output

Operating System - Linux(6.8.0-36-generic) - linux/x64
NodeJs - 18.18.2

Global packages
  NPM - 8.19.4
  yarn - Not installed
  @quasar/cli - 2.3.0
  @quasar/icongenie - 3.1.1
  cordova - Not installed

Important local packages
  quasar - 2.16.6 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 1.9.3 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.16.12 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.4.32 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.2.5
  pinia - 2.1.7 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  vite - 2.9.16 -- Native-ESM powered web dev build tool
  eslint - 8.52.0 -- An AST-based pattern checker for JavaScript.
  electron - Not installed
  electron-packager - Not installed
  @electron/packager - Not installed
  electron-builder - Not installed
  register-service-worker - 1.7.2 -- Script for registering service worker, with hooks
  @capacitor/core - 6.1.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/cli - 6.1.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/android - 6.1.0 -- Capacitor: Cross-platform apps with JavaScript and the web
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Relevant log output

No response

Additional context

I just added

<q-input
    filled
    v-model='amount'
    :label="$t('amount')"
    mask='#.##'
    fill-mask='0'
    reverse-fill-mask
    bottom-slots
    :error='valid === false'
    :error-message="$t('error_amountRestriction')"
    @update:model-value='(value) => validate(String(value))'
  ><q-input>

to the sandbox - nothing more

@Excel1 Excel1 added kind/bug 🐞 Qv2 🔝 Quasar v2 issues labels Jul 18, 2024
@Excel1
Copy link
Author

Excel1 commented Oct 26, 2024

I tested it recently on iOS and there it works as expected. Seems to be Android specific

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant