disableautofill.js

!Disable auto-fill, auto-complete functions

!Test  

The easiest solution for disabling Google Chrome auto-fill, auto-complete functions.

Concepts

This library does the following steps:

* Replace type="password" with type="text".
* Replace the text of password with asterisk symbols.
* Add an attribute autocomplete="off" on form.
* Randomize the attribute name in order to prevent Google Chrome to remember what you fill.

The library will restore the original password value when you submit the form and then replace the password value with asterisk symbols again.

The flowchart below shows the process of the library:


- Main: Acts as the entry point of the process, responsible for initializing other components.
- EventAdapter: Manages the addition and removal of DOM events.
- listen: Sets up listeners for specific form events, like keyboard inputs and form submissions.
- handle: Processes DOM elements (like password fields) based on triggered events.
- Randomizer: Performs randomization and restoration operations on form fields to manage password display.
- State: Maintains and updates form state, such as temporary and original password values.
- DOM Elements: Refers to the HTML elements (like input fields) that are directly manipulated.

Install

#### NPM
``bash
npm install disableautofill
`

or download the latest release.

Usage

`javascript
new Disableautofill(form, options);
`

- form CSS selector or DOM element.
- options The options.

$3

option | default | type | note
---- | --- | --- | ---
fields | [] | array | The id or class of the fields (the input elements for filling password in the form). For example: ['.newpass', 'newpass2']
asterisk | ● | string | Character use to hide the real password value.
callback | null | function | To validate form fields or something you can do.

$3

#### destroy()

Removes all event listeners and restores the original form element. Please note that all events will be removed after calling this method.

#### init()

This method is called by default when you initialize the script. You can call this method to re-initialize the script after calling the destroy() method.

Examples

Assume that you have a form like this:

`html


Include the UMD package's JavaScript file in your HTML document using a
`

And then, initialize the script in the next
`

Then, initialize the script in the subsequent