Can import / export credentials from built-in password manager

[RubenSmn]

Allows you to import / export credentials from the built-in password manager.

It will import / export using the same schema the built-in password manager uses to store the credentials which is the following:

{
  "version": 1,
  "credentials": [
    {
      "domain": "google.com",
      "username": "Google User",
      "password": "123456"
    },
    {
      "domain": "github.com",
      "username": "Github User",
      "password": "123456"
    }
  ]
}

Currently it will only let you import if you have 0 passwords and only export if you have more than 1 password. We might want to do some merge thing but I didn't want to do that yet since that could go a couple ways, e.g. override, merge.

Also refactored some "render to dom" functionality into separate functions.

Let me know what you think.

[RubenSmn]

Might resolve #2114

[PalmerAL]

Seems like a good idea!

I'm not sure whether there's a formal specification, but Safari/Chrome/Firefox all use similar CSV formats for this. What do you think about doing the same thing so that you can import/export between Min and other browsers?

For reference, the headers for each:

Safari:

Title,URL,Username,Password,Notes,OTPAuth

Chrome:

name,url,username,password,note

Firefox:

"url","username","password","httpRealm","formActionOrigin","guid","timeCreated","timeLastUsed","timePasswordChanged"

The important things seem to be "url", "username", and "password", so we would just need to do a conversion between domains and URLs.

Also, they all display some kind of security warning when you export; we should probably do something similar. This is from Firefox:

[RubenSmn]

I agree that it should be compatible with the major browsers. I'll make the changes accordingly.

The security warning is a good feature to have indeed.

What about how to handle the import? Firefox gives the following success message:

What do you think about a warning before importing that states something like: "Existing credentials will be updated / overwritten, are you sure you want to continue?"

[RubenSmn]

We can now import / export from csv files that contain the columns url, username and password.

After clicking import / export buttons there will first be a warning stating that the credentials will be in readable text (export) or existing passwords will be overwritten (import).

[PalmerAL]

The import warning is good! We should probably only show the warning if you have > 0 saved passwords before the import though.

For the export warning, the Firefox one is good, but I don't want to copy it exactly :) How about "Your exported passwords will be saved in a file in plain text. When you're done using this file, you should delete it. Are you sure you want to continue?"

What do you think about using an existing CSV package, like this? I remember CSV having various quirks to parsing it; it might be more robust to do that rather than doing it ourselves.

[PalmerAL]

I think it would be better if this took the CSV file contents as an argument, and the open dialog part was moved into passwordViewer. It's possible the CSV parsing would be better moved into there as well, but I'm not sure about that, so I'll leave that up to you.

[RubenSmn]

I was reading this comment and was like, "huh but this is already in the viewer right?" apparently not, thanks for catching :)

[RubenSmn]

Yes parsing of the CSV was not the prettiest code I've written. I followed your suggestion of using a package that parses csv files and found Papaparse, this one returns the data as json/object-array with the header as a key for the value which is a huge + and it is lightweight.

For the exporting I did not use the package since that's just 9 lines and very straightforward.