Add a verbose flag to output sass warnings. (#513)

README.md

@@ -41,6 +41,7 @@ If you have any issues with OBT, please check out [troubleshooting guide](https:
 		--demo-filter=<demo-name>  Build a specific demo. E.G. --demo-filter=pa11y to build only the pa11y.html demo.
 		--suppress-errors          Do not error if no demos are found when using the --demo-filter option.
 		--debug                    Keep the test runner open to enable debugging in any browser.
+		--verbose                  Output sass warnings with backtraces.
 
 ### Developing products
 

lib/origami-build-tools-cli.js

@@ -41,6 +41,7 @@ const help = `
 			--demo-filter=<demo-name>  Build a specific demo. E.G. --demo-filter=pa11y to build only the pa11y.html demo.
 			--suppress-errors          Do not error if no demos are found when using the --demo-filter option.
 			--debug                    Keep the test runner open to enable debugging in any browser.
+			--verbose                  Output sass warnings with backtraces.
 
 		Full documentation
 			http://git.io/bBjMNw

lib/tasks/build-sass.js

@@ -59,7 +59,8 @@ module.exports = function buildSass(config) {
 
 						// This is an experimental LibSass feature. Use with caution.
 						// https://github.com/sass/node-sass#functions--v300---experimental
-						// We use this to silence the sass console output when running `obt test`
+						// We use this to silence the sass console output when running `obt test`.
+						// We also use this to hide warnings when building sass without the verbose flag.
 						functions: config.sassFunctions ? config.sassFunctions : {},
 					};
 

lib/tasks/build.js

@@ -36,18 +36,21 @@ module.exports = function (cfg) {
 	{
 		title: 'Compiling Sass',
 		task: (context, task) => {
-			let output = '';
-			config.sassFunctions = {
-				'@warn': function (warning) {
-					if (output) {
-						output += '\n' + warning.getValue().replace(/\n/g, ' ');
-					} else {
-						output = warning.getValue().replace(/\n/g, ' ');
+			// Only include sass warnings with the verbose flag.
+			if (!config.verbose) {
+				let output = '';
+				config.sassFunctions = {
+					'@warn': function (warning) {
+						if (output) {
+							output += '\n' + warning.getValue().replace(/\n/g, ' ');
+						} else {
+							output = warning.getValue().replace(/\n/g, ' ');
+						}
+						task.output = output;
+						return nodeSass.NULL;
 					}
-					task.output = output;
-					return nodeSass.NULL;
-				}
-			};
+				};
+			}
 			return buildSass(config);
 		},
 		skip: () => {

lib/tasks/demo-build.js

@@ -50,13 +50,17 @@ function buildSass(buildConfig) {
 					sourcemaps: true,
 					buildCss: path.basename(buildConfig.demo.sass).replace('.scss', '.css'),
 					buildFolder: dest,
-					sassFunctions: {
+					cwd: buildConfig.cwd
+				};
+
+				// Only output sass warnings with the verbose flag.
+				if (! buildConfig.verbose) {
+					sassConfig.sassFunctions = {
 						'@warn': function () {
 							return nodeSass.NULL;
 						}
-					},
-					cwd: buildConfig.cwd
-				};
+					};
+				}
 
 				return buildsass(sassConfig);
 			});
@@ -414,10 +418,10 @@ module.exports = function (cfg) {
 			const p = [];
 
 			for (const demo of demos) {
-				// log.secondary('Building demo ' + demo.name);
 
 				const buildConfig = {
 					demo: demo,
+					verbose: config.verbose,
 					cwd: cwd
 				};