text: 'use strict';
  
  /* global XMLHttpRequest */
  
  const path = document.location.pathname;
  const target = document.querySelector('#target');
  const style = document.createElement('style');
  const css = `table {
      border-radius: 0.3rem;
      border: 0.1rem solid #474747;
      border-spacing: 0;
      padding: 0;
      width: 50%;
    }
  
    table td {
      border-right: 0.1rem solid #474747;
      padding: 0.5rem 1rem;
    }
  
    table tr td:last-child {
      border-right: 0;
      text-align: center;
    }
  
    table td.pass {
      background: #f2f9f4;
      color: #4db277;
    }
  
    table td.fail {
      background: #f2dede;
      color: #a94442;
    }`;
  
  style.appendChild(document.createTextNode(css));
  document.head.appendChild(style);
  target.innerHTML = `Current Path: <code>${path}</code>`;
  
  document.addEventListener(
    'DOMContentLoaded',
    () => {
      if (document.querySelector('#files')) {
        return;
      }
  
      const tests = [
        { url: '/', name: 'index', re: /^<!doctype html>/i },
        { url: '/test', name: 'non-existent path', re: /^<!doctype html>/i },
        { url: '/file.txt', name: 'existing path', re: /^file/ },
      ];
      const table = document.createElement('table');
      const tbody = document.createElement('tbody');
  
      table.id = 'files';
      table.appendChild(tbody);
      target.parentNode.appendChild(table);
  
      tests.forEach((test) => {
        const tr = document.createElement('tr');
        tbody.appendChild(tr);
        check(test.url, test.re, (res) => {
          tr.innerHTML = `<td>${test.name}</td>`;
          tr.innerHTML += `<td><a href="${test.url}">${test.url}</a></td>`;
          tr.innerHTML += `<td class="${res}">${res}</td>`;
        });
      });
    },
    true
  );
  
  function check(url, re, cb) {
    const xhr = new XMLHttpRequest();
    xhr.addEventListener('load', () => {
      cb(re.test(xhr.responseText) ? 'pass' : 'fail');
    });
    xhr.open('GET', url);
    xhr.send();
  }
  