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

@pagarwal123 updated some test code to pass linter

Browse Source
This commit is contained in:
Priti Agarwal 2016-08-04 11:49:32 -04:00 committed by Gary Katsevman
parent 272d5eed83
commit 945711855a
10 changed files with 1102 additions and 1038 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
test/unit/button.test.js
View File

@ -1,27 +1,27 @@
/* eslint-env qunit */
import Button from '../../src/js/button.js';
import TestHelpers from './test-helpers.js';
q.module('Button');
QUnit.module('Button');
test('should localize its text', function(){
expect(3);
QUnit.test('should localize its text', function() {
QUnit.expect(3);
var player, testButton, el;
player = TestHelpers.makePlayer({
'language': 'es',
'languages': {
'es': {
'Play': 'Juego'
const player = TestHelpers.makePlayer({
language: 'es',
languages: {
es: {
Play: 'Juego'
}
}
});
testButton = new Button(player);
const testButton = new Button(player);
testButton.controlText_ = 'Play';
el = testButton.createEl();
const el = testButton.createEl();
ok(el.nodeName.toLowerCase().match('button'));
ok(el.innerHTML.match(/vjs-control-text"?>Juego/));
equal(el.getAttribute('title'), 'Juego');
QUnit.ok(el.nodeName.toLowerCase().match('button'));
QUnit.ok(el.innerHTML.match(/vjs-control-text"?>Juego/));
QUnit.equal(el.getAttribute('title'), 'Juego');
});

31
test/unit/clickable-component.test.js
View File

@ -1,39 +1,40 @@
/* eslint-env qunit */
import ClickableComponent from '../../src/js/clickable-component.js';
import TestHelpers from './test-helpers.js';
q.module('ClickableComponent');
QUnit.module('ClickableComponent');
q.test('should create a div with role="button"', function(){
expect(2);
QUnit.test('should create a div with role="button"', function() {
QUnit.expect(2);
let player = TestHelpers.makePlayer({});
const player = TestHelpers.makePlayer({});
let testClickableComponent = new ClickableComponent(player);
let el = testClickableComponent.createEl();
const testClickableComponent = new ClickableComponent(player);
const el = testClickableComponent.createEl();
equal(el.nodeName.toLowerCase(), 'div', 'the name of the element is "div"');
equal(el.getAttribute('role').toLowerCase(), 'button', 'the role of the element is "button"');
QUnit.equal(el.nodeName.toLowerCase(), 'div', 'the name of the element is "div"');
QUnit.equal(el.getAttribute('role').toLowerCase(), 'button', 'the role of the element is "button"');
testClickableComponent.dispose();
player.dispose();
});
q.test('should be enabled/disabled', function(){
expect(3);
QUnit.test('should be enabled/disabled', function() {
QUnit.expect(3);
let player = TestHelpers.makePlayer({});
const player = TestHelpers.makePlayer({});
let testClickableComponent = new ClickableComponent(player);
const testClickableComponent = new ClickableComponent(player);
equal(testClickableComponent.hasClass('vjs-disabled'), false, 'ClickableComponent defaults to enabled');
QUnit.equal(testClickableComponent.hasClass('vjs-disabled'), false, 'ClickableComponent defaults to enabled');
testClickableComponent.disable();
equal(testClickableComponent.hasClass('vjs-disabled'), true, 'ClickableComponent is disabled');
QUnit.equal(testClickableComponent.hasClass('vjs-disabled'), true, 'ClickableComponent is disabled');
testClickableComponent.enable();
equal(testClickableComponent.hasClass('vjs-disabled'), false, 'ClickableComponent is enabled');
QUnit.equal(testClickableComponent.hasClass('vjs-disabled'), false, 'ClickableComponent is enabled');
testClickableComponent.dispose();
player.dispose();

22
test/unit/close-button.test.js
View File

@ -1,21 +1,23 @@
/* eslint-env qunit */
import CloseButton from '../../src/js/close-button';
import sinon from 'sinon';
import TestHelpers from './test-helpers';
q.module('CloseButton', {
QUnit.module('CloseButton', {
beforeEach: function() {
beforeEach() {
this.player = TestHelpers.makePlayer();
this.btn = new CloseButton(this.player);
},
afterEach: function() {
afterEach() {
this.player.dispose();
this.btn.dispose();
}
});
q.test('should create the expected element', function(assert) {
let elAssertions = TestHelpers.assertEl(assert, this.btn.el(), {
QUnit.test('should create the expected element', function(assert) {
const elAssertions = TestHelpers.assertEl(assert, this.btn.el(), {
tagName: 'button',
classes: [
'vjs-button',
@ -29,16 +31,16 @@ q.test('should create the expected element', function(assert) {
assert.strictEqual(this.btn.el().querySelector('.vjs-control-text').innerHTML, 'Close');
});
q.test('should allow setting the controlText_ property as an option', function(assert) {
var text = 'OK!';
var btn = new CloseButton(this.player, {controlText: text});
QUnit.test('should allow setting the controlText_ property as an option', function(assert) {
const text = 'OK!';
const btn = new CloseButton(this.player, {controlText: text});
assert.expect(1);
assert.strictEqual(btn.controlText_, text, 'set the controlText_ property');
});
q.test('should trigger an event on activation', function(assert) {
var spy = sinon.spy();
QUnit.test('should trigger an event on activation', function(assert) {
const spy = sinon.spy();
this.btn.on('close', spy);
this.btn.trigger('click');

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

@ -1,8 +1,10 @@
/* eslint-env qunit */
import Component from '../../src/js/component.js';
import * as Dom from '../../src/js/utils/dom.js';
import * as Events from '../../src/js/utils/events.js';
import * as browser from '../../src/js/utils/browser.js';
import document from 'global/document';
import sinon from 'sinon';
import TestHelpers from './test-helpers.js';
class TestComponent1 extends Component {}
@ -20,70 +22,76 @@ Component.registerComponent('TestComponent2', TestComponent2);
Component.registerComponent('TestComponent3', TestComponent3);
Component.registerComponent('TestComponent4', TestComponent4);
q.module('Component', {
'setup': function() {
QUnit.module('Component', {
setup() {
this.clock = sinon.useFakeTimers();
},
'teardown': function() {
teardown() {
this.clock.restore();
}
});
var getFakePlayer = function(){
const getFakePlayer = function() {
return {
// Fake player requries an ID
id: function(){ return 'player_1'; },
reportUserActivity: function(){}
id() {
return 'player_1';
},
reportUserActivity() {}
};
};
test('should create an element', function(){
var comp = new Component(getFakePlayer(), {});
QUnit.test('should create an element', function() {
const comp = new Component(getFakePlayer(), {});
ok(comp.el().nodeName);
QUnit.ok(comp.el().nodeName);
});
test('should add a child component', function(){
var comp = new Component(getFakePlayer());
QUnit.test('should add a child component', function() {
const comp = new Component(getFakePlayer());
var child = comp.addChild('component');
const child = comp.addChild('component');
ok(comp.children().length === 1);
ok(comp.children()[0] === child);
ok(comp.el().childNodes[0] === child.el());
ok(comp.getChild('component') === child);
ok(comp.getChildById(child.id()) === child);
QUnit.ok(comp.children().length === 1);
QUnit.ok(comp.children()[0] === child);
QUnit.ok(comp.el().childNodes[0] === child.el());
QUnit.ok(comp.getChild('component') === child);
QUnit.ok(comp.getChildById(child.id()) === child);
});
test('should add a child component to an index', function(){
var comp = new Component(getFakePlayer());
QUnit.test('should add a child component to an index', function() {
const comp = new Component(getFakePlayer());
var child = comp.addChild('component');
const child = comp.addChild('component');
ok(comp.children().length === 1);
ok(comp.children()[0] === child);
QUnit.ok(comp.children().length === 1);
QUnit.ok(comp.children()[0] === child);
var child0 = comp.addChild('component', {}, 0);
ok(comp.children().length === 2);
ok(comp.children()[0] === child0);
ok(comp.children()[1] === child);
const child0 = comp.addChild('component', {}, 0);
var child1 = comp.addChild('component', {}, '2');
ok(comp.children().length === 3);
ok(comp.children()[2] === child1);
QUnit.ok(comp.children().length === 2);
QUnit.ok(comp.children()[0] === child0);
QUnit.ok(comp.children()[1] === child);
var child2 = comp.addChild('component', {}, undefined);
ok(comp.children().length === 4);
ok(comp.children()[3] === child2);
const child1 = comp.addChild('component', {}, '2');
var child3 = comp.addChild('component', {}, -1);
ok(comp.children().length === 5);
ok(comp.children()[3] === child3);
ok(comp.children()[4] === child2);
QUnit.ok(comp.children().length === 3);
QUnit.ok(comp.children()[2] === child1);
const child2 = comp.addChild('component', {}, undefined);
QUnit.ok(comp.children().length === 4);
QUnit.ok(comp.children()[3] === child2);
const child3 = comp.addChild('component', {}, -1);
QUnit.ok(comp.children().length === 5);
QUnit.ok(comp.children()[3] === child3);
QUnit.ok(comp.children()[4] === child2);
});
test('addChild should throw if the child does not exist', function() {
var comp = new Component(getFakePlayer());
QUnit.test('addChild should throw if the child does not exist', function() {
const comp = new Component(getFakePlayer());
throws(function() {
comp.addChild('non-existent-child');
@ -91,20 +99,19 @@ test('addChild should throw if the child does not exist', function() {
});
test('should init child components from options', function(){
var comp = new Component(getFakePlayer(), {
QUnit.test('should init child components from options', function() {
const comp = new Component(getFakePlayer(), {
children: {
'component': {}
component: {}
}
});
ok(comp.children().length === 1);
ok(comp.el().childNodes.length === 1);
QUnit.ok(comp.children().length === 1);
QUnit.ok(comp.el().childNodes.length === 1);
});
test('should init child components from simple children array', function(){
var comp = new Component(getFakePlayer(), {
QUnit.test('should init child components from simple children array', function() {
const comp = new Component(getFakePlayer(), {
children: [
'component',
'component',
@ -112,129 +119,134 @@ test('should init child components from simple children array', function(){
]
});
ok(comp.children().length === 3);
ok(comp.el().childNodes.length === 3);
QUnit.ok(comp.children().length === 3);
QUnit.ok(comp.el().childNodes.length === 3);
});
test('should init child components from children array of objects', function(){
var comp = new Component(getFakePlayer(), {
QUnit.test('should init child components from children array of objects', function() {
const comp = new Component(getFakePlayer(), {
children: [
{ 'name': 'component' },
{ 'name': 'component' },
{ 'name': 'component' }
{ name: 'component' },
{ name: 'component' },
{ name: 'component' }
]
});
ok(comp.children().length === 3);
ok(comp.el().childNodes.length === 3);
QUnit.ok(comp.children().length === 3);
QUnit.ok(comp.el().childNodes.length === 3);
});
test('should do a deep merge of child options', function(){
QUnit.test('should do a deep merge of child options', function() {
// Create a default option for component
Component.prototype.options_ = {
'example': {
'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
'childTwo': {},
'childThree': {}
example: {
childOne: { foo: 'bar', asdf: 'fdsa' },
childTwo: {},
childThree: {}
}
};
var comp = new Component(getFakePlayer(), {
'example': {
'childOne': { 'foo': 'baz', 'abc': '123' },
'childThree': false,
'childFour': {}
const comp = new Component(getFakePlayer(), {
example: {
childOne: { foo: 'baz', abc: '123' },
childThree: false,
childFour: {}
}
});
var mergedOptions = comp.options_;
var children = mergedOptions['example'];
const mergedOptions = comp.options_;
const children = mergedOptions.example;
strictEqual(children['childOne']['foo'], 'baz', 'value three levels deep overridden');
strictEqual(children['childOne']['asdf'], 'fdsa', 'value three levels deep maintained');
strictEqual(children['childOne']['abc'], '123', 'value three levels deep added');
ok(children['childTwo'], 'object two levels deep maintained');
strictEqual(children['childThree'], false, 'object two levels deep removed');
ok(children['childFour'], 'object two levels deep added');
QUnit.strictEqual(children.childOne.foo, 'baz', 'value three levels deep overridden');
QUnit.strictEqual(children.childOne.asdf, 'fdsa', 'value three levels deep maintained');
QUnit.strictEqual(children.childOne.abc, '123', 'value three levels deep added');
QUnit.ok(children.childTwo, 'object two levels deep maintained');
QUnit.strictEqual(children.childThree, false, 'object two levels deep removed');
QUnit.ok(children.childFour, 'object two levels deep added');
strictEqual(Component.prototype.options_['example']['childOne']['foo'], 'bar', 'prototype options were not overridden');
QUnit.strictEqual(Component.prototype.options_.example.childOne.foo, 'bar',
'prototype options were not overridden');
// Reset default component options to none
Component.prototype.options_ = null;
});
test('should init child components from component options', function(){
let testComp = new TestComponent1(TestHelpers.makePlayer(), {
QUnit.test('should init child components from component options', function() {
const testComp = new TestComponent1(TestHelpers.makePlayer(), {
testComponent2: false,
testComponent4: {}
});
ok(!testComp.childNameIndex_.testComponent2, 'we do not have testComponent2');
ok(testComp.childNameIndex_.testComponent4, 'we have a testComponent4');
QUnit.ok(!testComp.childNameIndex_.testComponent2, 'we do not have testComponent2');
QUnit.ok(testComp.childNameIndex_.testComponent4, 'we have a testComponent4');
});
test('should allows setting child options at the parent options level', function(){
var parent, options;
QUnit.test('should allows setting child options at the parent options level', function() {
let parent;
// using children array
options = {
'children': [
let options = {
children: [
'component',
'nullComponent'
],
// parent-level option for child
'component': {
'foo': true
component: {
foo: true
},
'nullComponent': false
nullComponent: false
};
try {
parent = new Component(getFakePlayer(), options);
} catch (err) {
ok(false, 'Child with `false` option was initialized');
QUnit.ok(false, 'Child with `false` option was initialized');
}
equal(parent.children()[0].options_['foo'], true, 'child options set when children array is used');
equal(parent.children().length, 1, 'we should only have one child');
QUnit.equal(parent.children()[0].options_.foo, true, 'child options set when children array is used');
QUnit.equal(parent.children().length, 1, 'we should only have one child');
// using children object
options = {
'children': {
'component': {
'foo': false
children: {
component: {
foo: false
},
'nullComponent': {}
nullComponent: {}
},
// parent-level option for child
'component': {
'foo': true
component: {
foo: true
},
'nullComponent': false
nullComponent: false
};
try {
parent = new Component(getFakePlayer(), options);
} catch (err) {
ok(false, 'Child with `false` option was initialized');
QUnit.ok(false, 'Child with `false` option was initialized');
}
equal(parent.children()[0].options_['foo'], true, 'child options set when children object is used');
equal(parent.children().length, 1, 'we should only have one child');
QUnit.equal(parent.children()[0].options_.foo, true, 'child options set when children object is used');
QUnit.equal(parent.children().length, 1, 'we should only have one child');
});
test('should dispose of component and children', function(){
var comp = new Component(getFakePlayer());
QUnit.test('should dispose of component and children', function() {
const comp = new Component(getFakePlayer());
// Add a child
var child = comp.addChild('Component');
ok(comp.children().length === 1);
const child = comp.addChild('Component');
QUnit.ok(comp.children().length === 1);
// Add a listener
comp.on('click', function(){ return true; });
var el = comp.el();
var data = Dom.getElData(el);
comp.on('click', function() {
return true;
});
const el = comp.el();
const data = Dom.getElData(el);
let hasDisposed = false;
let bubbles = null;
var hasDisposed = false;
var bubbles = null;
comp.on('dispose', function(event) {
hasDisposed = true;
bubbles = event.bubbles;
@ -242,27 +254,28 @@ test('should dispose of component and children', function(){
comp.dispose();
ok(hasDisposed, 'component fired dispose event');
ok(bubbles === false, 'dispose event does not bubble');
ok(!comp.children(), 'component children were deleted');
ok(!comp.el(), 'component element was deleted');
ok(!child.children(), 'child children were deleted');
ok(!child.el(), 'child element was deleted');
ok(!Dom.hasElData(el), 'listener data nulled');
ok(!Object.getOwnPropertyNames(data).length, 'original listener data object was emptied');
QUnit.ok(hasDisposed, 'component fired dispose event');
QUnit.ok(bubbles === false, 'dispose event does not bubble');
QUnit.ok(!comp.children(), 'component children were deleted');
QUnit.ok(!comp.el(), 'component element was deleted');
QUnit.ok(!child.children(), 'child children were deleted');
QUnit.ok(!child.el(), 'child element was deleted');
QUnit.ok(!Dom.hasElData(el), 'listener data nulled');
QUnit.ok(!Object.getOwnPropertyNames(data).length,
'original listener data object was emptied');
});
test('should add and remove event listeners to element', function(){
var comp = new Component(getFakePlayer(), {});
QUnit.test('should add and remove event listeners to element', function() {
const comp = new Component(getFakePlayer(), {});
// No need to make this async because we're triggering events inline.
// We're going to trigger the event after removing the listener,
// So if we get extra asserts that's a problem.
expect(2);
QUnit.expect(2);
var testListener = function(){
ok(true, 'fired event once');
ok(this === comp, 'listener has the component as context');
const testListener = function() {
QUnit.ok(true, 'fired event once');
QUnit.ok(this === comp, 'listener has the component as context');
};
comp.on('test-event', testListener);
@ -271,13 +284,13 @@ test('should add and remove event listeners to element', function(){
comp.trigger('test-event');
});
test('should trigger a listener once using one()', function(){
var comp = new Component(getFakePlayer(), {});
QUnit.test('should trigger a listener once using one()', function() {
const comp = new Component(getFakePlayer(), {});
expect(1);
QUnit.expect(1);
var testListener = function(){
ok(true, 'fired event once');
const testListener = function() {
QUnit.ok(true, 'fired event once');
};
comp.one('test-event', testListener);
@ -285,14 +298,15 @@ test('should trigger a listener once using one()', function(){
comp.trigger('test-event');
});
test('should be possible to pass data when you trigger an event', function () {
var comp = new Component(getFakePlayer(), {});
var data1 = 'Data1';
var data2 = {txt: 'Data2'};
expect(3);
QUnit.test('should be possible to pass data when you trigger an event', function() {
const comp = new Component(getFakePlayer(), {});
const data1 = 'Data1';
const data2 = {txt: 'Data2'};
var testListener = function(evt, hash){
ok(true, 'fired event once');
QUnit.expect(3);
const testListener = function(evt, hash) {
QUnit.ok(true, 'fired event once');
deepEqual(hash.d1, data1);
deepEqual(hash.d2, data2);
};
@ -302,138 +316,140 @@ test('should be possible to pass data when you trigger an event', function () {
comp.trigger('test-event');
});
test('should add listeners to other components and remove them', function(){
var player = getFakePlayer(),
comp1 = new Component(player),
comp2 = new Component(player),
listenerFired = 0,
testListener;
QUnit.test('should add listeners to other components and remove them', function() {
const player = getFakePlayer();
const comp1 = new Component(player);
const comp2 = new Component(player);
let listenerFired = 0;
testListener = function(){
equal(this, comp1, 'listener has the first component as context');
const testListener = function() {
QUnit.equal(this, comp1, 'listener has the first component as context');
listenerFired++;
};
comp1.on(comp2, 'test-event', testListener);
comp2.trigger('test-event');
equal(listenerFired, 1, 'listener was fired once');
QUnit.equal(listenerFired, 1, 'listener was fired once');
listenerFired = 0;
comp1.off(comp2, 'test-event', testListener);
comp2.trigger('test-event');
equal(listenerFired, 0, 'listener was not fired after being removed');
QUnit.equal(listenerFired, 0, 'listener was not fired after being removed');
// this component is disposed first
listenerFired = 0;
comp1.on(comp2, 'test-event', testListener);
comp1.dispose();
comp2.trigger('test-event');
equal(listenerFired, 0, 'listener was removed when this component was disposed first');
comp1.off = function(){ throw 'Comp1 off called'; };
QUnit.equal(listenerFired, 0, 'listener was removed when this component was disposed first');
comp1.off = function() {
throw new Error('Comp1 off called');
};
comp2.dispose();
ok(true, 'this component removed dispose listeners from other component');
QUnit.ok(true, 'this component removed dispose listeners from other component');
});
test('should add listeners to other components and remove when them other component is disposed', function(){
var player = getFakePlayer(),
comp1 = new Component(player),
comp2 = new Component(player),
listenerFired = 0,
testListener;
QUnit.test('should add listeners to other components and remove when them other component is disposed', function() {
const player = getFakePlayer();
const comp1 = new Component(player);
const comp2 = new Component(player);
let listenerFired = 0;
testListener = function(){
equal(this, comp1, 'listener has the first component as context');
const testListener = function() {
QUnit.equal(this, comp1, 'listener has the first component as context');
listenerFired++;
};
comp1.on(comp2, 'test-event', testListener);
comp2.dispose();
comp2.off = function(){ throw 'Comp2 off called'; };
comp2.off = function() {
throw new Error('Comp2 off called');
};
comp1.dispose();
ok(true, 'this component removed dispose listener from this component that referenced other component');
QUnit.ok(true, 'this component removed dispose listener from this component that referenced other component');
});
test('should add listeners to other components that are fired once', function(){
var player = getFakePlayer(),
comp1 = new Component(player),
comp2 = new Component(player),
listenerFired = 0,
testListener;
QUnit.test('should add listeners to other components that are fired once', function() {
const player = getFakePlayer();
const comp1 = new Component(player);
const comp2 = new Component(player);
let listenerFired = 0;
testListener = function(){
equal(this, comp1, 'listener has the first component as context');
const testListener = function() {
QUnit.equal(this, comp1, 'listener has the first component as context');
listenerFired++;
};
comp1.one(comp2, 'test-event', testListener);
comp2.trigger('test-event');
equal(listenerFired, 1, 'listener was executed once');
QUnit.equal(listenerFired, 1, 'listener was executed once');
comp2.trigger('test-event');
equal(listenerFired, 1, 'listener was executed only once');
QUnit.equal(listenerFired, 1, 'listener was executed only once');
});
test('should add listeners to other element and remove them', function(){
var player = getFakePlayer(),
comp1 = new Component(player),
el = document.createElement('div'),
listenerFired = 0,
testListener;
QUnit.test('should add listeners to other element and remove them', function() {
const player = getFakePlayer();
const comp1 = new Component(player);
const el = document.createElement('div');
let listenerFired = 0;
testListener = function(){
equal(this, comp1, 'listener has the first component as context');
const testListener = function() {
QUnit.equal(this, comp1, 'listener has the first component as context');
listenerFired++;
};
comp1.on(el, 'test-event', testListener);
Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was fired once');
QUnit.equal(listenerFired, 1, 'listener was fired once');
listenerFired = 0;
comp1.off(el, 'test-event', testListener);
Events.trigger(el, 'test-event');
equal(listenerFired, 0, 'listener was not fired after being removed from other element');
QUnit.equal(listenerFired, 0, 'listener was not fired after being removed from other element');
// this component is disposed first
listenerFired = 0;
comp1.on(el, 'test-event', testListener);
comp1.dispose();
Events.trigger(el, 'test-event');
equal(listenerFired, 0, 'listener was removed when this component was disposed first');
comp1.off = function(){ throw 'Comp1 off called'; };
QUnit.equal(listenerFired, 0, 'listener was removed when this component was disposed first');
comp1.off = function() {
throw new Error('Comp1 off called');
};
try {
Events.trigger(el, 'dispose');
} catch (e) {
ok(false, 'listener was not removed from other element');
QUnit.ok(false, 'listener was not removed from other element');
}
Events.trigger(el, 'dispose');
ok(true, 'this component removed dispose listeners from other element');
QUnit.ok(true, 'this component removed dispose listeners from other element');
});
test('should add listeners to other components that are fired once', function(){
var player = getFakePlayer(),
comp1 = new Component(player),
el = document.createElement('div'),
listenerFired = 0,
testListener;
QUnit.test('should add listeners to other components that are fired once', function() {
const player = getFakePlayer();
const comp1 = new Component(player);
const el = document.createElement('div');
let listenerFired = 0;
testListener = function(){
equal(this, comp1, 'listener has the first component as context');
const testListener = function() {
QUnit.equal(this, comp1, 'listener has the first component as context');
listenerFired++;
};
comp1.one(el, 'test-event', testListener);
Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was executed once');
QUnit.equal(listenerFired, 1, 'listener was executed once');
Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was executed only once');
QUnit.equal(listenerFired, 1, 'listener was executed only once');
});
test('should trigger a listener when ready', function(){
QUnit.test('should trigger a listener when ready', function() {
let initListenerFired;
let methodListenerFired;
let syncListenerFired;
let comp = new Component(getFakePlayer(), {}, function(){
const comp = new Component(getFakePlayer(), {}, function() {
initListenerFired = true;
});
@ -447,13 +463,13 @@ test('should trigger a listener when ready', function(){
syncListenerFired = true;
}, true);
ok(!initListenerFired, 'init listener should NOT fire synchronously');
ok(!methodListenerFired, 'method listener should NOT fire synchronously');
ok(syncListenerFired, 'sync listener SHOULD fire synchronously if after ready');
QUnit.ok(!initListenerFired, 'init listener should NOT fire synchronously');
QUnit.ok(!methodListenerFired, 'method listener should NOT fire synchronously');
QUnit.ok(syncListenerFired, 'sync listener SHOULD fire synchronously if after ready');
this.clock.tick(1);
ok(initListenerFired, 'init listener should fire asynchronously');
ok(methodListenerFired, 'method listener should fire asynchronously');
QUnit.ok(initListenerFired, 'init listener should fire asynchronously');
QUnit.ok(methodListenerFired, 'method listener should fire asynchronously');
// Listeners should only be fired once and then removed
initListenerFired = false;
@ -463,16 +479,17 @@ test('should trigger a listener when ready', function(){
comp.triggerReady();
this.clock.tick(1);
ok(!initListenerFired, 'init listener should be removed');
ok(!methodListenerFired, 'method listener should be removed');
ok(!syncListenerFired, 'sync listener should be removed');
QUnit.ok(!initListenerFired, 'init listener should be removed');
QUnit.ok(!methodListenerFired, 'method listener should be removed');
QUnit.ok(!syncListenerFired, 'sync listener should be removed');
});
test('should not retrigger a listener when the listener calls triggerReady', function(){
var timesCalled = 0;
var selfTriggered = false;
QUnit.test('should not retrigger a listener when the listener calls triggerReady', function() {
let timesCalled = 0;
let selfTriggered = false;
const comp = new Component(getFakePlayer(), {});
var readyListener = function(){
const readyListener = function() {
timesCalled++;
// Don't bother calling again if we have
@ -483,71 +500,70 @@ test('should not retrigger a listener when the listener calls triggerReady', fun
}
};
var comp = new Component(getFakePlayer(), {});
comp.ready(readyListener);
comp.triggerReady();
this.clock.tick(100);
equal(timesCalled, 1, 'triggerReady from inside a ready handler does not result in an infinite loop');
QUnit.equal(timesCalled, 1, 'triggerReady from inside a ready handler does not result in an infinite loop');
});
test('should add and remove a CSS class', function(){
var comp = new Component(getFakePlayer(), {});
QUnit.test('should add and remove a CSS class', function() {
const comp = new Component(getFakePlayer(), {});
comp.addClass('test-class');
ok(comp.el().className.indexOf('test-class') !== -1);
QUnit.ok(comp.el().className.indexOf('test-class') !== -1);
comp.removeClass('test-class');
ok(comp.el().className.indexOf('test-class') === -1);
QUnit.ok(comp.el().className.indexOf('test-class') === -1);
comp.toggleClass('test-class');
ok(comp.el().className.indexOf('test-class') !== -1);
QUnit.ok(comp.el().className.indexOf('test-class') !== -1);
comp.toggleClass('test-class');
ok(comp.el().className.indexOf('test-class') === -1);
QUnit.ok(comp.el().className.indexOf('test-class') === -1);
});
test('should show and hide an element', function(){
var comp = new Component(getFakePlayer(), {});
QUnit.test('should show and hide an element', function() {
const comp = new Component(getFakePlayer(), {});
comp.hide();
ok(comp.hasClass('vjs-hidden') === true);
QUnit.ok(comp.hasClass('vjs-hidden') === true);
comp.show();
ok(comp.hasClass('vjs-hidden') === false);
QUnit.ok(comp.hasClass('vjs-hidden') === false);
});
test('dimension() should treat NaN and null as zero', function() {
var comp, width, height, newWidth, newHeight;
width = 300;
height = 150;
QUnit.test('dimension() should treat NaN and null as zero', function() {
let newWidth;
comp = new Component(getFakePlayer(), {}),
const width = 300;
const height = 150;
const comp = new Component(getFakePlayer(), {});
// set component dimension
comp.dimensions(width, height);
newWidth = comp.dimension('width', null);
notEqual(newWidth, width, 'new width and old width are not the same');
equal(newWidth, comp, 'we set a value, so, return value is component');
equal(comp.width(), 0, 'the new width is zero');
QUnit.notEqual(newWidth, width, 'new width and old width are not the same');
QUnit.equal(newWidth, comp, 'we set a value, so, return value is component');
QUnit.equal(comp.width(), 0, 'the new width is zero');
newHeight = comp.dimension('height', NaN);
const newHeight = comp.dimension('height', NaN);
notEqual(newHeight, height, 'new height and old height are not the same');
equal(newHeight, comp, 'we set a value, so, return value is component');
equal(comp.height(), 0, 'the new height is zero');
QUnit.notEqual(newHeight, height, 'new height and old height are not the same');
QUnit.equal(newHeight, comp, 'we set a value, so, return value is component');
QUnit.equal(comp.height(), 0, 'the new height is zero');
comp.width(width);
newWidth = comp.dimension('width', undefined);
equal(newWidth, width, 'we did not set the width with undefined');
QUnit.equal(newWidth, width, 'we did not set the width with undefined');
});
test('should change the width and height of a component', function(){
var container = document.createElement('div');
var comp = new Component(getFakePlayer(), {});
var el = comp.el();
var fixture = document.getElementById('qunit-fixture');
QUnit.test('should change the width and height of a component', function() {
const container = document.createElement('div');
const comp = new Component(getFakePlayer(), {});
const el = comp.el();
const fixture = document.getElementById('qunit-fixture');
fixture.appendChild(container);
container.appendChild(el);
@ -558,21 +574,22 @@ test('should change the width and height of a component', function(){
comp.width('50%');
comp.height('123px');
ok(comp.width() === 500, 'percent values working');
var compStyle = TestHelpers.getComputedStyle(el, 'width');
ok(compStyle === comp.width() + 'px', 'matches computed style');
ok(comp.height() === 123, 'px values working');
QUnit.ok(comp.width() === 500, 'percent values working');
const compStyle = TestHelpers.getComputedStyle(el, 'width');
QUnit.ok(compStyle === comp.width() + 'px', 'matches computed style');
QUnit.ok(comp.height() === 123, 'px values working');
comp.width(321);
ok(comp.width() === 321, 'integer values working');
QUnit.ok(comp.width() === 321, 'integer values working');
comp.width('auto');
comp.height('auto');
ok(comp.width() === 1000, 'forced width was removed');
ok(comp.height() === 0, 'forced height was removed');
QUnit.ok(comp.width() === 1000, 'forced width was removed');
QUnit.ok(comp.height() === 0, 'forced height was removed');
});
test('should get the computed dimensions', function(){
QUnit.test('should get the computed dimensions', function() {
const container = document.createElement('div');
const comp = new Component(getFakePlayer(), {});
const el = comp.el();
@ -590,56 +607,57 @@ test('should get the computed dimensions', function(){
comp.width('50%');
comp.height('50%');
equal(comp.currentWidth() + 'px', computedWidth, 'matches computed width');
equal(comp.currentHeight() + 'px', computedHeight, 'matches computed height');
QUnit.equal(comp.currentWidth() + 'px', computedWidth, 'matches computed width');
QUnit.equal(comp.currentHeight() + 'px', computedHeight, 'matches computed height');
equal(comp.currentDimension('width') + 'px', computedWidth, 'matches computed width');
equal(comp.currentDimension('height') + 'px', computedHeight, 'matches computed height');
QUnit.equal(comp.currentDimension('width') + 'px', computedWidth, 'matches computed width');
QUnit.equal(comp.currentDimension('height') + 'px', computedHeight, 'matches computed height');
equal(comp.currentDimensions()['width'] + 'px', computedWidth, 'matches computed width');
equal(comp.currentDimensions()['height'] + 'px', computedHeight, 'matches computed width');
QUnit.equal(comp.currentDimensions().width + 'px', computedWidth, 'matches computed width');
QUnit.equal(comp.currentDimensions().height + 'px', computedHeight, 'matches computed width');
});
test('should use a defined content el for appending children', function(){
QUnit.test('should use a defined content el for appending children', function() {
class CompWithContent extends Component {}
CompWithContent.prototype.createEl = function() {
// Create the main componenent element
var el = Dom.createEl('div');
const el = Dom.createEl('div');
// Create the element where children will be appended
this.contentEl_ = Dom.createEl('div', { 'id': 'contentEl' });
this.contentEl_ = Dom.createEl('div', { id: 'contentEl' });
el.appendChild(this.contentEl_);
return el;
};
var comp = new CompWithContent(getFakePlayer());
var child = comp.addChild('component');
const comp = new CompWithContent(getFakePlayer());
const child = comp.addChild('component');
ok(comp.children().length === 1);
ok(comp.el().childNodes[0]['id'] === 'contentEl');
ok(comp.el().childNodes[0].childNodes[0] === child.el());
QUnit.ok(comp.children().length === 1);
QUnit.ok(comp.el().childNodes[0].id === 'contentEl');
QUnit.ok(comp.el().childNodes[0].childNodes[0] === child.el());
comp.removeChild(child);
ok(comp.children().length === 0, 'Length should now be zero');
ok(comp.el().childNodes[0]['id'] === 'contentEl', 'Content El should still exist');
ok(comp.el().childNodes[0].childNodes[0] !== child.el(), 'Child el should be removed.');
QUnit.ok(comp.children().length === 0, 'Length should now be zero');
QUnit.ok(comp.el().childNodes[0].id === 'contentEl', 'Content El should still exist');
QUnit.ok(comp.el().childNodes[0].childNodes[0] !== child.el(),
'Child el should be removed.');
});
test('should emit a tap event', function(){
expect(3);
QUnit.test('should emit a tap event', function() {
const comp = new Component(getFakePlayer());
let singleTouch = {};
const origTouch = browser.TOUCH_ENABLED;
QUnit.expect(3);
// Fake touch support. Real touch support isn't needed for this test.
var origTouch = browser.TOUCH_ENABLED;
browser.TOUCH_ENABLED = true;
var comp = new Component(getFakePlayer());
var singleTouch = {};
comp.emitTapEvents();
comp.on('tap', function() {
ok(true, 'Tap event emitted');
QUnit.ok(true, 'Tap event emitted');
});
// A touchstart followed by touchend should trigger a tap
@ -686,31 +704,30 @@ test('should emit a tap event', function(){
browser.TOUCH_ENABLED = origTouch;
});
test('should provide timeout methods that automatically get cleared on component disposal', function() {
expect(4);
var comp = new Component(getFakePlayer());
var timeoutsFired = 0;
comp.setTimeout(function() {
QUnit.test('should provide timeout methods that automatically get cleared on component disposal', function() {
const comp = new Component(getFakePlayer());
let timeoutsFired = 0;
const timeoutToClear = comp.setTimeout(function() {
timeoutsFired++;
equal(this, comp, 'Timeout fn has the component as its context');
ok(true, 'Timeout created and fired.');
}, 100);
var timeoutToClear = comp.setTimeout(function() {
timeoutsFired++;
ok(false, 'Timeout should have been manually cleared');
QUnit.ok(false, 'Timeout should have been manually cleared');
}, 500);
QUnit.expect(4);
comp.setTimeout(function() {
timeoutsFired++;
ok(false, 'Timeout should have been disposed');
QUnit.equal(this, comp, 'Timeout fn has the component as its context');
QUnit.ok(true, 'Timeout created and fired.');
}, 100);
comp.setTimeout(function() {
timeoutsFired++;
QUnit.ok(false, 'Timeout should have been disposed');
}, 1000);
this.clock.tick(100);
ok(timeoutsFired === 1, 'One timeout should have fired by this point');
QUnit.ok(timeoutsFired === 1, 'One timeout should have fired by this point');
comp.clearTimeout(timeoutToClear);
@ -720,47 +737,48 @@ test('should provide timeout methods that automatically get cleared on component
this.clock.tick(1000);
ok(timeoutsFired === 1, 'One timeout should have fired overall');
QUnit.ok(timeoutsFired === 1, 'One timeout should have fired overall');
});
test('should provide interval methods that automatically get cleared on component disposal', function() {
expect(13);
QUnit.test('should provide interval methods that automatically get cleared on component disposal', function() {
const comp = new Component(getFakePlayer());
var comp = new Component(getFakePlayer());
var intervalsFired = 0;
let intervalsFired = 0;
var interval = comp.setInterval(function() {
const interval = comp.setInterval(function() {
intervalsFired++;
equal(this, comp, 'Interval fn has the component as its context');
ok(true, 'Interval created and fired.');
QUnit.equal(this, comp, 'Interval fn has the component as its context');
QUnit.ok(true, 'Interval created and fired.');
}, 100);
QUnit.expect(13);
comp.setInterval(function() {
intervalsFired++;
ok(false, 'Interval should have been disposed');
QUnit.ok(false, 'Interval should have been disposed');
}, 1200);
this.clock.tick(500);
ok(intervalsFired === 5, 'Component interval fired 5 times');
QUnit.ok(intervalsFired === 5, 'Component interval fired 5 times');
comp.clearInterval(interval);
this.clock.tick(600);
ok(intervalsFired === 5, 'Interval was manually cleared');
QUnit.ok(intervalsFired === 5, 'Interval was manually cleared');
comp.dispose();
this.clock.tick(1200);
ok(intervalsFired === 5, 'Interval was cleared when component was disposed');
QUnit.ok(intervalsFired === 5, 'Interval was cleared when component was disposed');
});
test('$ and $$ functions', function() {
var comp = new Component(getFakePlayer());
var contentEl = document.createElement('div');
var children = [
QUnit.test('$ and $$ functions', function() {
const comp = new Component(getFakePlayer());
const contentEl = document.createElement('div');
const children = [
document.createElement('div'),
document.createElement('div')
];
@ -768,6 +786,6 @@ test('$ and $$ functions', function() {
comp.contentEl_ = contentEl;
children.forEach(child => contentEl.appendChild(child));
strictEqual(comp.$('div'), children[0], '$ defaults to contentEl as scope');
strictEqual(comp.$$('div').length, children.length, '$$ defaults to contentEl as scope');
QUnit.strictEqual(comp.$('div'), children[0], '$ defaults to contentEl as scope');
QUnit.strictEqual(comp.$$('div').length, children.length, '$$ defaults to contentEl as scope');
});

96
test/unit/controls.test.js
View File

@ -1,3 +1,4 @@
/* eslint-env qunit */
import VolumeControl from '../../src/js/control-bar/volume-control/volume-control.js';
import MuteToggle from '../../src/js/control-bar/mute-toggle.js';
import PlaybackRateMenuButton from '../../src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js';
@ -5,110 +6,107 @@ import Slider from '../../src/js/slider/slider.js';
import TestHelpers from './test-helpers.js';
import document from 'global/document';
q.module('Controls');
QUnit.module('Controls');
test('should hide volume control if it\'s not supported', function(){
expect(2);
var noop, player, volumeControl, muteToggle;
noop = function(){};
player = {
QUnit.test('should hide volume control if it\'s not supported', function() {
QUnit.expect(2);
const noop = function() {};
const player = {
id: noop,
on: noop,
ready: noop,
tech_: {
'featuresVolumeControl': false
featuresVolumeControl: false
},
volume: function(){},
muted: function(){},
reportUserActivity: function(){}
volume() {},
muted() {},
reportUserActivity() {}
};
volumeControl = new VolumeControl(player);
muteToggle = new MuteToggle(player);
const volumeControl = new VolumeControl(player);
const muteToggle = new MuteToggle(player);
ok(volumeControl.el().className.indexOf('vjs-hidden') >= 0, 'volumeControl is not hidden');
ok(muteToggle.el().className.indexOf('vjs-hidden') >= 0, 'muteToggle is not hidden');
QUnit.ok(volumeControl.el().className.indexOf('vjs-hidden') >= 0, 'volumeControl is not hidden');
QUnit.ok(muteToggle.el().className.indexOf('vjs-hidden') >= 0, 'muteToggle is not hidden');
});
test('should test and toggle volume control on `loadstart`', function(){
var noop, listeners, player, volumeControl, muteToggle, i;
noop = function(){};
listeners = [];
player = {
QUnit.test('should test and toggle volume control on `loadstart`', function() {
const noop = function() {};
const listeners = [];
const player = {
id: noop,
on: function(event, callback){
on(event, callback) {
// don't fire dispose listeners
if (event !== 'dispose') {
listeners.push(callback);
}
},
ready: noop,
volume: function(){
volume() {
return 1;
},
muted: function(){
muted() {
return false;
},
tech_: {
'featuresVolumeControl': true
featuresVolumeControl: true
},
reportUserActivity: function(){}
reportUserActivity() {}
};
volumeControl = new VolumeControl(player);
muteToggle = new MuteToggle(player);
const volumeControl = new VolumeControl(player);
const muteToggle = new MuteToggle(player);
equal(volumeControl.hasClass('vjs-hidden'), false, 'volumeControl is hidden initially');
equal(muteToggle.hasClass('vjs-hidden'), false, 'muteToggle is hidden initially');
QUnit.equal(volumeControl.hasClass('vjs-hidden'), false, 'volumeControl is hidden initially');
QUnit.equal(muteToggle.hasClass('vjs-hidden'), false, 'muteToggle is hidden initially');
player.tech_['featuresVolumeControl'] = false;
for (i = 0; i < listeners.length; i++) {
player.tech_.featuresVolumeControl = false;
for (let i = 0; i < listeners.length; i++) {
listeners[i]();
}
equal(volumeControl.hasClass('vjs-hidden'), true, 'volumeControl does not hide itself');
equal(muteToggle.hasClass('vjs-hidden'), true, 'muteToggle does not hide itself');
QUnit.equal(volumeControl.hasClass('vjs-hidden'), true, 'volumeControl does not hide itself');
QUnit.equal(muteToggle.hasClass('vjs-hidden'), true, 'muteToggle does not hide itself');
player.tech_['featuresVolumeControl'] = true;
for (i = 0; i < listeners.length; i++) {
player.tech_.featuresVolumeControl = true;
for (let i = 0; i < listeners.length; i++) {
listeners[i]();
}
equal(volumeControl.hasClass('vjs-hidden'), false, 'volumeControl does not show itself');
equal(muteToggle.hasClass('vjs-hidden'), false, 'muteToggle does not show itself');
QUnit.equal(volumeControl.hasClass('vjs-hidden'), false, 'volumeControl does not show itself');
QUnit.equal(muteToggle.hasClass('vjs-hidden'), false, 'muteToggle does not show itself');
});
test('calculateDistance should use changedTouches, if available', function() {
var noop, player, slider, event;
noop = function(){};
player = {
QUnit.test('calculateDistance should use changedTouches, if available', function() {
const noop = function() {};
const player = {
id: noop,
on: noop,
ready: noop,
reportUserActivity: noop
};
slider = new Slider(player);
const slider = new Slider(player);
document.body.appendChild(slider.el_);
slider.el_.style.position = 'absolute';
slider.el_.style.width = '200px';
slider.el_.style.left = '0px';
event = {
const event = {
pageX: 10,
changedTouches: [{
pageX: 100
}]
};
equal(slider.calculateDistance(event), 0.5, 'we should have touched exactly in the center, so, the ratio should be half');
QUnit.equal(slider.calculateDistance(event), 0.5, 'we should have touched exactly in the center, so, the ratio should be half');
});
test('should hide playback rate control if it\'s not supported', function(){
expect(1);
QUnit.test('should hide playback rate control if it\'s not supported', function() {
QUnit.expect(1);
var player = TestHelpers.makePlayer();
var playbackRate = new PlaybackRateMenuButton(player);
const player = TestHelpers.makePlayer();
const playbackRate = new PlaybackRateMenuButton(player);
ok(playbackRate.el().className.indexOf('vjs-hidden') >= 0, 'playbackRate is not hidden');
QUnit.ok(playbackRate.el().className.indexOf('vjs-hidden') >= 0, 'playbackRate is not hidden');
});

206
test/unit/events.test.js
View File

@ -1,28 +1,31 @@
/* eslint-env qunit */
import * as Events from '../../src/js/utils/events.js';
import document from 'global/document';
q.module('Events');
QUnit.module('Events');
test('should add and remove an event listener to an element', function(){
expect(1);
QUnit.test('should add and remove an event listener to an element', function() {
QUnit.expect(1);
var el = document.createElement('div');
var listener = function(){
ok(true, 'Click Triggered');
const el = document.createElement('div');
const listener = function() {
QUnit.ok(true, 'Click Triggered');
};
Events.on(el, 'click', listener);
Events.trigger(el, 'click'); // 1 click
// 1 click
Events.trigger(el, 'click');
Events.off(el, 'click', listener);
Events.trigger(el, 'click'); // No click should happen.
// No click should happen.
Events.trigger(el, 'click');
});
test('should add and remove multiple event listeners to an element with a single call', function(){
expect(6);
QUnit.test('should add and remove multiple event listeners to an element with a single call', function() {
QUnit.expect(6);
var el = document.createElement('div');
var listener = function(){
ok(true, 'Callback triggered');
const el = document.createElement('div');
const listener = function() {
QUnit.ok(true, 'Callback triggered');
};
Events.on(el, ['click', 'event1', 'event2'], listener);
@ -30,27 +33,30 @@ test('should add and remove multiple event listeners to an element with a single
Events.trigger(el, 'click');
Events.trigger(el, 'click');
Events.off(el, 'click', listener);
Events.trigger(el, 'click'); // No click should happen.
// No click should happen.
Events.trigger(el, 'click');
Events.trigger(el, 'event1');
Events.trigger(el, 'event1');
Events.off(el, 'event1', listener);
Events.trigger(el, 'event1'); // No event1 should happen.
// No event1 should happen.
Events.trigger(el, 'event1');
Events.trigger(el, 'event2');
Events.trigger(el, 'event2');
Events.off(el, 'event2', listener);
Events.trigger(el, 'event2'); // No event2 should happen.
// No event2 should happen.
Events.trigger(el, 'event2');
});
test('should be possible to pass data when you trigger an event', function () {
expect(6);
var el = document.createElement('div');
var fakeData1 = 'Fake Data 1';
var fakeData2 = {txt: 'Fake Data 2'};
QUnit.test('should be possible to pass data when you trigger an event', function() {
QUnit.expect(6);
const el = document.createElement('div');
const fakeData1 = 'Fake Data 1';
const fakeData2 = {txt: 'Fake Data 2'};
var listener = function(evt, hash){
ok(true, 'Callback triggered');
const listener = function(evt, hash) {
QUnit.ok(true, 'Callback triggered');
deepEqual(fakeData1, hash.d1, 'Shoulbe be passed to the handler');
deepEqual(fakeData2, hash.d2, 'Shoulbe be passed to the handler');
};
@ -61,61 +67,67 @@ test('should be possible to pass data when you trigger an event', function () {
});
test('should remove all listeners of a type', function(){
var el = document.createElement('div');
var clicks = 0;
var listener = function(){
QUnit.test('should remove all listeners of a type', function() {
const el = document.createElement('div');
let clicks = 0;
const listener = function() {
clicks++;
};
var listener2 = function(){
const listener2 = function() {
clicks++;
};
Events.on(el, 'click', listener);
Events.on(el, 'click', listener2);
Events.trigger(el, 'click'); // 2 clicks
// 2 clicks
Events.trigger(el, 'click');
ok(clicks === 2, 'both click listeners fired');
QUnit.ok(clicks === 2, 'both click listeners fired');
Events.off(el, 'click');
Events.trigger(el, 'click'); // No click should happen.
// No click should happen.
Events.trigger(el, 'click');
ok(clicks === 2, 'no click listeners fired');
QUnit.ok(clicks === 2, 'no click listeners fired');
});
test('should remove all listeners of an array of types', function(){
var el = document.createElement('div');
var calls = 0;
var listener = function(){
QUnit.test('should remove all listeners of an array of types', function() {
const el = document.createElement('div');
let calls = 0;
const listener = function() {
calls++;
};
var listener2 = function(){
const listener2 = function() {
calls++;
};
Events.on(el, ['click', 'event1'], listener);
Events.on(el, ['click', 'event1'], listener2);
Events.trigger(el, 'click'); // 2 calls
Events.trigger(el, 'event1'); // 2 calls
// 2 calls
Events.trigger(el, 'click');
// 2 calls
Events.trigger(el, 'event1');
ok(calls === 4, 'both click listeners fired');
QUnit.ok(calls === 4, 'both click listeners fired');
Events.off(el, ['click', 'event1']);
Events.trigger(el, 'click'); // No click should happen.
Events.trigger(el, 'event1'); // No event1 should happen.
// No click should happen.
Events.trigger(el, 'click');
// No event1 should happen.
Events.trigger(el, 'event1');
ok(calls === 4, 'no event listeners fired');
QUnit.ok(calls === 4, 'no event listeners fired');
});
test('should remove all listeners from an element', function(){
expect(2);
QUnit.test('should remove all listeners from an element', function() {
QUnit.expect(2);
var el = document.createElement('div');
var listener = function(){
ok(true, 'Fake1 Triggered');
const el = document.createElement('div');
const listener = function() {
QUnit.ok(true, 'Fake1 Triggered');
};
var listener2 = function(){
ok(true, 'Fake2 Triggered');
const listener2 = function() {
QUnit.ok(true, 'Fake2 Triggered');
};
Events.on(el, 'fake1', listener);
@ -131,110 +143,118 @@ test('should remove all listeners from an element', function(){
Events.trigger(el, 'fake2');
});
test('should listen only once', function(){
expect(1);
QUnit.test('should listen only once', function() {
QUnit.expect(1);
var el = document.createElement('div');
var listener = function(){
ok(true, 'Click Triggered');
const el = document.createElement('div');
const listener = function() {
QUnit.ok(true, 'Click Triggered');
};
Events.one(el, 'click', listener);
Events.trigger(el, 'click'); // 1 click
Events.trigger(el, 'click'); // No click should happen.
// 1 click
Events.trigger(el, 'click');
// No click should happen.
Events.trigger(el, 'click');
});
test( 'should listen only once in multiple events from a single call', function(){
expect(3);
QUnit.test('should listen only once in multiple events from a single call', function() {
QUnit.expect(3);
var el = document.createElement('div');
var listener = function(){
ok(true, 'Callback Triggered');
const el = document.createElement('div');
const listener = function() {
QUnit.ok(true, 'Callback Triggered');
};
Events.one(el, ['click', 'event1', 'event2'], listener);
Events.trigger(el, 'click'); // 1 click
Events.trigger(el, 'click'); // No click should happen.
Events.trigger(el, 'event1'); // event1 must be handled.
Events.trigger(el, 'event1'); // No event1 should be handled.
Events.trigger(el, 'event2'); // event2 must be handled.
Events.trigger(el, 'event2'); // No event2 should be handled.
// 1 click
Events.trigger(el, 'click');
// No click should happen.
Events.trigger(el, 'click');
// event1 must be handled.
Events.trigger(el, 'event1');
// No event1 should be handled.
Events.trigger(el, 'event1');
// event2 must be handled.
Events.trigger(el, 'event2');
// No event2 should be handled.
Events.trigger(el, 'event2');
});
test('should stop immediate propagtion', function(){
expect(1);
QUnit.test('should stop immediate propagtion', function() {
QUnit.expect(1);
var el = document.createElement('div');
const el = document.createElement('div');
Events.on(el, 'test', function(e) {
ok(true, 'First listener fired');
QUnit.ok(true, 'First listener fired');
e.stopImmediatePropagation();
});
Events.on(el, 'test', function(e) {
ok(false, 'Second listener fired');
QUnit.ok(false, 'Second listener fired');
});
Events.trigger(el, 'test');
});
test('should bubble up DOM unless bubbles == false', function(){
expect(3);
QUnit.test('should bubble up DOM unless bubbles == false', function() {
QUnit.expect(3);
var outer = document.createElement('div');
var inner = outer.appendChild(document.createElement('div'));
const outer = document.createElement('div');
const inner = outer.appendChild(document.createElement('div'));
// Verify that if bubbles === true, event bubbles up dom.
Events.on(inner, 'bubbles', function(e) {
ok(true, 'Inner listener fired');
QUnit.ok(true, 'Inner listener fired');
});
Events.on(outer, 'bubbles', function(e) {
ok(true, 'Outer listener fired');
QUnit.ok(true, 'Outer listener fired');
});
Events.trigger(inner, { type: 'bubbles', target: inner, bubbles: true });
// Only change 'bubbles' to false, and verify only inner handler is called.
Events.on(inner, 'nobub', function(e) {
ok(true, 'Inner listener fired');
QUnit.ok(true, 'Inner listener fired');
});
Events.on(outer, 'nobub', function(e) {
ok(false, 'Outer listener fired');
QUnit.ok(false, 'Outer listener fired');
});
Events.trigger(inner, { type: 'nobub', target: inner, bubbles: false });
});
test('should have a defaultPrevented property on an event that was prevent from doing default action', function() {
expect(2);
QUnit.test('should have a defaultPrevented property on an event that was prevent from doing default action', function() {
QUnit.expect(2);
var el = document.createElement('div');
const el = document.createElement('div');
Events.on(el, 'test', function(e) {
ok(true, 'First listener fired');
QUnit.ok(true, 'First listener fired');
e.preventDefault();
});
Events.on(el, 'test', function(e) {
ok(e.defaultPrevented, 'Should have `defaultPrevented` to signify preventDefault being called');
QUnit.ok(e.defaultPrevented, 'Should have `defaultPrevented` to signify preventDefault being called');
});
Events.trigger(el, 'test');
});
test('should have relatedTarget correctly set on the event', function() {
expect(2);
QUnit.test('should have relatedTarget correctly set on the event', function() {
QUnit.expect(2);
var el1 = document.createElement('div'),
el2 = document.createElement('div'),
relatedEl = document.createElement('div');
const el1 = document.createElement('div');
const el2 = document.createElement('div');
const relatedEl = document.createElement('div');
Events.on(el1, 'click', function(e) {
equal(e.relatedTarget, relatedEl, 'relatedTarget is set for all browsers when related element is set on the event');
QUnit.equal(e.relatedTarget, relatedEl, 'relatedTarget is set for all browsers when related element is set on the event');
});
Events.trigger(el1, { type: 'click', relatedTarget: relatedEl });
Events.on(el2, 'click', function(e) {
equal(e.relatedTarget, null, 'relatedTarget is null when none is provided');
QUnit.equal(e.relatedTarget, null, 'relatedTarget is null when none is provided');
});
Events.trigger(el2, { type: 'click', relatedTarget: undefined });

18
test/unit/extend.test.js
View File

@ -1,16 +1,18 @@
/* eslint-env qunit */
import extendFn from '../../src/js/extend.js';
q.module('extend.js');
QUnit.module('extend.js');
test('should add implicit parent constructor call', function(){
var superCalled = false;
var Parent = function() {
QUnit.test('should add implicit parent constructor call', function() {
let superCalled = false;
const Parent = function() {
superCalled = true;
};
var Child = extendFn(Parent, {
const Child = extendFn(Parent, {
foo: 'bar'
});
var child = new Child();
ok(superCalled, 'super constructor called');
ok(child.foo, 'child properties set');
const child = new Child();
QUnit.ok(superCalled, 'super constructor called');
QUnit.ok(child.foo, 'child properties set');
});

54
test/unit/menu.test.js
View File

@ -1,75 +1,75 @@
/* eslint-env qunit */
import MenuButton from '../../src/js/menu/menu-button.js';
import TestHelpers from './test-helpers.js';
import * as Events from '../../src/js/utils/events.js';
q.module('MenuButton');
QUnit.module('MenuButton');
q.test('should not throw an error when there is no children', function() {
expect(0);
let player = TestHelpers.makePlayer();
QUnit.test('should not throw an error when there is no children', function() {
QUnit.expect(0);
const player = TestHelpers.makePlayer();
let menuButton = new MenuButton(player);
let el = menuButton.el();
const menuButton = new MenuButton(player);
const el = menuButton.el();
try {
Events.trigger(el, 'click');
} catch (error) {
ok(!error, 'click should not throw anything');
QUnit.ok(!error, 'click should not throw anything');
}
player.dispose();
});
q.test('should place title list item into ul', function() {
var player, menuButton;
player = TestHelpers.makePlayer();
QUnit.test('should place title list item into ul', function() {
const player = TestHelpers.makePlayer();
menuButton = new MenuButton(player, {
'title': 'testTitle'
const menuButton = new MenuButton(player, {
title: 'testTitle'
});
let menuContentElement = menuButton.el().getElementsByTagName('UL')[0];
let titleElement = menuContentElement.children[0];
const menuContentElement = menuButton.el().getElementsByTagName('UL')[0];
const titleElement = menuContentElement.children[0];
ok(titleElement.innerHTML === 'TestTitle', 'title element placed in ul');
QUnit.ok(titleElement.innerHTML === 'TestTitle', 'title element placed in ul');
player.dispose();
});
q.test('clicking should display the menu', function() {
expect(6);
QUnit.test('clicking should display the menu', function() {
QUnit.expect(6);
let player = TestHelpers.makePlayer();
const player = TestHelpers.makePlayer();
// Make sure there's some content in the menu, even if it's just a title!
let menuButton = new MenuButton(player, {
'title': 'testTitle'
const menuButton = new MenuButton(player, {
title: 'testTitle'
});
let el = menuButton.el();
const el = menuButton.el();
ok(menuButton.menu !== undefined, 'menu is created');
QUnit.ok(menuButton.menu !== undefined, 'menu is created');
equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'menu defaults to hidden');
QUnit.equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'menu defaults to hidden');
Events.trigger(el, 'click');
equal(menuButton.menu.hasClass('vjs-lock-showing'), true, 'clicking on the menu button shows the menu');
QUnit.equal(menuButton.menu.hasClass('vjs-lock-showing'), true, 'clicking on the menu button shows the menu');
Events.trigger(el, 'click');
equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'clicking again on the menu button hides the menu');
QUnit.equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'clicking again on the menu button hides the menu');
menuButton.disable();
Events.trigger(el, 'click');
equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'disable() prevents clicking from showing the menu');
QUnit.equal(menuButton.menu.hasClass('vjs-lock-showing'), false, 'disable() prevents clicking from showing the menu');
menuButton.enable();
Events.trigger(el, 'click');
equal(menuButton.menu.hasClass('vjs-lock-showing'), true, 'enable() allows clicking to show the menu');
QUnit.equal(menuButton.menu.hasClass('vjs-lock-showing'), true, 'enable() allows clicking to show the menu');
player.dispose();
});

138
test/unit/modal-dialog.test.js
View File

@ -1,28 +1,29 @@
/* eslint-env qunit */
import CloseButton from '../../src/js/close-button';
import sinon from 'sinon';
import ModalDialog from '../../src/js/modal-dialog';
import * as Dom from '../../src/js/utils/dom';
import * as Fn from '../../src/js/utils/fn';
import TestHelpers from './test-helpers';
var ESC = 27;
const ESC = 27;
q.module('ModalDialog', {
QUnit.module('ModalDialog', {
beforeEach: function() {
beforeEach() {
this.player = TestHelpers.makePlayer();
this.modal = new ModalDialog(this.player, {temporary: false});
this.el = this.modal.el();
},
afterEach: function() {
afterEach() {
this.player.dispose();
this.modal.dispose();
this.el = null;
}
});
q.test('should create the expected element', function(assert) {
let elAssertions = TestHelpers.assertEl(assert, this.el, {
QUnit.test('should create the expected element', function(assert) {
const elAssertions = TestHelpers.assertEl(assert, this.el, {
tagName: 'div',
classes: [
'vjs-modal-dialog',
@ -43,8 +44,8 @@ q.test('should create the expected element', function(assert) {
elAssertions();
});
q.test('should create the expected description element', function(assert) {
let elAssertions = TestHelpers.assertEl(assert, this.modal.descEl_, {
QUnit.test('should create the expected description element', function(assert) {
const elAssertions = TestHelpers.assertEl(assert, this.modal.descEl_, {
tagName: 'p',
innerHTML: this.modal.description(),
classes: [
@ -60,8 +61,8 @@ q.test('should create the expected description element', function(assert) {
elAssertions();
});
q.test('should create the expected contentEl', function(assert) {
let elAssertions = TestHelpers.assertEl(assert, this.modal.contentEl(), {
QUnit.test('should create the expected contentEl', function(assert) {
const elAssertions = TestHelpers.assertEl(assert, this.modal.contentEl(), {
tagName: 'div',
classes: [
'vjs-modal-dialog-content'
@ -75,8 +76,8 @@ q.test('should create the expected contentEl', function(assert) {
elAssertions();
});
q.test('should create a close button by default', function(assert) {
var btn = this.modal.getChild('closeButton');
QUnit.test('should create a close button by default', function(assert) {
const btn = this.modal.getChild('closeButton');
// We only check the aspects of the button that relate to the modal. Other
// aspects of the button (classes, etc) are tested in their appropriate test
@ -86,8 +87,8 @@ q.test('should create a close button by default', function(assert) {
assert.strictEqual(btn.el().parentNode, this.el, 'close button is a child of el');
});
q.test('returns `this` for expected methods', function(assert) {
var methods = ['close', 'empty', 'fill', 'fillWith', 'open'];
QUnit.test('returns `this` for expected methods', function(assert) {
const methods = ['close', 'empty', 'fill', 'fillWith', 'open'];
assert.expect(methods.length);
methods.forEach(function(method) {
@ -95,13 +96,13 @@ q.test('returns `this` for expected methods', function(assert) {
}, this.modal);
});
q.test('open() triggers events', function(assert) {
var modal = this.modal;
var beforeModalOpenSpy = sinon.spy(function() {
QUnit.test('open() triggers events', function(assert) {
const modal = this.modal;
const beforeModalOpenSpy = sinon.spy(function() {
assert.notOk(modal.opened(), 'modal is not opened before opening event');
});
var modalOpenSpy = sinon.spy(function() {
const modalOpenSpy = sinon.spy(function() {
assert.ok(modal.opened(), 'modal is opened on opening event');
});
@ -116,15 +117,15 @@ q.test('open() triggers events', function(assert) {
assert.strictEqual(modalOpenSpy.callCount, 1, 'modalopen spy was called');
});
q.test('open() removes "vjs-hidden" class', function(assert) {
QUnit.test('open() removes "vjs-hidden" class', function(assert) {
assert.expect(2);
assert.ok(this.modal.hasClass('vjs-hidden'), 'modal starts hidden');
this.modal.open();
assert.notOk(this.modal.hasClass('vjs-hidden'), 'modal is not hidden after opening');
});
q.test('open() cannot be called on an opened modal', function(assert) {
var spy = sinon.spy();
QUnit.test('open() cannot be called on an opened modal', function(assert) {
const spy = sinon.spy();
this.modal.on('modalopen', spy).open().open();
@ -132,13 +133,13 @@ q.test('open() cannot be called on an opened modal', function(assert) {
assert.strictEqual(spy.callCount, 1, 'modal was only opened once');
});
q.test('close() triggers events', function(assert) {
var modal = this.modal;
var beforeModalCloseSpy = sinon.spy(function() {
QUnit.test('close() triggers events', function(assert) {
const modal = this.modal;
const beforeModalCloseSpy = sinon.spy(function() {
assert.ok(modal.opened(), 'modal is not closed before closing event');
});
var modalCloseSpy = sinon.spy(function() {
const modalCloseSpy = sinon.spy(function() {
assert.notOk(modal.opened(), 'modal is closed on closing event');
});
@ -154,14 +155,14 @@ q.test('close() triggers events', function(assert) {
assert.strictEqual(modalCloseSpy.callCount, 1, 'modalclose spy was called');
});
q.test('close() adds the "vjs-hidden" class', function(assert) {
QUnit.test('close() adds the "vjs-hidden" class', function(assert) {
assert.expect(1);
this.modal.open().close();
assert.ok(this.modal.hasClass('vjs-hidden'), 'modal is hidden upon close');
});
q.test('pressing ESC triggers close(), but only when the modal is opened', function(assert) {
var spy = sinon.spy();
QUnit.test('pressing ESC triggers close(), but only when the modal is opened', function(assert) {
const spy = sinon.spy();
this.modal.on('modalclose', spy).handleKeyPress({which: ESC});
assert.expect(2);
@ -171,8 +172,8 @@ q.test('pressing ESC triggers close(), but only when the modal is opened', funct
assert.strictEqual(spy.callCount, 1, 'ESC closed the now-opened modal');
});
q.test('close() cannot be called on a closed modal', function(assert) {
var spy = sinon.spy();
QUnit.test('close() cannot be called on a closed modal', function(assert) {
const spy = sinon.spy();
this.modal.on('modalclose', spy);
this.modal.open().close().close();
@ -181,9 +182,9 @@ q.test('close() cannot be called on a closed modal', function(assert) {
assert.strictEqual(spy.callCount, 1, 'modal was only closed once');
});
q.test('open() pauses playback, close() resumes', function(assert) {
var playSpy = sinon.spy();
var pauseSpy = sinon.spy();
QUnit.test('open() pauses playback, close() resumes', function(assert) {
const playSpy = sinon.spy();
const pauseSpy = sinon.spy();
// Quick and dirty; make it looks like the player is playing.
this.player.paused = function() {
@ -207,7 +208,7 @@ q.test('open() pauses playback, close() resumes', function(assert) {
assert.strictEqual(playSpy.callCount, 1, 'player is resumed when the modal closes');
});
q.test('open() hides controls, close() shows controls', function(assert) {
QUnit.test('open() hides controls, close() shows controls', function(assert) {
this.modal.open();
assert.expect(2);
@ -217,9 +218,9 @@ q.test('open() hides controls, close() shows controls', function(assert) {
assert.ok(this.player.controls_, 'controls are no longer hidden');
});
q.test('opened()', function(assert) {
var openSpy = sinon.spy();
var closeSpy = sinon.spy();
QUnit.test('opened()', function(assert) {
const openSpy = sinon.spy();
const closeSpy = sinon.spy();
assert.expect(4);
assert.strictEqual(this.modal.opened(), false, 'the modal is closed');
@ -238,23 +239,22 @@ q.test('opened()', function(assert) {
assert.strictEqual(closeSpy.callCount, 1, 'modal was closed only once');
});
q.test('content()', function(assert) {
var content;
QUnit.test('content()', function(assert) {
assert.expect(3);
assert.strictEqual(typeof this.modal.content(), 'undefined', 'no content by default');
content = this.modal.content(Dom.createEl());
const content = this.modal.content(Dom.createEl());
assert.ok(Dom.isEl(content), 'content was set from a single DOM element');
assert.strictEqual(this.modal.content(null), null, 'content was nullified');
});
q.test('fillWith()', function(assert) {
var contentEl = this.modal.contentEl();
var children = [Dom.createEl(), Dom.createEl(), Dom.createEl()];
var beforeFillSpy = sinon.spy();
var fillSpy = sinon.spy();
QUnit.test('fillWith()', function(assert) {
const contentEl = this.modal.contentEl();
const children = [Dom.createEl(), Dom.createEl(), Dom.createEl()];
const beforeFillSpy = sinon.spy();
const fillSpy = sinon.spy();
children.forEach(function(el) {
contentEl.appendChild(el);
@ -278,9 +278,9 @@ q.test('fillWith()', function(assert) {
assert.strictEqual(fillSpy.getCall(0).thisValue, this.modal, 'the value of "this" is the modal');
});
q.test('empty()', function(assert) {
var beforeEmptySpy = sinon.spy();
var emptySpy = sinon.spy();
QUnit.test('empty()', function(assert) {
const beforeEmptySpy = sinon.spy();
const emptySpy = sinon.spy();
this.modal.
fillWith([Dom.createEl(), Dom.createEl()]).
@ -296,8 +296,8 @@ q.test('empty()', function(assert) {
assert.strictEqual(emptySpy.getCall(0).thisValue, this.modal, 'the value of "this" is the modal');
});
q.test('closeable()', function(assert) {
let initialCloseButton = this.modal.getChild('closeButton');
QUnit.test('closeable()', function(assert) {
const initialCloseButton = this.modal.getChild('closeButton');
assert.expect(8);
assert.strictEqual(this.modal.closeable(), true, 'the modal is closed');
@ -322,13 +322,13 @@ q.test('closeable()', function(assert) {
assert.notOk(this.modal.opened(), 'the modal was closed by the ESC key');
});
q.test('"content" option (fills on first open() invocation)', function(assert) {
var modal = new ModalDialog(this.player, {
QUnit.test('"content" option (fills on first open() invocation)', function(assert) {
const modal = new ModalDialog(this.player, {
content: Dom.createEl(),
temporary: false
});
var spy = sinon.spy();
const spy = sinon.spy();
modal.on('modalfill', spy);
modal.open().close().open();
@ -339,11 +339,11 @@ q.test('"content" option (fills on first open() invocation)', function(assert) {
assert.strictEqual(modal.contentEl().firstChild, modal.options_.content, 'has the expected content in the DOM');
});
q.test('"temporary" option', function(assert) {
var temp = new ModalDialog(this.player, {temporary: true});
var tempSpy = sinon.spy();
var perm = new ModalDialog(this.player, {temporary: false});
var permSpy = sinon.spy();
QUnit.test('"temporary" option', function(assert) {
const temp = new ModalDialog(this.player, {temporary: true});
const tempSpy = sinon.spy();
const perm = new ModalDialog(this.player, {temporary: false});
const permSpy = sinon.spy();
temp.on('dispose', tempSpy);
perm.on('dispose', permSpy);
@ -355,14 +355,14 @@ q.test('"temporary" option', function(assert) {
assert.strictEqual(permSpy.callCount, 0, 'permanent modals are not disposed');
});
q.test('"fillAlways" option', function(assert) {
var modal = new ModalDialog(this.player, {
QUnit.test('"fillAlways" option', function(assert) {
const modal = new ModalDialog(this.player, {
content: 'foo',
fillAlways: true,
temporary: false
});
var spy = sinon.spy();
const spy = sinon.spy();
modal.on('modalfill', spy);
modal.open().close().open();
@ -371,21 +371,21 @@ q.test('"fillAlways" option', function(assert) {
assert.strictEqual(spy.callCount, 2, 'the modal was filled on each open call');
});
q.test('"label" option', function(assert) {
var label = 'foo';
var modal = new ModalDialog(this.player, {label: label});
QUnit.test('"label" option', function(assert) {
const label = 'foo';
const modal = new ModalDialog(this.player, {label});
assert.expect(1);
assert.strictEqual(modal.el().getAttribute('aria-label'), label, 'uses the label as the aria-label');
});
q.test('"uncloseable" option', function(assert) {
var modal = new ModalDialog(this.player, {
QUnit.test('"uncloseable" option', function(assert) {
const modal = new ModalDialog(this.player, {
temporary: false,
uncloseable: true
});
var spy = sinon.spy();
const spy = sinon.spy();
modal.on('modalclose', spy);

775
test/unit/player.test.js
View File

File diff suppressed because it is too large Load Diff