In my use case, there is a registration page that triggers the browser-specific webauthn flow. For example in Chrome on a Mac you will see this series of popups:
- Pick an option between USB security key and Built-in sensor
- MacOS confirmation with Touch ID
- Confirmation dialog from Chrome requesting access to your security key
Besides https://w3c.github.io/webauthn/#add-virtual-authenticator I haven't found much documentation about authenticating with webauthn as part of a selenium test. What resources are available to help devs figure out how to test webauthn with Selenium in JavaScript? I have also checked out https://github.com/SeleniumHQ/selenium/issues/7829 but the example test case does not make sense to me. Examples would be hugely appreciated.
Update with solution for js:
import { Command } from 'selenium-webdriver/lib/command';
addVirtualAuthenticator = async () => {
await this.driver.getSession().then(async session => {
this.driver
.getExecutor()
.defineCommand('AddVirtualAuthenticator', 'POST', `/session/${session.id_}/webauthn/authenticator`);
let addVirtualAuthCommand = new Command('AddVirtualAuthenticator');
addVirtualAuthCommand.setParameter('protocol', 'ctap2');
addVirtualAuthCommand.setParameter('transport', 'internal');
addVirtualAuthCommand.setParameter('hasResidentKey', true);
addVirtualAuthCommand.setParameter('isUserConsenting', true);
await this.driver.getExecutor().execute(addVirtualAuthCommand);
});
};
Note that this.driver
is of type WebDriver
.
Call addVirtualAuthenticator
before hitting any code that interacts with navigator
(in our case user registration involved a call to navigator.credentials.create
). If you need access to the publicKey, i.e. via navigator.credentials.get({ publicKey: options })
during login, then hasResidentKey
is critical.