jackocnr / intl-tel-input

A JavaScript plugin for entering and validating international telephone numbers
https://intl-tel-input.com
MIT License
7.36k stars 1.92k forks source link

`separateDialCode=true` mode unexpected let user edit country code by typing in mobile #1655

Closed alice-lin-sys closed 3 weeks ago

alice-lin-sys commented 3 weeks ago

Plugin version

v23.0.11

Steps to reproduce

  1. Using mobile to access input which is set toseparateDialCode=true.(ex: https://intl-tel-input.com/storybook/?path=/docs/intltelinput--separatedialcode)
  2. Type '+', then a digit which is not an exist country code. (ex: Typing '+8')

mobile operating system: Android 14 browser: Chrome 126.0.6478.50

Expected behaviour

Should open an country dropdown to let user select or search country. After complete select or type an exist country code, the country code in input field should be removed.

Actual behaviour

Start editing country code which is not I expected.

截圖 2024-06-13 下午4 42 12

And then if I type an exist country code, input field will keep my input content.

截圖 2024-06-13 下午4 42 20

Initialisation options

{
    initialCountry: 'tw',
    onlyCountries: ['tw', 'cn', 'hk', 'jp', 'kr', 'sg', 'ph', 'th', 'id', 'us', 'gb', 'ca', 'fr', 'de', 'au', 'mo', 'nz',],
    placeholderNumberType: 'MOBILE',
    separateDialCode: true,
    utilsScript: "https://cdn.jsdelivr.net/npm/intl-tel-input@23.0.11/build/js/utils.js",
    countryOrder: ['tw']
}

This only happens in mobile device, I know it will be hard to debug. I hope it can be fixed or a work around will be a big help for me. Thanks.

jackocnr commented 3 weeks ago

Thanks for reporting. I've just released v23.0.12 which should fix this. Let me know if that works for you!

alice-lin-sys commented 3 weeks ago

@jackocnr Everything works fine after updated to v23.0.12, thank you!