Can I disable Google Chrome Autofill ONLY for localhost?

Question

I'm a developer and it's VERY annoying having Chrome suggest all my personal address information in forms one web sites I'm developing on running on my local machine. Is disabling Autofill on localhost, or a domain, or an IP address possible? I'm not seeing anything in the advanced settings.

Answer 1

I recently answered another question with the same requirement of customizing features of Chrome (and also inspired from @Paul).

NOTE: This solution allows you to block a specific IP address or list of IPs, without having to load any additional library and no additional scripts in your project. Fact often you may have blocked all Javascript features, but the control "noautofill" follow operating, avoiding collisions with other libraries, allowing also you have a real recognition of the consumption charge and rendering time, and this can translate into savings of time debugging day to day, on different web projects.

Create a Chrome extension that uses the "match filter host" of the Chrome API, and filter your custom IP host or namehost. Then set the attribute autocomplete to off for all "input" and "form" tags.

We proceed with these steps:

• Create a new folder named ex. noautofill

• Create into our new folder, a new file named manifest.json and add this code inside:

{
  "name": "No Autofill",
  "version": "1.0",
  "manifest_version": 2,
  "description": "No Autofill.",  
  "content_scripts": [ {
      "all_frames": true,
      "exclude_globs": [  ],
      "include_globs": [ "*" ],  
      "js": [ "script.js" ],      
      "matches": [   
                   "http://192.168.1.100/",
                   "http://127.0.0.1/",
                   "http://10.0.1.100/",
                   "http://localhost/",
                   "http://wp.local/",
                   "http://192.168.1.100/*",
                   "http://127.0.0.1/*",
                   "http://10.0.1.100/*",
                   "http://localhost/*",
                   "http://wp.local/*"                   
                    ],
      "run_at": "document_start"
   } ],
  "permissions": [ "tabs", "http://*/", "https://*/", "https://*/*", "http://*/*", "contextMenus" ]

}

• In our new folder, create a new file named script.js and add this code inside:

(function(){    
    chrome.extension.sendRequest({
        autofill:'off'
    },function(){       
        var inputnodes = document.getElementsByTagName('input');    
        for(var i=0;i<inputnodes.length;i++){       
            inputnodes[i].setAttribute('autocomplete','off');
        }       
        var formnodes = document.getElementsByTagName("form");    
        for(var i=0;i<formnodes.length;i++){                    
            formnodes[i].setAttribute('autocomplete','off');
        }       
  });
})();

• We go to Chrome's menu » Settings » Extensions

• Now we click the button "Load unpacked extensions"

• Finally we mark our folder and click on the open button.

This is the result:

This system is very simple, and you can customize the file script.js with your own control code. In the future you may add other scripts, CSS, configuration pages, etc. Remember that every time you will make changes in the file script.js you should reload the plugin with CtrlR.

Also you can get a more detiled guide about how to create Chrome extensions.

Answer 2

The other answers regarding using a second profile or installing a second version of Chrome should work fine. I'm taking a different angle only to provide another option, not because I think this is a better way of doing it.

---

As you are developing a website locally, simply include the jQuery library and a jQuery script with the following code:

$(document).ready(function() {
    $(":input").attr("autocomplete","off");
});

This turns auto-fill off for all inputs on the webpage. Used in conjunction with a server-side include file (in the head) means it would be very easy to add this during testing and remove it for production for an entire website.

Answer 3

Unfortunately, Google Chrome does not have a per-site filtering option for auto-fill.

One alternative is to use the Lastpass Chrome extension, where you can decide which field to be remembered on a per-site basis.

The other alternative is by creating a new user profile Chrome settings -> Users -> Add new user or installing different versions of chrome (Chrome Stable / Beta / Dev, Chrome Canary, or Chromium).

Answer 4

One solution (for test purposes) would be to Add new user profile without Autofill.

Use this profile while testing to avoid Autofill.

Answer 5

Could achieve their purpose with Autofill extension.

I think it has all the features you are looking for.

Answer 6

The property autocomplete on input elements can be disabled to avoid autofilling. Grabbing all the input elements and setting this property can be done with native javascript code. If you just need it on the fly, you can open up the dev-tools and open up the console tab, and run this:

document.querySelectorAll('input, textarea').forEach((el) => {
  el.setAttribute('autocomplete', 'off');
});

Or if you never want autofill on this specific site, you could include something like this in your development bundle, which disables all fields when the page is fully loaded:

window.addEventListener('DOMContentLoaded', (event) => {
  disableAutofill();
});

function disableAutofill() {
  document.querySelectorAll('input, textarea').forEach((el) => {
    el.setAttribute('autocomplete', 'off');
  });
}