Project settings page is the control center for each project, it gives you various tools and configurations to fine-tune your project. Below is a quick run through of each tab and some of the features.
All of the project information entered when you created a new project are presented here. This screen mainly allow you to add/remove urls or change device breakpoint you want to test.
Enabling automatic snapshot means BackTrac will regularly take screenshots for the project for the configured frequency. This is helpful if you want to keep a visual backup of the website and/or for archival purposes.
BackTrac gives you the ability to configure multiple environment for your project. Once you have entered environment information, you can use the “Compare” feature to quickly run visual comparison test between two environments in a project.
- Production: http://www.example.com
- Stage: http://stage.example.com
- Development:: http://dev.example.com
If you need to test URLs that are behind a login wall (i.e. paid membership website, intranet, etc), you can optionally provide your username and password in order to authorize BackTrac from running comparison tests. You will also need to provide the css selectors for the username, password and submission form elements.
- Wordpress: http://www.example.com/wp-admin
- Drupal: http://www.example.com/user/login
- Joomla: http://www.example.com/administrator
You can also add additional email addresses that will receive notification when visual changes are detected on the project. This is helpful to project stakeholders that do not need to log into the system.
Snapshot settings contains two advanced but useful features. Crop screenshot by querySelector gives you the ability to crop snapshots taken. This is helpful when you want to monitor just a small part of the web page.
For example, a regular snapshot taken by BackTrac contains the full screenshot of the webpage:
However, we can select a specific part of the web page to test by adding the selector “#hero-slider-wrapper”. The resulting screenshot will look like:
Exclude Elements from Screenshot is another highly useful feature as it gives you the ability to exclude sections from a web page from being tested. For example, if I wanted to exclude all advertisements on a website from being tested, I could simply supply the appropriate selectors and the resulting screenshot will look like below:
Please note that sections being excluded are color coded in green.
Advanced settings provide additional situational support when capturing websites. For example, you can set a 10 to 15 seconds delay on websites that contain timed splash pages.