1
0
mirror of https://github.com/videojs/video.js.git synced 2024-12-04 10:34:51 +02:00
video.js/test/unit/poster.test.js
heff 4d97dd4d29 Fixed a number of errors in the log after testing
- Fixed a console error in dom tests from loading a track source
- Switched to non-fetching poster urls in tests to prevent errors
- Stubbed XHR for TextTrack tests to prevent log errors
- Fixed text track console errors that stubbing async didn't catch
    because there's some async happening in tracks that makes it so
- XHR isn't even used until the test is complete
- Removed extra code
- Added player.dispose more places and fixed attributes test
2015-08-31 16:36:11 -07:00

94 lines
3.5 KiB
JavaScript

import PosterImage from '../../src/js/poster-image.js';
import * as browser from '../../src/js/utils/browser.js';
import TestHelpers from './test-helpers.js';
import document from 'global/document';
q.module('PosterImage', {
'setup': function(){
// Store the original background support so we can test different vals
this.origVal = browser.BACKGROUND_SIZE_SUPPORTED;
this.poster1 = '#poster1';
this.poster2 = '#poster2';
// Create a mock player object that responds as a player would
this.mockPlayer = {
poster_: this.poster1,
poster: function(){
return this.poster_;
},
handler_: null,
on: function(type, handler){
this.handler_ = handler;
},
trigger: function(type){
this.handler_.call();
}
};
},
'teardown': function(){
browser.BACKGROUND_SIZE_SUPPORTED = this.origVal;
}
});
test('should create and update a poster image', function(){
browser.BACKGROUND_SIZE_SUPPORTED = true;
let posterImage = new PosterImage(this.mockPlayer);
let backgroundImage = posterImage.el().style.backgroundImage;
notEqual(backgroundImage.indexOf(this.poster1), -1, 'Background image used');
// Update with a new poster source and check the new value
this.mockPlayer.poster_ = this.poster2;
this.mockPlayer.trigger('posterchange');
backgroundImage = posterImage.el().style.backgroundImage;
notEqual(backgroundImage.indexOf(this.poster2), -1, 'Background image updated');
});
test('should create and update a fallback image in older browsers', function(){
browser.BACKGROUND_SIZE_SUPPORTED = false;
let posterImage = new PosterImage(this.mockPlayer);
notEqual(posterImage.fallbackImg_.src.indexOf(this.poster1), -1, 'Fallback image created');
// Update with a new poster source and check the new value
this.mockPlayer.poster_ = this.poster2;
this.mockPlayer.trigger('posterchange');
notEqual(posterImage.fallbackImg_.src.indexOf(this.poster2), -1, 'Fallback image updated');
});
test('should remove itself from the document flow when there is no poster', function(){
let posterImage = new PosterImage(this.mockPlayer);
equal(posterImage.el().style.display, '', 'Poster image shows by default');
// Update with an empty string
this.mockPlayer.poster_ = '';
this.mockPlayer.trigger('posterchange');
equal(posterImage.hasClass('vjs-hidden'), true, 'Poster image hides with an empty source');
// Updated with a valid source
this.mockPlayer.poster_ = this.poster2;
this.mockPlayer.trigger('posterchange');
equal(posterImage.hasClass('vjs-hidden'), false, 'Poster image shows again when there is a source');
});
test('should hide the poster in the appropriate player states', function(){
var posterImage = new PosterImage(this.mockPlayer);
var playerDiv = document.createElement('div');
var fixture = document.getElementById('qunit-fixture');
var el = posterImage.el();
// Remove the source so when we add to the DOM it doesn't throw an error
// We want to poster to still think it has a real source so it doesn't hide itself
posterImage.setSrc('');
// Add the elements to the DOM so styles are computed
playerDiv.appendChild(el);
fixture.appendChild(playerDiv);
playerDiv.className = 'video-js vjs-has-started';
equal(TestHelpers.getComputedStyle(el, 'display'), 'none', 'The poster hides when the video has started (CSS may not be loaded)');
playerDiv.className = 'video-js vjs-has-started vjs-audio';
equal(TestHelpers.getComputedStyle(el, 'display'), 'block', 'The poster continues to show when playing audio');
});