Nunjucks: JavaScript templating language

Nunjucks logo

http://mozilla.github.io/nunjucks/


Example Template

{% extends "base.html" %}

{% block header %}
<h1>{{ title }}</h1>
{% endblock %}

{% block content %}
<ul>
  {% for name, item in items %}
  <li>{{ name }}: {{ item }}</li>
  {% endfor %}
</ul>
{% endblock %}

Builtin Filters

{{ foo | title }}
{{ foo | join(",") }}
{{ foo | replace("foo", "bar") | capitalize }}

Keyword Arguments

{{ foo(1, 2, bar=3, baz=4) }}
{{ bar | transform(level=2) }}

Template Inheritance

{% extends "base.html" %}

{% block header %}
<h3>{{ subtitle }}</h3>
{% endblock %}

{% block content %}
<h1>{{ page.title }}</h1>
<p>{{ page.content }}</p>
{% endblock %}

Asynchronous Templates

<h1>Posts</h1>
<ul>
{% asyncAll item in items %}
  <li>{{ item.id | lookup }}</li>
{% endall %}
</ul>

Nightmare: High level wrapper for Phantomjs that provides a streamlined API

Nightmare logo

http://www.nightmarejs.org/

Raw PhantomJS

phantom.create(function (ph) {
  ph.createPage(function (page) {
    page.open('http://yahoo.com', function (status) {
      page.evaluate(function () {
        var el =
          document.querySelector('input[title="Search"]');
        el.value = 'github nightmare';
      }, function (result) {
        page.evaluate(function () {
          var el = document.querySelector('.searchsubmit');
          var event = document.createEvent('MouseEvent');
          event.initEvent('click', true, false);
          el.dispatchEvent(event);
        }, function (result) {
          ph.exit();
        });
      });
    });
  });
});

With Nightmare

new Nightmare()
  .goto('http://yahoo.com')
  .type('input[title="Search"]', 'github nightmare')
  .click('.searchsubmit')
  .run();