Benefits of exposing webauthn through navigator.credentials

I'm not going to be able to call in today, so I figured I'd send my pitch
to accept https://github.com/w3c/webauthn/pull/384 by email.

I think the biggest benefit of exposing webauthn credentials through the
same interface as passwords is that it lets us achieve Jeff Hodges' goal of
a single interface for webpages to use for sign-in, and with a small change
to #384 another single interface for credential creation.

For credential creation, the page needs to give the user a choice of which
kind of credential to create. Adding a couple more credential types, that
could look something like:

  navigator.credentials.createAndStore({
    accountInfo: {userid, username, userImage, siteName},
    acceptableCredentials: {
      password: {minEntropy: 64},
      federated: {providers:["https://accounts.google.com", "
https://www.facebook.com", ...]},
      sms: {
        checkBy: {
          send: function(number) {/*Ask the server to send an SMS*/},
          vouch: [googleKey, samsungKey, appleKey, ...],
        },
      },
      publicKey: { // <-- Better name for webauthn credentials.
        attestationChallenge: crypto.getRandomValues(sixteen_byte_buffer),
        cryptoParameters: [{algorithm: "ES256"}],
        // Do we need a filter for acceptable attestation certificates?
      },
    }
  });

The UI flow would be:
1) Get and validate a username, possibly taking advantage of
autocomplete="username" or autocomplete="email".
2) Call .createAndStore().
3) Potentially call .createAndStore() again to get a second factor.

You need a library to help manage the different credential types on the
server, but using a single call lets the browser guide the user through
their choice of credential types instead of needing to expose several "can
I use this" functions to the website.

Sign-in needs this unification a bit less, since most users have exactly
one credential for a given account, and in those cases, the site can
dispatch to the single call that works for that credential type. But some
users have multiple credentials for a given account, and in those cases,
letting the browser manage which credential to use would be useful.

  navigator.credentials.get({
    username,
    password: true,
    federated: {providers:["https://accounts.google.com", "
https://www.facebook.com", ...]},
    sms: {
        checkBy: {
          send: function(number) {/*Ask the server to send an SMS*/},
        },
      },
      publicKey: { // <-- Better name for webauthn credentials.
        challenge: crypto.getRandomValues(sixteen_byte_buffer),
        allowList: {id: id_for_username},
      },
    }
  });

Jeffrey