React-hook-form: [Question] How to disable native HTML 5 validation

[nshaikhinurov]

I'm passing a {nativeValidation: false} option to the useFormContext hook although it is documented as a default value. However, even when I use custom validate function as an option to the register method of an email input type I can see unneeded native Chrome bubble with yellow exclamation mark. How can I get rid of it? The type="email" attribute of an input is convenient for determining what validation function to use in React components but this also causes HTML 5 browser-native design elements to appear which is not suitable for my project.

So the question is how to disable that behavior.

As a workaround, I passed a custom react prop to a component wrapping my input element (dataType="email")

Related StackOverflow question

[danihazler]

<form onSubmit={handleSubmit(onSubmit)} noValidate>

use noValidate

[bluebill1049]

thanks @danihazler or you can pass type="text" and write a regex yourself :)

[nshaikhinurov]

Thank you @danihazler! noValidate attribute does exactly what I wanted.