Test runner now loads CSS and hides testArea

- serve CSS and font files properly to make sure that measurements are
  correct for the tests that need them (breadcrumb)
- added opacity to testArea to make sure nothing is visible during
  testing

2 files changed, 13 insertions, 7 deletions

diff --git a/core/js/tests/specHelper.js b/core/js/tests/specHelper.js
index 2af3497051c..3d208d9ef3f 100644
--- a/core/js/tests/specHelper.js
+++ b/core/js/tests/specHelper.js
@@ -85,7 +85,7 @@ window.Snap.prototype = {
 	beforeEach(function() {
 		// test area for elements that need absolute selector access or measure widths/heights
 		// which wouldn't work for detached or hidden elements
-		$testArea = $('<div id="testArea" style="position: absolute; width: 1280px; height: 800px; top: -3000px; left: -3000px;"></div>');
+		$testArea = $('<div id="testArea" style="position: absolute; width: 1280px; height: 800px; top: -3000px; left: -3000px; opacity: 0;"></div>');
 		$('body').append($testArea);
 		// enforce fake XHR, tests should not depend on the server and
 		// must use fake responses for expected calls
diff --git a/tests/karma.config.js b/tests/karma.config.js
index 290790686b0..14a0d7e8464 100644
--- a/tests/karma.config.js
+++ b/tests/karma.config.js
@@ -110,15 +110,16 @@ module.exports = function(config) {
 	// core mocks
 	files.push(corePath + 'tests/specHelper.js');
 
+	var srcFile, i;
 	// add core library files
-	for ( var i = 0; i < coreModule.libraries.length; i++ ) {
-		var srcFile = corePath + coreModule.libraries[i];
+	for ( i = 0; i < coreModule.libraries.length; i++ ) {
+		srcFile = corePath + coreModule.libraries[i];
 		files.push(srcFile);
 	}
 
 	// add core modules files
-	for ( var i = 0; i < coreModule.modules.length; i++ ) {
-		var srcFile = corePath + coreModule.modules[i];
+	for ( i = 0; i < coreModule.modules.length; i++ ) {
+		srcFile = corePath + coreModule.modules[i];
 		files.push(srcFile);
 		if (enableCoverage) {
 			preprocessors[srcFile] = 'coverage';
@@ -155,12 +156,15 @@ module.exports = function(config) {
 	}
 
 	// add source files for apps to test
-	for ( var i = 0; i < appsToTest.length; i++ ) {
+	for ( i = 0; i < appsToTest.length; i++ ) {
 		addApp(appsToTest[i]);
 	}
 
 	// serve images to avoid warnings
 	files.push({pattern: 'core/img/**/*', watched: false, included: false, served: true});
+	
+	// include core CSS
+	files.push({pattern: 'core/css/*.css', watched: true, included: true, served: true});
 
 	config.set({
 
@@ -180,7 +184,9 @@ module.exports = function(config) {
 
 		proxies: {
 			// prevent warnings for images
-			'/context.html//core/img/': 'http://localhost:9876/base/core/img/'
+			'/context.html//core/img/': 'http://localhost:9876/base/core/img/',
+			'/context.html//core/css/': 'http://localhost:9876/base/core/css/',
+			'/context.html//core/fonts/': 'http://localhost:9876/base/core/fonts/'
 		},
 
 		// test results reporter to use