Site Monitors

Intro to Site Monitors

Tenon's Site Monitor feature allows customers to quickly and easily test their entire site simply by placing a small snippet of JavaScript code on their site, similar to adding Google Analytics to your site. Simply add our JavaScript snippet and the testing is automatic. It is important to be careful, though, as this can eat up your API calls pretty quickly. Read the directions below to understand how to make the most of your SiteMonitor.

How Monitors Work

Tenon's Site Monitors are the single easiest way to do the following:

  • Test your entire website. Site Monitors will test every page on which our JavaScript snippet appears.
  • Verify new pages are tested as soon as they're added. If new content is added to the site, and the JavaScript snippet appears on the page (or the template that holds it) then the new pages will be tested as soon as they appear on the site
  • Re-test pages that have changed. You can set the Site Monitor to test pages whenever they're changed.
  • Test behind a login.

Monitor Flow

Here's a high level description of how Tenon Site Monitors ensure they can effectively test, even behind a login.

  1. With the Tenon Site Monitor snippet added to your page, whenever the page is viewed, it will attempt to test that page
  2. The Site Monitor sends the URL over to an internal service to "ping" the URL
  3. If the ping returns HTTP status code of 200, the URL is sent to Tenon's Test API
  4. If the ping returns HTTP status code of 401, the page source is assembled as a payload and sent to Tenon's Test API

A number of additional parameters can be used to dictate how & when testing is done, for instance testing only pages that are new, etc.

Security and Privacy

It is very important that you understand the Security and Privacy implications of using Site Monitors for testing behind a login, especially on production systems. You should review our Privacy and Security documentation before continuing.

Security

Tenon site monitors will send a request to the Tenon API for any web page the Site Monitor code exists on. This includes pages behind a login and even pages behind a firewall or VPN. If the viewing computer can access the outside world, the payload will be sent. You should never put the Site Monitor code on a site intended to hold sensitive information.

Privacy

All traffic to & from Tenon's service is handled over SSL. We store certain portions of test results, but you can turn this storage off in your project settings. Regardless, you should ensure that the Site Monitor snippet is not used on any page that displays Personally Identifiable Information (PII).

Set it up on Tenon's side

To set up your Site Monitor, log in to Tenon and go to "Settings" and then "Site Monitors". The following form will appear:

Screenshot of the Add Site Monitor Page

Enter an informative name for your site monitor so you can remember where it is. Then, enter the site's URL. Just the domain is fine. Finally, select a Project for the Site Monitor. Generally you'll want this to be a unique project for each Site Monitor. This helps keep things organized and helps make reporting easier. When you've finished adding the necessary details, submit the form. You'll be taken back to the Site Monitors list.

Screenshot of Site Monitor list and code example described below

When the Site Monitor list is shown it will now include a list of your monitors as well as a code sample you can use to cut and paste into your site. The code sample will look like this:



<script>
window.tenonSiteMonitor = {
    siteKey: 'yLl2zSAMIrDs'
}
</script>
<script src='https://tenon.io/api/monitor.js'></script>

Install the Site Monitor code snippet

To install the Site Monitor code, simply add the code snippet to your website, right before the closing body tag.

Additional Configuration Parameters

There are a handful of additional configuration parameters you can add to your Site Monitor to "dial in" your testing:

  • onlyNew: Takes a boolean value. Allows you to tell the Site Monitor that you only want to test new pages that it has never seen. This has the highest level of precedence. If you set this to true it will never test the same page twice. By default this is set to false
  • hashFrom: Takes a string value. Site Monitors will "hash" a page in order to determine whether a page is unique and/ or if it has changed. Unfortunately a lot of things can cause a page's hash has change. This parameter allows you to dictate what determines how we decide "uniqueness". This can take anything you'd put into querySelectorAll(). Generally, you want to avoid including content that changes or updates based on JavaScript, especially session tokens and A/B testing.
  • interval: Takes an integer value. Allows you to set a total number of seconds between tests of the same page, even if that page has changed since the last time we've seen it.
  • inline: Takes an boolean value. If set to true, it will "inline" all page assets and send them as part of the payload to be tested.

Examples

Only test pages once a month (30 days * 24 hours * 60 minutes * 60 seconds):


<script>
window.tenonSiteMonitor = {
    siteKey: 'yLl2zSAMIrDs',
    interval: 2592000
}
</script>

Determine "uniqueness" based on a has of the div element with an ID of 'container':


<script>
window.tenonSiteMonitor = {
    siteKey: 'yLl2zSAMIrDs',
    hashFrom: #container
}
</script>

Only test new pages:


<script>
window.tenonSiteMonitor = {
    siteKey: 'yLl2zSAMIrDs',
    onlyNew: true
}
</script>

Benefits and Use Cases for the Site Monitors

By far the biggest benefit to using Site Monitors is to be able to test all pages of your site, regardless of whether they're new or whether they require a login to view. Tenon's Site Monitor checks to see if our test API can access the page. If not, it tests the document source instead. In other words, there's no need for any sort of custom integration or fancy Selenium scripting to log in and test authenticated areas. Tenon's Site Monitors allow you to test everything.

The second really powerful benefit is in being able to monitor the accessibility of new content. If your site has a lot of different people adding new content on a regular basis, you can set it up to test new content as soon as it is added to the site, ensuring that you're on top of accessibility issues as soon as they happen.