Preact: spellcheck=false attribute can't be set

[noway]

Looks like preact is replacing any value for spellcheck with true.

So when I'm doing

class TextBox extends Component {
    render({ title, ph, value }) {
        return (<div class="form-group">
                <label for={ Util.mangle(title) }>{ title }</label>
                <input type="text" 
                    id={ Util.mangle(title) } class="form-control" 
                    placeholder={ ph } value={ value } 
                    spellcheck="false" />
            </div>);
    }
}

it renders an element with spellcheck="true"

[developit]

What about with spellcheck={false}?

[noway]

Then spellcheck attribute is not rendered at all. And by default spell check is still enabled :-(

[developit]

it would be setting the property, not the attribute.
Here's what preact is doing under the hood, which seems to work:
https://jsfiddle.net/developit/1vk3wu31/

[noway]

I see. Indeed, it seems to be working with property just fine, attribute is not needed.

[developit]

awesome! Just for other who find this issue as well, you can also work with the spellcheck string attribute (rather than the property) by intentionally triggering a case mismatch in the prop name: <input spellCheck="false"> - this will trick Preact into diffing against the attribute instead of the property.

[wilsonpage]

This just bit me, wasted well over an hour. Should this issue really be closed? The camel-case workaround fixed it for me.

-<input spellcheck="false" autocomplete="off" />
+<input spellCheck="false" autoComplete="off" />

[developit]

@wilsonpage hmm - "false" isn't correct there, use an actual Boolean:

-<input spellcheck="false" autocomplete="off" />
+<input spellcheck={false} autocomplete={false} />

[goliney]

<input spellcheck={false} /> doesn't work for me, but camelcase does (<input spellCheck="false" />)

Thanks, @wilsonpage