web/video.js
1
0
Fork 0
mirror of https://github.com/videojs/video.js.git synced 2025-02-02 11:34:50 +02:00
Code Releases Activity

feat: Stateful Components (#3960)

Browse Source 
Advanced plugins introduced the concept of mixins and added two: evented and stateful.
This provides Components with the benefits of the stateful mixin
This commit is contained in:
Pat O'Neill 2017-01-26 22:04:34 -05:00 committed by Gary Katsevman
parent 4c3b60c3b6
commit d7d7cfeb9f
3 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/js/component.js
View File

@ -5,6 +5,7 @@
*/
import window from 'global/window';
import evented from './mixins/evented';
import stateful from './mixins/stateful';
import * as Dom from './utils/dom.js';
import * as DomData from './utils/dom-data';
import * as Fn from './utils/fn.js';
@ -85,6 +86,7 @@ class Component {
// Make this an evented object and use `el_`, if available, as its event bus
evented(this, {eventBusKey: this.el_ ? 'el_' : null});
stateful(this, this.constructor.defaultState);
this.children_ = [];
this.childIndex_ = {};

11
test/unit/component.test.js
View File

@ -4,6 +4,7 @@ import Component from '../../src/js/component.js';
import * as Dom from '../../src/js/utils/dom.js';
import * as DomData from '../../src/js/utils/dom-data';
import * as Events from '../../src/js/utils/events.js';
import * as Obj from '../../src/js/utils/obj';
import * as browser from '../../src/js/utils/browser.js';
import document from 'global/document';
import sinon from 'sinon';
@ -906,3 +907,13 @@ QUnit.test('$ and $$ functions', function(assert) {
assert.strictEqual(comp.$('div'), children[0], '$ defaults to contentEl as scope');
assert.strictEqual(comp.$$('div').length, children.length, '$$ defaults to contentEl as scope');
});
QUnit.test('should use the stateful mixin', function(assert) {
const comp = new Component(getFakePlayer(), {});
assert.ok(Obj.isPlain(comp.state), '`state` is a plain object');
assert.strictEqual(Object.prototype.toString.call(comp.setState), '[object Function]', '`setState` is a function');
comp.setState({foo: 'bar'});
assert.strictEqual(comp.state.foo, 'bar', 'the component passes a basic stateful test');
});

4
test/unit/mixins/stateful.test.js
View File

@ -9,13 +9,13 @@ QUnit.module('mixins: stateful');
QUnit.test('stateful() mutates an object as expected', function(assert) {
const target = {};
assert.strictEqual(typeof stateful, 'function', 'the mixin is a function');
assert.strictEqual(Object.prototype.toString.call(stateful), '[object Function]', 'the mixin is a function');
assert.strictEqual(stateful(target), target, 'returns the target object');
assert.ok(Obj.isObject(target), 'the target is still an object');
assert.ok(Obj.isPlain(target.state), 'the target has a state');
assert.strictEqual(Object.keys(target.state).length, 0, 'the target state is empty by default');
assert.strictEqual(typeof target.setState, 'function', 'the target has a setState method');
assert.strictEqual(Object.prototype.toString.call(target.setState), '[object Function]', 'the target has a setState method');
});
QUnit.test('stateful() with default state passed in', function(assert) {