Merge remote-tracking branch 'rf/master' into static_component_mocks

* rf/master:
  ractive-foundation#238: Remove comment
  ractive-foundation#238: Add ux-tabarea test
  ractive-foundation#230 Fixed bug in watch stopping json files from being watched
  Removed the default hbs examples
  ractive-foundation#188 Fixed requiring steps twice
  Fixed default tests not working
  Changed all tests to use default steps file
  ractive-foundation#188 Added default readme to files missing any
  ractive-foundation#188 cleaning up wing template files

gulpfile.js

@@ -312,7 +312,7 @@ gulp.task('watch', function () {
 		'src/*.html',
 		'src/pages/*.html',
 		'src/blank-pages/*.html',
-		'src/**.*.json',
+		'src/**/*.json',
 		'src/**/*.hbs',
 		'src/**/*.md',
 		'src/**/*.js',

src/components/ux-accordion/README.md

@@ -6,4 +6,5 @@ Features:
 
 * (TODO) Distributed accordion groups
 * (TODO) Accessibility
-* (TODO) Callbacks (fire RactiveJS semantic event)
+* (TODO) Callbacks (fire RactiveJS semantic event)
+

src/components/ux-alert/README.md

@@ -1,3 +1,4 @@
 > Alerts are handy elements you can drop into a form or inline on a page to communicate success, warnings, failure or just information. They'll conform to 100% of the container width you put them in.
 
-Read [Foundation's alert](http://foundation.zurb.com/docs/components/alert_boxes.html) docs for more details.
+Read [Foundation's alert](http://foundation.zurb.com/docs/components/alert_boxes.html) docs for more details.
+

src/components/ux-alert/ux-alert.steps.js

@@ -2,9 +2,8 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
-
 	require('../../support/steps').call(this);
-	
+
 	this.Before(function (callback) {
 		this.component = {};
 		this.component.container	= '#childComponent';

src/components/ux-button/README.md

@@ -1,2 +1,4 @@
-
 > This renders a button
+
+Read [Foundation's button](http://foundation.zurb.com/docs/components/button.html) docs for more details.
+

src/components/ux-button/ux-button.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	// Semantic mappings onto css selectors etc.
 	var component = { container: '#childComponent' };
@@ -15,11 +16,6 @@ module.exports = function () {
 		}
 	};
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-		this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 	this.Then(/^the element "([^"]*)" should be displayed$/, function (semanticName, callback) {
 
 		var self = this;

src/components/ux-iconbar/README.md

@@ -1,3 +1,6 @@
 An Icon Bar provides a menu to quickly navigate an app.
 Use the Icon Bar horizontally or vertically,
-with the labels below the icons or to the right. Have it your way.
+with the labels below the icons or to the right. Have it your way.
+
+Read [Foundation's iconbar](http://foundation.zurb.com/docs/components/iconbar.html) docs for more details.
+

src/components/ux-label/README.md

@@ -1,3 +1,4 @@
 > Labels are useful inline styles that can be dropped into body copy to call out certain sections or to attach metadata. For example, you can attach a label that notes when something was updated.
 
-Read [Foundation's label](http://foundation.zurb.com/docs/components/labels.html) docs for more details.
+Read [Foundation's label](http://foundation.zurb.com/docs/components/labels.html) docs for more details.
+

src/components/ux-label/ux-label.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	this.Before(function (callback) {
 		this.component = {};
@@ -10,9 +11,4 @@ module.exports = function () {
 		callback();
 	});
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-			this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 };

src/components/ux-off-canvas/README.md

@@ -1,3 +1,4 @@
 > Off-canvas menus are positioned outside of the viewport and slide in when activated. Setting up an off-canvas layout in Foundation is super easy.
 
 Read [Foundation's offcanvas.html](http://foundation.zurb.com/docs/components/offcanvas.html) docs for more details.
+

src/components/ux-off-canvas/ux-off-canvas.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	this.Before(function (callback) {
 		this.component = {};
@@ -10,9 +11,4 @@ module.exports = function () {
 		callback();
 	});
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-			this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 };

src/components/ux-orbit/README.md

@@ -1 +1,4 @@
 > ux-orbit Documentation
+
+Read [Foundation's orbit](http://foundation.zurb.com/docs/components/orbit.html) docs for more details.
+

src/components/ux-orbit/ux-orbit.steps.js

@@ -13,9 +13,4 @@ module.exports = function () {
 		callback();
 	});
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-			this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 };

src/components/ux-progress/README.md

@@ -1 +1,4 @@
 > ux-progress Documentation
+
+Read [Foundation's progress](http://foundation.zurb.com/docs/components/progress.html) docs for more details.
+

src/components/ux-progress/ux-progress.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	this.Before(function (callback) {
 		this.component = {};
@@ -10,11 +11,6 @@ module.exports = function () {
 		callback();
 	});
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-			this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 	this.Then(/^the element "([^"]*)" should be displayed$/, function (semanticName, callback) {
 
 		var self = this;

src/components/ux-sidenav/ux-sidenav.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	require('../../support/steps').call(this);
 

src/components/ux-tabarea/ux-tabarea.feature

@@ -0,0 +1,15 @@
+Feature: ux-tabarea test suite
+
+	Scenario: Loading ux-tabarea
+		Given I have loaded component "ux-tabarea" with use case "simple-tabs"
+		Then there will be an element for "tabs"
+		And the element "firstTab" should have the text "Structure"
+		And the element "secondTab" should have the text "Buttons"
+		And the element "firstTab" will have the class "active"
+		And the element "firstTabContent" will have the class "active"
+		And the element "secondTabContent" will have the class "hide"
+		When I click "secondTabLink"
+		Then the element "firstTab" will NOT have the class "active"
+		And the element "secondTab" will have the class "active"
+		And the element "firstTabContent" will have the class "hide"
+		And the element "secondTabContent" will have the class "active"

src/components/ux-tabarea/ux-tabarea.steps.js

@@ -0,0 +1,30 @@
+module.exports = function () {
+
+	// Load standard world object to be 'this' in steps.
+	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
+
+	this.Before(function (callback) {
+		this.component = {};
+		this.component.container = '#childComponent ';
+		this.component.tabs = this.component.container + 'ul';
+		this.component.tabsContent = this.component.container + '.tabs-content';
+
+		this.component.firstTab = this.component.tabs + ' li:nth-child(1)';
+		this.component.firstTabContent = this.component.tabsContent + ' section:nth-child(1)';
+
+		this.component.secondTab = this.component.tabs + ' li:nth-child(2)';
+		this.component.secondTabLink = this.component.secondTab + ' a';
+		this.component.secondTabContent = this.component.tabsContent + ' section:nth-child(2)';
+
+		this.component.thirdTab = this.component.tabs + ' li:nth-child(3)';
+
+
+		callback();
+	});
+
+	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
+		function (componentName, useCase, callback) {
+			this.client.loadComponentWithUseCase(componentName, useCase, callback);
+	});
+};

src/components/ux-top-bar/ux-top-bar.steps.js

@@ -2,6 +2,7 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	this.Before(function (callback) {
 		this.component = {};
@@ -10,9 +11,4 @@ module.exports = function () {
 		callback();
 	});
 
-	this.Given(/^I have loaded component "([^"]*)" with use case "([^"]*)"$/,
-		function (componentName, useCase, callback) {
-			this.client.loadComponentWithUseCase(componentName, useCase, callback);
-	});
-
 };

tasks/gulpWingFiles/README.md

@@ -1 +1,4 @@
 > wingComponent Documentation
+
+Read [Foundation's wingComponent](http://foundation.zurb.com/docs/components/wingComponent.html) docs for more details.
+

tasks/gulpWingFiles/manifest.json

@@ -5,5 +5,6 @@
 	},
 	"events": {
 		"onclick": "Event to fire when component is clicked"
-	}
-}
+	},
+	"category": "uncategorised"
+}

tasks/gulpWingFiles/use-cases/dataDriven.json

@@ -2,6 +2,6 @@
 	"title": "Data driven use case",
 	"isDataModel": true,
 	"data": {
-		"text": "wingComponent button"
+		"todo": "TODO wingComponent contents here."
 	}
-}
+}

tasks/gulpWingFiles/wingComponent.feature

@@ -1,4 +1,5 @@
 Feature: wingComponent test suite
 
-  Scenario: Loading wingComponent
-    Given I have loaded component "wingComponent" with use case "UseCase"
+	Scenario: Loading wingComponent
+		Given I have loaded component "wingComponent" with use case "dataDriven"
+		Then the element "dummy" should have the text "TODO wingComponent contents here."

tasks/gulpWingFiles/wingComponent.hbs

@@ -1,3 +1,3 @@
 <div class="wingComponent">
-    TODO component contents here.
-</div>
+	<h2>{{todo}}</h2>
+</div>

tasks/gulpWingFiles/wingComponent.scss

@@ -1,3 +1,3 @@
 .wingComponent {
-	// TODO Component styling goes here.
-}
+	// TODO wingComponent styling goes here.
+}

tasks/gulpWingFiles/wingComponent.steps.js

@@ -2,14 +2,16 @@ module.exports = function () {
 
 	// Load standard world object to be 'this' in steps.
 	this.World = require('../../world').World;
+	require('../../support/steps').call(this);
 
 	// Load shared library of step definitions. Use these first!
 	require('../../support/steps').call(this);
 
 	this.Before(function (callback) {
 
 		this.component = {};
-		this.component.container = '#childComponent ';
+		this.component.container = '.wingComponent ';
+		this.component.dummy = this.component.container + 'h2';
 
 		callback();