additional tests to cover styleModifier / pattern Parameter relationship

fixes #190
pattern-lab · Nov 25, 2015 · 9cd187b · 9cd187b
1 parent ffc80cb
commit 9cd187b
Show file tree

Hide file tree

Showing 6 changed files with 127 additions and 6 deletions.
diff --git a/CHANGELOG b/CHANGELOG
@@ -3,6 +3,7 @@ THIS CHANGELOG IS AN ATTEMPT TO DOCUMENT CHANGES TO THIS PROJECT.
 PL-node-v0.15.1
 - FIX: Resolve issue with styleModifiers not being replaced when the partial has spaces in it.
 - ADD: Support multiple styleModifier classes using the | pipe syntax
+- FIX: Resolve issue with styleModifiers not being applied correctly when mixed with pattern parameters
 - THX: Thanks @theorise for the issue reports!
 
 PL-node-v0.15.0

diff --git a/builder/parameter_hunter.js b/builder/parameter_hunter.js
@@ -1,10 +1,10 @@
-/* 
- * patternlab-node - v0.15.1 - 2015 
- * 
+/*
+ * patternlab-node - v0.15.1 - 2015
+ *
  * Brian Muenzenmeyer, and the web community.
- * Licensed under the MIT license. 
- * 
- * Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice. 
+ * Licensed under the MIT license.
+ *
+ * Many thanks to Brad Frost and Dave Olsen for inspiration, encouragement, and advice.
  *
  */
 
@@ -28,6 +28,8 @@
 					//find the partial's name and retrieve it
 					var partialName = pMatch.match(/([\w\-\.\/~]+)/g)[0];
 					var partialPattern = pattern_assembler.get_pattern_by_key(partialName, patternlab);
+					//if we retrieved a pattern we should make sure that its extendedTemplate is reset. looks to fix #190
+					partialPattern.extendedTemplate = partialPattern.template;
 
 					if(patternlab.config.debug){
 						console.log('found patternParameters for ' + partialName);

diff --git a/test/files/_patterns/00-test/07-mixed-params.mustache b/test/files/_patterns/00-test/07-mixed-params.mustache
@@ -0,0 +1,6 @@
+<div class="test_group">
+    {{> test-styled-atom }}
+    {{> test-styled-atom:test_2(message: '2') }}
+    {{> test-styled-atom:test_3(message: '3') }}
+    {{> test-styled-atom:test_4(message: '4') }}
+</div>
diff --git a/test/files/_patterns/00-test/08-bookend-params.mustache b/test/files/_patterns/00-test/08-bookend-params.mustache
@@ -0,0 +1,6 @@
+<div class="test_group">
+    {{> test-styled-atom }}
+    {{> test-styled-atom:test_2(message: '2') }}
+    {{> test-styled-atom:test_3(message: '3') }}
+    {{> test-styled-atom }}
+</div>
diff --git a/test/files/_patterns/00-test/09-bookend.mustache b/test/files/_patterns/00-test/09-bookend.mustache
@@ -0,0 +1,6 @@
+<div class="test_group">
+    {{> test-styled-atom }}
+    {{> test-styled-atom:test_2 }}
+    {{> test-styled-atom:test_3 }}
+    {{> test-styled-atom}}
+</div>
diff --git a/test/pattern_assembler_tests.js b/test/pattern_assembler_tests.js
@@ -349,6 +349,106 @@
 			var expectedValue = '<div class="test_group"> <span class="test_base {{styleModifier}}"> {{message}} </span> <span class="test_base test_2"> {{message}} </span> <span class="test_base test_3"> {{message}} </span> <span class="test_base test_4"> {{message}} </span> </div>';
 			test.equals(mixedPattern.extendedTemplate.replace(/\s\s+/g, ' ').trim(), expectedValue.trim());
 			test.done();
+		},
+		'processPatternRecursive - correctly ignores bookended partials without a style modifier when the same partial has a style modifier  between' : function(test){
+			//arrange
+			var fs = require('fs-extra');
+			var pattern_assembler = new pa();
+
+			var pl = {};
+			pl.config = {};
+			pl.data = {};
+			pl.data.link = {};
+			pl.config.debug = false;
+			pl.patterns = [];
+			var patterns_dir = './test/files/_patterns';
+
+			var atomPattern = new object_factory.oPattern('test/files/_patterns/00-test/03-styled-atom.mustache', '00-test', '03-styled-atom.mustache');
+			atomPattern.template = fs.readFileSync(patterns_dir + '/00-test/03-styled-atom.mustache', 'utf8');
+			atomPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(atomPattern);
+
+			var bookendPattern = new object_factory.oPattern('test/files/_patterns/00-test/09-bookend.mustache', '00-test', '09-bookend.mustache');
+			bookendPattern.template = fs.readFileSync(patterns_dir + '/00-test/09-bookend.mustache', 'utf8');
+			bookendPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(bookendPattern);
+
+			pl.patterns.push(atomPattern);
+			pl.patterns.push(bookendPattern);
+
+			//act
+			pattern_assembler.process_pattern_recursive('test/files/_patterns/00-test/09-bookend.mustache', pl, {});
+
+			//assert. here we expect {{styleModifier}} to be in the first and last group, since it was not replaced by anything. rendering with data will then remove this (correctly)
+			var expectedValue = '<div class="test_group"> <span class="test_base {{styleModifier}}"> {{message}} </span> <span class="test_base test_2"> {{message}} </span> <span class="test_base test_3"> {{message}} </span> <span class="test_base {{styleModifier}}"> {{message}} </span> </div>';
+			test.equals(bookendPattern.extendedTemplate.replace(/\s\s+/g, ' ').trim(), expectedValue.trim());
+			test.done();
+		},
+		'processPatternRecursive - correctly ignores a partial without a style modifier when the same partial later has a style modifier and pattern parameters' : function(test){
+			//arrange
+			var fs = require('fs-extra');
+			var pattern_assembler = new pa();
+
+			var pl = {};
+			pl.config = {};
+			pl.data = {};
+			pl.data.link = {};
+			pl.config.debug = false;
+			pl.patterns = [];
+			var patterns_dir = './test/files/_patterns';
+
+			var atomPattern = new object_factory.oPattern('test/files/_patterns/00-test/03-styled-atom.mustache', '00-test', '03-styled-atom.mustache');
+			atomPattern.template = fs.readFileSync(patterns_dir + '/00-test/03-styled-atom.mustache', 'utf8');
+			atomPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(atomPattern);
+      atomPattern.parameteredPartials = pattern_assembler.find_pattern_partials_with_parameters(atomPattern);
+
+			var mixedPattern = new object_factory.oPattern('test/files/_patterns/00-test/07-mixed-params.mustache', '00-test', '07-mixed-params.mustache');
+			mixedPattern.template = fs.readFileSync(patterns_dir + '/00-test/07-mixed-params.mustache', 'utf8');
+			mixedPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(mixedPattern);
+      mixedPattern.parameteredPartials = pattern_assembler.find_pattern_partials_with_parameters(mixedPattern);
+
+			pl.patterns.push(atomPattern);
+			pl.patterns.push(mixedPattern);
+
+			//act
+			pattern_assembler.process_pattern_recursive('test/files/_patterns/00-test/07-mixed-params.mustache', pl, {});
+
+			//assert. here we expect {{styleModifier}} to be in the first span, since it was not replaced by anything. rendering with data will then remove this (correctly)
+			var expectedValue = '<div class="test_group"> <span class="test_base {{styleModifier}}"> {{message}} </span> <span class="test_base test_2"> 2 </span> <span class="test_base test_3"> 3 </span> <span class="test_base test_4"> 4 </span> </div>';
+			test.equals(mixedPattern.extendedTemplate.replace(/\s\s+/g, ' ').trim(), expectedValue.trim());
+			test.done();
+		},
+		'processPatternRecursive - correctly ignores bookended partials without a style modifier when the same partial has a style modifier and pattern parameters between' : function(test){
+			//arrange
+			var fs = require('fs-extra');
+			var pattern_assembler = new pa();
+
+			var pl = {};
+			pl.config = {};
+			pl.data = {};
+			pl.data.link = {};
+			pl.config.debug = false;
+			pl.patterns = [];
+			var patterns_dir = './test/files/_patterns';
+
+			var atomPattern = new object_factory.oPattern('test/files/_patterns/00-test/03-styled-atom.mustache', '00-test', '03-styled-atom.mustache');
+			atomPattern.template = fs.readFileSync(patterns_dir + '/00-test/03-styled-atom.mustache', 'utf8');
+			atomPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(atomPattern);
+      atomPattern.parameteredPartials = pattern_assembler.find_pattern_partials_with_parameters(atomPattern);
+
+			var bookendPattern = new object_factory.oPattern('test/files/_patterns/00-test/08-bookend-params.mustache', '00-test', '08-bookend-params.mustache');
+			bookendPattern.template = fs.readFileSync(patterns_dir + '/00-test/08-bookend-params.mustache', 'utf8');
+			bookendPattern.stylePartials = pattern_assembler.find_pattern_partials_with_style_modifiers(bookendPattern);
+      bookendPattern.parameteredPartials = pattern_assembler.find_pattern_partials_with_parameters(bookendPattern);
+
+			pl.patterns.push(atomPattern);
+			pl.patterns.push(bookendPattern);
+
+			//act
+			pattern_assembler.process_pattern_recursive('test/files/_patterns/00-test/08-bookend-params.mustache', pl, {});
+
+			//assert. here we expect {{styleModifier}} to be in the first and last span, since it was not replaced by anything. rendering with data will then remove this (correctly)
+			var expectedValue = '<div class="test_group"> <span class="test_base {{styleModifier}}"> {{message}} </span> <span class="test_base test_2"> 2 </span> <span class="test_base test_3"> 3 </span> <span class="test_base {{styleModifier}}"> {{message}} </span> </div>';
+			test.equals(bookendPattern.extendedTemplate.replace(/\s\s+/g, ' ').trim(), expectedValue.trim());
+			test.done();
 		}
 	};
 }());