CriticalDepsMirror/clay
1
0
Fork 0
mirror of https://github.com/pebble-dev/clay.git synced 2026-09-02 15:17:44 -04:00
Code Issues Packages Projects Releases Wiki Activity

add tests for components and refactor test fixtures to not register all components as a side-effect

Browse Source
This commit is contained in:
Keegan
2016-02-11 15:43:12 -08:00
parent 9412908636
commit ba74959919
10 changed files with 143 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test/spec/components/index.js
+44
View File
@@ -0,0 +1,44 @@
'use strict';
var assert = require('chai').assert;
var Joi = require('joi');
var _ = require('../../../src/scripts/vendor/minified')._;
var HTML = require('../../../src/scripts/vendor/minified').HTML;
var components = require('../../../src/scripts/components');
var manipulators = require('../../../src/scripts/lib/manipulators');
var fixture = require('../../fixture');
var componentSchema = Joi.object().keys({
name: Joi.string().required(),
template: Joi.string().required(),
style: Joi.string().optional(),
manipulator: Joi.alternatives().try(
Joi.string().valid(Object.keys(manipulators)),
Joi.object().keys({
get: Joi.func().arity(0).required(),
set: Joi.func().arity(1).required()
}).required().unknown(true)
),
defaults: Joi.object().optional(),
initialize: Joi.func().optional()
}).unknown(true);
describe('components', function() {
_.eachObj(components, function(name, component) {
describe(name, function() {
it('has the correct structure', function() {
Joi.assert(component, componentSchema);
});
it('has all the necessary defaults', function() {
assert.doesNotThrow(function() {
HTML(component.template.trim(), component.defaults);
});
});
it('is able to be passed to ClayConfig', function() {
fixture.clayConfig([component.name]);
});
});
});
});
test/spec/lib/clay-config.js
+31 -7
View File
@@ -1,6 +1,7 @@
'use strict';
var assert = require('chai').assert;
var sinon = require('sinon');
var _ = require('../../../src/scripts/vendor/minified')._;
var selectComponent = require('../../../src/scripts/components/select');
var componentRegistry = require('../../../src/scripts/lib/component-registry');
@@ -33,7 +34,7 @@ describe('ClayConfig', function() {
'getSettings'
].forEach(function(method) {
it('.' + method + '()', function() {
var clayConfig = fixtures.clayConfig(['input', 'text'], true);
var clayConfig = fixtures.clayConfig(['input', 'text'], false);
assert.throws(clayConfig[method], new RegExp(method));
});
});
@@ -93,7 +94,8 @@ describe('ClayConfig', function() {
]},
{type: 'toggle', appKey: 'test3'}
],
false,
true,
true,
{
test1: 'val-1' // set one of the values via settings
}
@@ -115,7 +117,7 @@ describe('ClayConfig', function() {
function(done) {
delete componentRegistry.select;
assert.typeOf(componentRegistry.select, 'undefined');
var clayConfig = fixtures.clayConfig(['select'], true);
var clayConfig = fixtures.clayConfig(['select'], false, false);
clayConfig.on(clayConfig.EVENTS.BEFORE_BUILD, function() {
clayConfig.registerComponent(selectComponent);
@@ -133,7 +135,8 @@ describe('ClayConfig', function() {
it('throws if manipulator is a string and does not match built-in manipulator',
function(done) {
var clayConfig = fixtures.clayConfig(['select'], true);
delete componentRegistry.select;
var clayConfig = fixtures.clayConfig(['select'], false, false);
var _textComponent = _.copyObj(selectComponent);
_textComponent.manipulator = 'not_real';
@@ -149,7 +152,8 @@ describe('ClayConfig', function() {
it('throws if manipulator does not have a `get` and `set` method',
function(done) {
var clayConfig = fixtures.clayConfig(['select'], true);
delete componentRegistry.select;
var clayConfig = fixtures.clayConfig(['select'], false, false);
var _selectComponent = _.copyObj(selectComponent);
_selectComponent.manipulator = {};
@@ -162,11 +166,31 @@ describe('ClayConfig', function() {
clayConfig.build();
});
it('only registers the component once', function() {
delete componentRegistry.select;
var warnStub = sinon.stub(console, 'warn');
var clayConfig = fixtures.clayConfig(['select'], false, false);
var _selectComponent1 = _.copyObj(selectComponent);
var _selectComponent2 = _.copyObj(selectComponent);
_selectComponent2.template = 'fake';
assert.strictEqual(clayConfig.registerComponent(_selectComponent1), true);
var styleCount = document.head.querySelectorAll('style').length;
assert.strictEqual(clayConfig.registerComponent(_selectComponent2), false);
// make sure the styles were not added twice
assert.strictEqual(document.head.querySelectorAll('style').length, styleCount);
// it should throw a warning
assert.strictEqual(warnStub.callCount, 1, 'console.warn not called once');
warnStub.restore();
});
});
describe('.build()', function() {
it('dispatches the BEFORE_BUILD event at the right time', function(done) {
var clayConfig = fixtures.clayConfig(['input', 'text', 'input'], true);
var clayConfig = fixtures.clayConfig(['input', 'text', 'input'], false);
clayConfig.on(clayConfig.EVENTS.BEFORE_BUILD, function() {
// this should throw because the config has not been built yet
@@ -177,7 +201,7 @@ describe('ClayConfig', function() {
});
it('dispatches the AFTER_BUILD event at the right time', function(done) {
var clayConfig = fixtures.clayConfig(['input', 'text', 'input'], true);
var clayConfig = fixtures.clayConfig(['input', 'text', 'input'], false);
clayConfig.on(clayConfig.EVENTS.AFTER_BUILD, function() {
// this should not throw because the config has been built
test/spec/lib/clay-item.js
+15 -16
View File
@@ -5,8 +5,7 @@ var sinon = require('sinon');
var checkReadOnly = require('../../test-utils').checkReadOnly;
var ClayItem = require('../../../src/scripts/lib/clay-item');
var minified = require('../../../src/scripts/vendor/minified');
var clayItemFixture = require('../../fixture').clayItem;
var configItemFixture = require('../../fixture').configItem;
var fixture = require('../../fixture');
var componentRegistry = require('../../../src/scripts/lib/component-registry');
describe('ClayItem', function() {
@@ -22,20 +21,20 @@ describe('ClayItem', function() {
'trigger',
'initialize'
];
var clayItem = clayItemFixture('input');
var clayItem = fixture.clayItem('input');
checkReadOnly(clayItem, properties);
});
it('attaches the manipulator methods', function() {
Object.keys(componentRegistry).forEach(function(itemName) {
var clayItem = clayItemFixture(itemName);
var clayItem = fixture.clayItem(itemName);
var manipulator = componentRegistry[itemName].manipulator;
checkReadOnly(clayItem, Object.keys(manipulator));
});
});
it('throws if a component is not in the registry', function() {
var config = configItemFixture('fake');
var config = fixture.configItem('fake', false);
/* eslint-disable no-new */
assert.throws(function() { new ClayItem(config); }, /fake/);
/* eslint-enable no-new */
@@ -43,33 +42,33 @@ describe('ClayItem', function() {
describe('.id', function() {
it('sets id if config has id', function() {
var config = configItemFixture('input');
var config = fixture.configItem('input');
var clayItem = new ClayItem(config);
assert.strictEqual(clayItem.id, config.id);
});
it('sets id to null if there is no id in the config', function() {
var clayItem = clayItemFixture({type: 'input', id: undefined});
var clayItem = fixture.clayItem({type: 'input', id: undefined});
assert.strictEqual(clayItem.id, null);
});
});
describe('.appKey', function() {
it('sets appKey correctly', function() {
var config = configItemFixture('input');
var config = fixture.configItem('input');
var clayItem = new ClayItem(config);
assert.strictEqual(clayItem.appKey, config.appKey);
});
it('sets appKey to null if there is no appKey in the config', function() {
var clayItem = clayItemFixture({type: 'input', appKey: undefined});
var clayItem = fixture.clayItem({type: 'input', appKey: undefined});
assert.strictEqual(clayItem.appKey, null);
});
});
describe('.config', function() {
it('sets appKey correctly', function() {
var config = configItemFixture('input');
var config = fixture.configItem('input');
var clayItem = new ClayItem(config);
assert.strictEqual(clayItem.appKey, config.appKey);
});
@@ -77,7 +76,7 @@ describe('ClayItem', function() {
describe('.$element', function() {
it('sets $element correctly', function() {
var clayItem = clayItemFixture('input');
var clayItem = fixture.clayItem('input');
assert.strictEqual(clayItem.$element[0].tagName, 'LABEL');
});
});
@@ -85,11 +84,11 @@ describe('ClayItem', function() {
describe('.$manipulatorTarget', function() {
it('sets the $manipulatorTarget to the root element if there are no children',
function() {
var clayItem = clayItemFixture('footer');
var clayItem = fixture.clayItem('footer');
assert.strictEqual(clayItem.$manipulatorTarget, clayItem.$element);
});
it('sets the $manipulatorTarget to the correct child element', function() {
var clayItem = clayItemFixture('input');
var clayItem = fixture.clayItem('input');
assert.strictEqual(clayItem.$manipulatorTarget[0].tagName, 'INPUT');
});
});
@@ -97,19 +96,19 @@ describe('ClayItem', function() {
describe('.initialize()', function() {
it('calls component initializer with the ClayItem as context', function() {
var initializeSpy = sinon.spy(componentRegistry.select, 'initialize');
var clayItem = clayItemFixture('select').initialize();
var clayItem = fixture.clayItem('select').initialize();
assert(initializeSpy.alwaysCalledOn(clayItem));
assert(initializeSpy.alwaysCalledWith(minified));
initializeSpy.restore();
});
it('returns itself for chaining', function() {
var clayItem = clayItemFixture('select');
var clayItem = fixture.clayItem('select');
assert.strictEqual(clayItem.initialize(), clayItem);
});
it('does nothing if there is no initialize function', function() {
assert.doesNotThrow(clayItemFixture('input').initialize);
assert.doesNotThrow(fixture.clayItem('input').initialize);
});
});