Properly debug Jekyll variables

debug.md.html

---
layout: page
title: debug
permalink: /debug
---

<div id="jekyll-debug"></div>

<script>
  var debugDiv = document.getElementById('jekyll-debug');
  {% assign debug_variables = "site, page, layout, content, paginator" | split: ',' %}
  var variables = {
    {% for var in debug_variables %}
    "{{ var }}": JSON.stringify(JSON.parse(decodeURIComponent("{{ [var] | jsonify | uri_escape }}")), null, 2),
    {% endfor %}
  };

  for (var key in variables) {
    var variableDiv = document.createElement('pre');

    variableDiv.textContent = key + ":\n" + variables[key] + "\n";

    document.body.appendChild(variableDiv);
  }
</script>

I'm getting Liquid Warning: Liquid syntax error (line 8): [:open_square, "["] is not a valid expression in "{{ [var] | jsonify | uri_escape }}" but it seems to work anyway.