Merge ~twom/launchpad:sassy-css-fix-test-imports into launchpad:master

[Tom Wardill]

Fix test CSS imports

The JS tests import just the base CSS and test against it.
This was broken as the .css files no longer existed.

Create 'base.css' from the 'base.scss' and import it into the tests. Compile this separate (a fast operation) so that it's always present.

Also fix the 'combo.scss' imports so we're not importing base twice.

[Colin Watson (cjwatson)]

review: Approve

516ceef... by Tom Wardill on 2020-06-02

fix node version

diff --git a/.gitignore b/.gitignore
index b61b548..a2691e1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -28,6 +28,7 @@ xxx-report.*
 lib/canonical/launchpad/apidoc/wadl-development-*.xml
 lib/canonical/launchpad/apidoc/wadl-test-playground.xml
 lib/canonical/launchpad/icing/build/*
+lib/canonical/launchpad/icing/base.css
 lib/canonical/launchpad/icing/combo.css
 bin
 .installed.cfg
diff --git a/Makefile b/Makefile
index 74f285e..79025fa 100644
--- a/Makefile
+++ b/Makefile
@@ -182,7 +182,10 @@ css_combine: jsbuild_widget_css
 	${SHHH} bin/sprite-util create-image
 	${SHHH} bin/sprite-util create-css
 	ln -sfn ../../../../yarn/node_modules/yui $(ICING)/yui
-	SASS_BINARY_PATH=$(NODE_SASS_BINARY) $(YARN) run node-sass --output-style compressed --include-path $(WD)/$(ICING) --follow --output $(WD)/$(ICING) $(WD)/$(ICING)/combo.scss
+	# Compile the base.css file separately for tests
+	SASS_BINARY_PATH=$(NODE_SASS_BINARY) $(YARN) run node-sass --include-path $(WD)/$(ICING) --follow --output $(WD)/$(ICING)/ $(WD)/$(ICING)/css/base.scss
+	# Compile the combo.css for the main site
+	SASS_BINARY_PATH=$(NODE_SASS_BINARY) $(YARN) run node-sass --include-path $(WD)/$(ICING) --follow --output $(WD)/$(ICING) $(WD)/$(ICING)/combo.scss
 
 css_watch: jsbuild_widget_css
 	${SHHH} bin/sprite-util create-image
diff --git a/lib/canonical/launchpad/icing/combo.scss b/lib/canonical/launchpad/icing/combo.scss
index 8ad09e9..efb6a77 100644
--- a/lib/canonical/launchpad/icing/combo.scss
+++ b/lib/canonical/launchpad/icing/combo.scss
@@ -1,4 +1,4 @@
-@import 'css/base',
+@import
 'ubuntu-webfonts',
 'style',
 'yui/cssreset/cssreset',
@@ -16,8 +16,9 @@
 'build/inline-sprites-2',
 'build/block-sprites-1',
 // Include our main stylesheets at the end so they
-// take precedence over the others.
+// take precedence over the others (except components).
 'css/base',
 // This shouldn't require the _index, but doesn't appear to be allowable
-// in this version of node-sass (v4.14.4)
+// in this version of node-sass (v4.14.1).
+// Components are appended after base.
 'css/components/_index';
diff --git a/lib/canonical/launchpad/icing/import.css b/lib/canonical/launchpad/icing/import.css
index b48ddf5..43def39 100644
--- a/lib/canonical/launchpad/icing/import.css
+++ b/lib/canonical/launchpad/icing/import.css
@@ -1,9 +1,4 @@
-@import url("css/base.css");
-@import url("css/typography.css");
-@import url("css/colours.css");
-@import url("css/forms.css");
-@import url("css/layout.css");
-@import url("css/modifiers.css");
+@import url("base.css");
 
 /* We have a few files that need to include some base CSS.
    This file is purely for that