authenticator-browser-extension

Authenticator (Browser Extension)

Authenticator is a web browser extension that enables your automated tests to authenticate with web apps using HTTP authentication.

Authenticator generates the browser extension dynamically, so you can easily provide the username and password via a config file or env variables.

Authenticator is proven to work with following test frameworks:

• WebdriverIO (example)
• Protractor (example)
• Puppeteer (example)

and following browsers:

• Google Chrome (example 1, example 2)
• Firefox Developer Edition (example)

It's possible that Authenticator will work with other browsers supporting Web Extensions and webRequest.onAuthRequired API. However, I didn't have a chance to verify it yet.

For Enterprise

Authenticator is available as part of the Tidelift Subscription. The maintainers of Authenticator and thousands of other packages are working with Tidelift to deliver one enterprise subscription that covers all of the open source you use. If you want the flexibility of open source and the confidence of commercial-grade software, this is for you. Learn more.

Usage

Install the module from npm:

npm install --save-dev authenticator-browser-extension

The best place to look for usage examples is the e2e test suite.

WebdriverIO

Import the authenticator-browser-extension in the wdio.conf.js file and add Authenticator to the list of Chrome extensions:

// wdio.conf.js

const { Authenticator } = require('authenticator-browser-extension');

exports.config = {
    
    capabilities: [{
        browserName: 'chrome',

        'goog:chromeOptions': {
            extensions: [
                Authenticator.for('username', 'password').asBase64()
            ]
        }
    }],
    
    // other WebdriverIO config
}

Protractor

Import the authenticator-browser-extension in the protractor.conf.js file and add Authenticator to the list of Chrome extensions:

// protractor.conf.js

const { Authenticator } = require('authenticator-browser-extension');

exports.config = {

    capabilities: {
        browserName: 'chrome',

        chromeOptions: {
            extensions: [
                Authenticator.for('username', 'password').asBase64()
            ]
        }
    },

    // other Protractor config
}

Puppeteer

Import the authenticator-browser-extension and generate an expanded Authenticator web extension directory before launching a Puppeteer browser:

// puppeteer/chrome-authenticator-extension.spec.ts
const { Authenticator } = require('authenticator-browser-extension');
 
const authenticator = Authenticator.for('admin', 'Password123')
    .asDirectoryAt(`${process.cwd()}/build/puppeteer/authenticator`);

browser = await puppeteer.launch({
    headless: false,

    args: [
        `--disable-extensions-except=${authenticator}`,
        `--load-extension=${authenticator}`,
        `--no-sandbox`,
    ],
});

Playwright

Requires launching a persistent browser context instance containing the Authenticator extension. In every other way a carbon copy of the Puppeteer prototype.

// playwright/chrome-authenticator-extension.spec.ts
const extensionDirectory = `${process.cwd()}/build/playwright/authenticator`;

const authenticator = Authenticator.for(
    'admin',
    'Password123'
).asDirectoryAt(extensionDirectory);

browser = await playwright['chromium'].launchPersistentContext(
    extensionDirectory,
    {
        args: [
            `--disable-extensions-except=${authenticator}`,
            `--load-extension=${authenticator}`,
            `--no-sandbox`,
        ],
        headless: false,
    }
);

Known limitations

Chrome headless

Chrome doesn't support browser extensions when running in headless mode and Chrome developers have decided against implementing this feature in any near future due to complexity of the task.

The best way to get around this limitation is to use Chrome together with the X Virtual Framebuffer (XVFB).

Firefox

Authenticator generates the web extension dynamically on your machine, which means that the extension is not signed by Mozilla. For this reason, in order to use Authenticator, you need to configure Firefox with a xpinstall.signatures.required flag set to false (see example).

NOTE: Firefox 48 (Pushed from Firefox 46) and newer do not allow for unsigned extensions to be installed, so you need to use Firefox Developer Edition instead.

Your feedback matters!

Do you find Authenticator useful? Give it a star! ★

Found a bug? Need a feature? Raise an issue or submit a pull request.

Have feedback? Let me know on twitter: @JanMolak

Before you go

☕ If Authenticator has made your life a little bit easier and saved at least $5 worth of your time, please consider repaying the favour and buying me a coffee via Github Sponsors. Thanks! 🙏

License

Authenticator library is licensed under the Apache-2.0 license.

- Copyright © 2019- Jan Molak