"maxlength" attribute on desktop (browser) checks the size of the input and compare it with given limit whereas it compares the count of character on mobile device (browser). This is weird. For example,
Username: <input type="text" name="usrname" maxlength="10"><br>
when you enter normal character it will limit you till 10 chars, which is 10 byte. When you try to enter emojis or multi language characters or unicode character, depending on the size it will stop user entering extra characters. For example if you try to enter emoji, on desktop you can enter only 5 emojis, as size of 1 emoji is 2 byte and on desktop browser wont let you cross 10 bytes.
But on mobile browser, you will be able to enter 10 emojis. Shouldn't browsers on desktop or mobile device work same for simple attribute like maxlength. Let me know why its happening and if possible the workaround. I want mobile browser to work same as desktop browser and restrict the input size in terms of byte not count. Thanks in advance.
for testing purpose: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_input_maxlength
