Custom login instructions

Before reading this, please refer to the guide on Taking screenshots behind the user login

  • CUSTOM LOGIN INSTRUCTIONS IS CONSIDERED AN EXPERIMENTAL FEATURE, PLEASE USE AT YOUR OWN RISK
  • CUSTOM LOGIN DOES NOT SUPPORT TWO-FACTOR AUTHENTICATION (2FA)

Why

Custom login instructions give you a powerful way of providing steps to log into your website or web application. It is especially helpful if you have customized some aspect of the user login process (e.g. UX changes on one of the pre-configured website systems, implemented single-sign-on, etc)

An example of a non-standard user login can look like:

Here you are presented with a number of options to log in, there’s no place for you to immediately enter your username/password. Once you click on the link “Sign in with email and password”, the user login form reveals itself.

Custom login

Now you can enter your username, password and log into the website.

The general flow

Based on the example above, the general flow for a user login process generally looks like this:

  1. We visit the user login URL for the website or web app
  2. (Optionally) we might have to click the additional element to reveal the user login form
  3. We enter the user name, password
  4. We click the login or submit button to log in.

The custom login instruction syntax

Custom login instructions

The syntax should be in the following format (per line), make sure you do not include any extra space or empty lines in the configuration area.

[login_url]

[step 1 action]:[css selector]

[step 2 action]:[css selector]

[step 3 action]:[css selector]

...

At a minimum, you should have 3 actions, input the user name, input the password, click the login or submit button in order to facilitate the login process. Your first line should ALWAYS BE the login URL for the given website environment.

Supported Actions

Currently, we support 3 types of action:

  • click – used for clicking the submit button or other elements such as a link or checkbox to reveal
  • username – designates the input for entering the user name.
  • password – designates the input for entering the password.

FAQ

There are some additional common issues that you might run into while using custom login.

Login redirect

Sometimes the link on a website for user login might not be the final login URL/page. This is common with single-sign-on (SSO) solutions that utilize redirects. For example, the login process looks like:

  1. When you go to the login URL on the desired website example.com/login
  2. The URL redirects to a centralized login portal (login.portal.com). You enter your username and password and click “submit”
  3. You are logged in and redirected back to example.com

In this case, your [login_url] should be the first URL (example.com/login), not the REDIRECTED URL. (login.portal.com)

Basic authentication (htpassword)

If you have basic authentication setup for the website environment you are trying to test, you will need to include the user name/password in your [login_url]. (More information on basic authentication)

For example, Your login URL is https://www.example.com/user/login with the basic authentication credential of client/securePass1

In this case, your [login_url] definition should look like https://client:securePass1@www.example.com/user/login