CODEWITHSUNDEEP
angulargoogle-chrome
hY8vVpf3tyR57Xib
hY8vVpf3tyR57Xib

Reputation: 3915

Browser does not ask to save password Angular application

I am working on an Angular application that starts with a login portal. I am using the following template for my login screen:

login.html

    <form method="post" name="form" (ngSubmit)="f.form.valid && login()" #f="ngForm" novalidate>
      <fieldset>
        <p>
          <label>Username</label>
          <input type="text" placeholder="e.g. JohnDoe" [(ngModel)]="model.username" #username="ngModel"
                 name="username" required/>
        </p>

        <p [ngClass]="{ 'has-error': f.submitted && !password.valid }">
          <label>Password</label>
          <input type="password" placeholder="Password" name="password" [(ngModel)]="model.password"
                 #password="ngModel" required/>
        </p>
        <p>
        <input type="submit" [disabled]="loading" class="btn" value="Login">
        </p>
      </fieldset>
    </form>

Unfortunately, whenever a user is logged in, the password manager of Chrome does not ask to store the credentials. Password managers like Lastpass however do offer to store it. What could I improve to fix this?

Upvotes: 17

Views: 9035

Answers (3)

nickcrabtree
nickcrabtree

Reputation: 358

It used to be the case (when this question was originally asked) that if you turned on the Chrome flag chrome://flags/#enable-password-force-saving then you get a key icon in the address bar whenever a form is visible. Clicking this would force the 'save password' bubble to pop up.

It appears that (as of 3rd November 2020) this flag has been removed so this is no longer possible.

From Techradar but copied here to prevent link rot: Chrome Flags are experimental features that aren't yet part of the browser by default, but can be enabled with a couple of clicks. They're simple to use and can transform the way you browse the web.

To access the Flags menu, type chrome://flags into the address bar and hit Enter. Here, you'll see a long list of options, each of which has a drop-down menu that can be set to Default, Enabled or Disabled. There are lots of them, so the best way to find the one you want is to hit Ctrl+F and search for it.

Once you've enabled a Flag, you'll be prompted to re-launch your browser to activate it. This will close and re-open all your current browser windows, so make sure you've saved anything you're working on.

The tools here are still in testing, and aren't necessarily stable. There's also a possibility, however small, of security issues. If that's something you can live with, there are some real gems on offer.

Upvotes: 2

Gopal Abbineni
Gopal Abbineni

Reputation: 1

There is no problem with the code. It lies with the browser settings. Code works fine in my firefox brower.

If your using google chrome please check whether autofill settings is switched on.

Steps to check:

  1. Hamburger icon present on the right top of the browser.

  2. Click on settings.

  3. Search for autofill settings. Make sure that it is switched on.

Upvotes: 0

Ebraheem Alrabeea
Ebraheem Alrabeea

Reputation: 2250

Try this solution:

Steps to make Google Chrome offer to save (prompt) password for a particular site (for e.g abcd.com) and Auto-login the site with the credentials thus saved.

-> Go to the given URL 'abcd.com'

-> Right-click Page Info and disable 'JavaScript'

-> Reload the page.

-> Enter the credentials (uid,pwd)

-> A prompt appears to save password.

-> Click on Save password.

-> Auto-Login Extension bubble appears on this page.

At this point it is important because the extension 'Auto-Login' (like many other extensions) require JavaScript to be enabled.

-> Re-enable the JavaScript for this page and reload the page.

-> Now Click on the 'Auto-Login' bubble for remembering automatically logging into the site hereafter!

Upvotes: 0

Related Questions