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

input spellcheck="false" does not work #1350

Closed
danyadev opened this issue Jun 12, 2020 · 5 comments
Closed

input spellcheck="false" does not work #1350

danyadev opened this issue Jun 12, 2020 · 5 comments

Comments

@danyadev
Copy link

Version

3.0.0-beta.14

Reproduction link

https://jsfiddle.net/danyadev/qtgvsc57/1/

Steps to reproduce

Create a input and set the spellcheck="false" attribute to it

What is expected?

Spellcheck is turned off

What is actually happening?

If you look in DevTools, you will see spellchecker="true" there.


The example also created input outside the vue component, and there the spelling check is really turned off.

@pikax
Copy link
Member

pikax commented Jun 12, 2020

you need to cast your value to boolean, currently you are passing a string
:spellcheck="false"

That's the same behaviour as vue2

@posva
Copy link
Member

posva commented Jun 12, 2020

this one should be changed because spellcheck is not a boolean attribute (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/spellcheck)

It does work properly on Vue 2 by leaving the value to false. The relevant code is at https://github.com/vuejs/vue/blob/dev/src/platforms/web/util/attrs.js#L20

@fredrivett
Copy link

This still seems to be an issue despite the fix merged on June 12th.

As I understand it, this should stop the spellchecker on iOS Safari:
<input spellcheck="false" />

Using the latest ("vue": "^3.0.3") with node_modules and yarn.lock deleted and reinstalled, this error persists.

I've tried all other variants in desperation too, yet spellcheck persists in them all:
<input :spellcheck="false" />
<input :spell-check="false" />
<input spellCheck="false" />
<input :spellCheck="false" />

I might be doing something silly, but if not then this is an outstanding issue and not fixed by 4492b88.

@posva
Copy link
Member

posva commented Nov 27, 2020

The attribute is being set properly. You might need other attributes: https://stackoverflow.com/questions/254712/disable-spell-checking-on-html-textfields

@fredrivett
Copy link

Thanks so much for the swift reply here @posva.

I was actually looking at that SO post earlier today, and believe I've set everything correctly (though I may be being a dumbass).

My code above was a simplified example, my actual code that's not working is:

<input
  v-model.trim="computedInput"
  ref="inputRef"
  class="flex-1 bg-transparent border-0 shadow-none text-center mb-0 px-0 py-4 sm:py-6"
  placeholder="Search here&hellip;"
  autocomplete="off"
  autocorrect="off"
  autocapitalize="off"
  spellcheck="false"
  @focus="setFocussed(true)"
  @blur="setFocussed(false)"
/>

I would have expected the above to work, but it's still autocorrecting for me with "vue": "^3.0.3".

@github-actions github-actions bot locked and limited conversation to collaborators Oct 31, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants