Skip to content

Commit

Permalink
Merge pull request #523 from alexbenic/twig-tests
Browse files Browse the repository at this point in the history 
Convert engine_twig_tests.js to use tape
  • Loading branch information
@bmuenzenmeyer
bmuenzenmeyer authored Oct 10, 2016
2 parents 64a21c9 + 24901ec commit c92aec4
Showing 1 changed file with 138 additions and 130 deletions.
268 changes: 138 additions & 130 deletions test/engine_twig_tests.js
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,22 @@
"use strict";
/*eslint-disable dot-notation*/
/*eslint-disable no-shadow*/

var tap = require('tap');
var path = require('path');
var pa = require('../core/lib/pattern_assembler');
var Pattern = require('../core/lib/object_factory').Pattern;
var eol = require('os').EOL;

// don't run these tests unless twig is installed
var engineLoader = require('../core/lib/pattern_engines');
if (!engineLoader.twig) {
tap.test('Twig engine not installed, skipping tests.', function (test) {
test.end();
});
return;
}

// fake pattern lab constructor:
// sets up a fake patternlab object, which is needed by the pattern processing
// apparatus.
Expand Down Expand Up @@ -34,7 +45,7 @@ function fakePatternLab() {

// function for testing sets of partials
function testFindPartials(test, partialTests) {
test.expect(partialTests.length + 1);
test.plan(partialTests.length + 1);

// setup current pattern from what we would have during execution
// docs on partial syntax are here:
Expand All @@ -56,136 +67,133 @@ function testFindPartials(test, partialTests) {
test.equals(results[index], testString);
});

test.done();
test.end();
}

exports['engine_twig'] = {
'button twig pattern renders': function (test) {
test.expect(1);

var patternPath = path.join('00-atoms', '00-general', '08-button.twig');
var expectedValue = '<style>' + eol + ' .btn {' + eol + ' padding: 10px;' + eol + ' border-radius: 10px;' + eol + ' display: inline-block;' + eol + ' text-align: center;' + eol + ' }' + eol + '</style>' + eol + eol + '<a href="#" class="btn">Button</a>' + eol;

// do all the normal processing of the pattern
var patternlab = new fakePatternLab();
var assembler = new pa();
var helloWorldPattern = assembler.process_pattern_iterative(patternPath, patternlab);
assembler.process_pattern_recursive(patternPath, patternlab);

test.equals(helloWorldPattern.render(), expectedValue);
test.done();
},
'media object twig pattern can see the atoms-button and atoms-image partials and renders them': function (test) {
test.expect(1);

// pattern paths
var buttonPatternPath = path.join('00-atoms', '00-general', '08-button.twig');
var imagePatternPath = path.join('00-atoms', '00-general', '09-image.twig');
var mediaObjectPatternPath = path.join('00-molecules', '00-general', '00-media-object.twig');

var expectedValue = '<style>\n .Media {\n display: flex;\n align-items: flex-start;\n }\n\n .Media > img {\n margin-right: 1em;\n max-width: 200px;\n }\n\n .Media-body {\n flex: 1;\n }\n</style>\n\n\n\n\n<div class="Media">\n <img src="http://placeholdit.imgix.net/~text?txtsize=33&txt=280%C3%97220&w=280&h=220&fm=pjpg"\n srcset="http://placeholdit.imgix.net/~text?txtsize=33&txt=280%C3%97220&w=280&h=220&fm=pjpg 280w,\n http://placeholdit.imgix.net/~text?txtsize=33&txt=560%C3%97440&w=560&h=440&fm=pjpg 560w,\n http://placeholdit.imgix.net/~text?txtsize=33&txt=840%C3%97660&w=840&h=660&fm=pjpg 840w"\n sizes="100vw">\n\n <style>\n .btn {\n padding: 10px;\n border-radius: 10px;\n display: inline-block;\n text-align: center;\n }\n</style>\n\n<a href="#" class="btn">Button</a>\n\n\n <div class="Media-body">\n\n \n \n\n <p>Oh, hello world!</p>\n </div>\n</div>\n';

// set up environment
var patternlab = new fakePatternLab(); // environment
var assembler = new pa();

// do all the normal processing of the pattern
assembler.process_pattern_iterative(buttonPatternPath, patternlab);
assembler.process_pattern_iterative(imagePatternPath, patternlab);
var mediaObjectPattern = assembler.process_pattern_iterative(mediaObjectPatternPath, patternlab);
assembler.process_pattern_recursive(buttonPatternPath, patternlab);
assembler.process_pattern_recursive(imagePatternPath, patternlab);
assembler.process_pattern_recursive(mediaObjectPatternPath, patternlab);

// test
// this pattern is too long - so just remove line endings on both sides and compare output
test.equals(mediaObjectPattern.render().replace(/\r?\n|\r/gm, ""), expectedValue.replace(/\r?\n|\r/gm, ""));
test.done();
},
// 'twig partials can render JSON values': function (test) {
// test.expect(1);

// // pattern paths
// var pattern1Path = path.resolve(
// testPatternsPath,
// '00-atoms',
// '00-global',
// '00-helloworld-withdata.hbs'
// );

// // set up environment
// var patternlab = new fakePatternLab(); // environment
// var assembler = new pa();

// // do all the normal processing of the pattern
// var helloWorldWithData = assembler.process_pattern_iterative(pattern1Path, patternlab);
// assembler.process_pattern_recursive(pattern1Path, patternlab);

// // test
// test.equals(helloWorldWithData.render(), 'Hello world!\nYeah, we got the subtitle from the JSON.\n');
// test.done();
// },
// 'twig partials use the JSON environment from the calling pattern and can accept passed parameters': function (test) {
// test.expect(1);

// // pattern paths
// var atomPath = path.resolve(
// testPatternsPath,
// '00-atoms',
// '00-global',
// '00-helloworld-withdata.hbs'
// );
// var molPath = path.resolve(
// testPatternsPath,
// '00-molecules',
// '00-global',
// '00-call-atom-with-molecule-data.hbs'
// );

// // set up environment
// var patternlab = new fakePatternLab(); // environment
// var assembler = new pa();

// // do all the normal processing of the pattern
// var atom = assembler.process_pattern_iterative(atomPath, patternlab);
// var mol = assembler.process_pattern_iterative(molPath, patternlab);
// assembler.process_pattern_recursive(atomPath, patternlab);
// assembler.process_pattern_recursive(molPath, patternlab);

// // test
// test.equals(mol.render(), '<h2>Call with default JSON environment:</h2>\nThis is Hello world!\nfrom the default JSON.\n\n\n<h2>Call with passed parameter:</h2>\nHowever, this is Hello world!\nfrom a totally different blob.\n\n');
// test.done();
// },
'find_pattern_partials finds partials': function (test) {
testFindPartials(test, [
'{% include "atoms-image" %}',
"{% include 'atoms-image' %}",
"{%include 'atoms-image'%}",
"{% include 'molecules-template' only %}",
"{% include 'organisms-sidebar' ignore missing %}",
"{% include 'organisms-sidebar' ignore missing only %}"
]);
},
'find_pattern_partials finds verbose partials': function (test) {
testFindPartials(test, [
"{% include '01-molecules/06-components/03-comment-header.twig' %}",
"{% include '00-atoms/00-global/06-test' %}"
]);
},
'find_pattern_partials finds partials with twig parameters': function (test) {
testFindPartials(test, [
"{% include 'molecules-template' with {'foo': 'bar'} %}",
"{% include 'molecules-template' with vars %}",
"{% include 'molecules-template.twig' with {'foo': 'bar'} only %}",
"{% include 'organisms-sidebar' ignore missing with {'foo': 'bar'} %}"
]);
}
};
tap.test('button twig pattern renders', function (test) {
test.plan(1);

var patternPath = path.join('00-atoms', '00-general', '08-button.twig');
var expectedValue = '<style>' + eol + ' .btn {' + eol + ' padding: 10px;' + eol + ' border-radius: 10px;' + eol + ' display: inline-block;' + eol + ' text-align: center;' + eol + ' }' + eol + '</style>' + eol + eol + '<a href="#" class="btn">Button</a>' + eol;

// do all the normal processing of the pattern
var patternlab = new fakePatternLab();
var assembler = new pa();
var helloWorldPattern = assembler.process_pattern_iterative(patternPath, patternlab);
assembler.process_pattern_recursive(patternPath, patternlab);

test.equals(helloWorldPattern.render(), expectedValue);
test.end();
});

tap.test('media object twig pattern can see the atoms-button and atoms-image partials and renders them', function (test) {
test.plan(1);

// pattern paths
var buttonPatternPath = path.join('00-atoms', '00-general', '08-button.twig');
var imagePatternPath = path.join('00-atoms', '00-general', '09-image.twig');
var mediaObjectPatternPath = path.join('00-molecules', '00-general', '00-media-object.twig');

var expectedValue = '<style>\n .Media {\n display: flex;\n align-items: flex-start;\n }\n\n .Media > img {\n margin-right: 1em;\n max-width: 200px;\n }\n\n .Media-body {\n flex: 1;\n }\n</style>\n\n\n\n\n<div class="Media">\n <img src="http://placeholdit.imgix.net/~text?txtsize=33&txt=280%C3%97220&w=280&h=220&fm=pjpg"\n srcset="http://placeholdit.imgix.net/~text?txtsize=33&txt=280%C3%97220&w=280&h=220&fm=pjpg 280w,\n http://placeholdit.imgix.net/~text?txtsize=33&txt=560%C3%97440&w=560&h=440&fm=pjpg 560w,\n http://placeholdit.imgix.net/~text?txtsize=33&txt=840%C3%97660&w=840&h=660&fm=pjpg 840w"\n sizes="100vw">\n\n <style>\n .btn {\n padding: 10px;\n border-radius: 10px;\n display: inline-block;\n text-align: center;\n }\n</style>\n\n<a href="#" class="btn">Button</a>\n\n\n <div class="Media-body">\n\n \n \n\n <p>Oh, hello world!</p>\n </div>\n</div>\n';

// set up environment
var patternlab = new fakePatternLab(); // environment
var assembler = new pa();

// do all the normal processing of the pattern
assembler.process_pattern_iterative(buttonPatternPath, patternlab);
assembler.process_pattern_iterative(imagePatternPath, patternlab);
var mediaObjectPattern = assembler.process_pattern_iterative(mediaObjectPatternPath, patternlab);
assembler.process_pattern_recursive(buttonPatternPath, patternlab);
assembler.process_pattern_recursive(imagePatternPath, patternlab);
assembler.process_pattern_recursive(mediaObjectPatternPath, patternlab);

// test
// this pattern is too long - so just remove line endings on both sides and compare output
test.equals(mediaObjectPattern.render().replace(/\r?\n|\r/gm, ""), expectedValue.replace(/\r?\n|\r/gm, ""));
test.end();
});

tap.test('twig partials can render JSON values', {skip: true}, function (test) {
test.plan(1);

// pattern paths
var pattern1Path = path.resolve(
testPatternsPath,
'00-atoms',
'00-global',
'00-helloworld-withdata.hbs'
);

// set up environment
var patternlab = new fakePatternLab(); // environment
var assembler = new pa();

// do all the normal processing of the pattern
var helloWorldWithData = assembler.process_pattern_iterative(pattern1Path, patternlab);
assembler.process_pattern_recursive(pattern1Path, patternlab);

// test
test.equals(helloWorldWithData.render(), 'Hello world!\nYeah, we got the subtitle from the JSON.\n');
test.end();
});

tap.test('twig partials use the JSON environment from the calling pattern and can accept passed parameters', {skip: true}, function (test) {
test.plan(1);

// pattern paths
var atomPath = path.resolve(
testPatternsPath,
'00-atoms',
'00-global',
'00-helloworld-withdata.hbs'
);
var molPath = path.resolve(
testPatternsPath,
'00-molecules',
'00-global',
'00-call-atom-with-molecule-data.hbs'
);

// set up environment
var patternlab = new fakePatternLab(); // environment
var assembler = new pa();

// do all the normal processing of the pattern
var atom = assembler.process_pattern_iterative(atomPath, patternlab);
var mol = assembler.process_pattern_iterative(molPath, patternlab);
assembler.process_pattern_recursive(atomPath, patternlab);
assembler.process_pattern_recursive(molPath, patternlab);

// test
test.equals(mol.render(), '<h2>Call with default JSON environment:</h2>\nThis is Hello world!\nfrom the default JSON.\n\n\n<h2>Call with passed parameter:</h2>\nHowever, this is Hello world!\nfrom a totally different blob.\n\n');
test.end();
});

tap.test('find_pattern_partials finds partials', function (test) {
testFindPartials(test, [
'{% include "atoms-image" %}',
"{% include 'atoms-image' %}",
"{%include 'atoms-image'%}",
"{% include 'molecules-template' only %}",
"{% include 'organisms-sidebar' ignore missing %}",
"{% include 'organisms-sidebar' ignore missing only %}"
]);
});

tap.test('find_pattern_partials finds verbose partials', function (test) {
testFindPartials(test, [
"{% include '01-molecules/06-components/03-comment-header.twig' %}",
"{% include '00-atoms/00-global/06-test' %}"
]);
});

tap.test('find_pattern_partials finds partials with twig parameters', function (test) {
testFindPartials(test, [
"{% include 'molecules-template' with {'foo': 'bar'} %}",
"{% include 'molecules-template' with vars %}",
"{% include 'molecules-template.twig' with {'foo': 'bar'} only %}",
"{% include 'organisms-sidebar' ignore missing with {'foo': 'bar'} %}"
]);
});

// don't run these tests unless twig is installed
var engineLoader = require('../core/lib/pattern_engines');
if (!engineLoader.twig) {
console.log("Twig engine not installed, skipping tests.");
delete exports.engine_twig;
}

0 comments on commit c92aec4

Please # to comment.