Disable browser password save: revisited

[magosk]

Hi and thanks for the suggestion, but I do get access violations in the (server) code when I later try to access properties of the edit controls for which I changed the name. Are you saying there is no way to forbid Chrome Mobile to store user names and passwords for the edit controls on a form?

[Alexander Bulei]

Hi magosk,

After that, to access to the control, you need find the control by name:

delphi code

IWCGJQEdit1:= FindComponentByName(NewName) as TIWCGJQEdit;

Are you saying there is no way to forbid Chrome Mobile to store user names and passwords for the edit controls on a form?

The way is check the settings of browser and disable the password manager.

Quoted:

You can do this way in google chrome by going to setting/Password and Forms > Disable [Enable Autofill to fill out web forms in a single click.] and Disable [Offer to save passwords with Google Smart Lock for Passwords.]

Best Regards.

[magosk]

Hi again! I meant if it was possible to tell Chrome to not store username and password from the web page code (similar what AutoComplete = False was meant to do)?

As for your suggested workaround, I have fixed the access to the edit controls so that the code works correct again (on the server side), but Chrome Mobile unfortunately still fills the password fields with (non-correct) values when you return to the login page after answering Yes.

[magosk]

Hi! Any update on this topic? I can tell you that I have made some testing on BrowserStack with various mobile browsers (Safari, Samsung Chrome and Firefox) and the problem is only there for Chrome. Also, although web frontend is not my area of expertise, I checked the links you gave in an earlier post. In one of them, one reply talks about setting autocomplete="new-password" rather than autocomplete="off" or autocomplete="false". Could this be something of interest?

[Alexander Bulei]

Hi magosk,

autocomplete="new-password"

We already add this attr when browser is chrome, anyway thanks

Best Regards.

[magosk]

Yes, I can see that if I enable developer tools in BrowserStack for Chrome. It seems like Google has decided to try to prevent the common workarounds for their policy to ignore autocomplete settings, but does not understand (or ignores) the problems they cause for many sites (like ours). Do you have any other ideas for workarounds? I saw something about setting some properties from JavaScript code rather than in the HTML. Or would it be possible to change some properties of the edit controls via Ajax from e.g. a TIWTimer.OnAsyncTimer event?

[Alexander Bulei]

Hi magosk,

You can try this workarround:

1. Set the input to READONLY
2. Implement the OnClick event, and disable the READONLY

I think, it should work fine

Best Regards.

[magosk]

Hi and thanks for the tip! I combined it with the example I saw (it used OnFocus instead) and came up with the following workaround which seems to work fine (tested with a couple of physical devices plus various devices on Browserstack):

Code: Select all

procedure TEmMobileClientCGLoginWebDialog.IWAppFormCreate(Sender: TObject);

  procedure AddChromeAutoFillWorkaround(const Edits: array of TIWCGJQMEdit);
  var
    Edit: TIWCGJQMEdit;

    procedure SetTemporaryReadOnly;
    begin
      Edit.JQMEditOptions.EditTypeOptions.ReadOnly := True;
      Edit.JQMEditOptions.Events.OnFocus.Script :=
        'function (event){' +
        '  if (this.hasAttribute(''readonly'')){' +
        '    this.removeAttribute(''readonly'');' +
        '  }' +
        '}';
    end;

  begin
    Logger.ReportDebugUI(SafeFormat('Browser %s detected, adding workaround with temporary readonly'
      + ' attribute for edits to avoid problems with autofill', [WebApplication.Browser.BrowserName]));
    for Edit in Edits do
      SetTemporaryReadOnly;
  end;

begin
  {more code here...}
  inherited;
  if WebApplication.Browser is TChrome then {TChromeMobile inherits from TChrome}
    AddChromeAutoFillWorkaround([SubscriptionIDEdit, SubscriptionPasswordEdit, UserNameEdit,
      UserPasswordEdit, PasscodeEdit]);
  {more code here...}
end;


Does this look OK to you?