An autoescaping JavaScript template tagged literal

autoescape.js

class Safe extends String {}

function safe(s) {
  if (!(s instanceof Safe)) {
    return new Safe(s);
  } else {
    return s;
  }
}

function htmlEscape(html) {
  return html.replace(
    /&/g, '&'
  ).replace(
    />/g, '>'
  ).replace(
    /</g, '&lt;'
  ).replace(
    /"/g, '&quot;'
  ).replace(
    /'/g, '&#039;'
  );
}

var autoescape = (fragments, ...inserts) => safe(fragments.map(
  (fragment, i) => {
    var bit = fragment;
    var insert = (inserts[i] || '');
    if (!(insert instanceof Safe)) {
      insert = htmlEscape(insert.toString());
    }
    return fragment + insert;
  }
).join(''));

example-usage.js

function renderResults(docs) {
  var html = docs.map(doc => autoescape`
  <div class="result">
    <h2><a href="${doc.url}">${doc.title}</a></h2>
    <div class="result-body">
      <p>${doc.summary}...</p>
      <p>Updated ${formatTimestamp(doc.updated)} by ${doc.updated_by} (${doc.format}) ${doc.source_url ? safe(`<a href="${doc.source_url}">source</a>`): ''}</p>
    </div>
  </div>`).join("");
  document.getElementById("content").innerHTML = html;
}