summaryrefslogtreecommitdiff
path: root/www/wiki/extensions/MultimediaViewer/tests/qunit/mmv/ui/mmv.ui.progressBar.test.js
blob: 5b3bd3d07afc3eba86626988fcdbc5bca5178cac (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
/*
 * This file is part of the MediaWiki extension MediaViewer.
 *
 * MediaViewer is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 2 of the License, or
 * (at your option) any later version.
 *
 * MediaViewer is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with MediaViewer.  If not, see <http://www.gnu.org/licenses/>.
 */

( function ( mw, $ ) {
	QUnit.module( 'mmv.ui.ProgressBar', QUnit.newMwEnvironment() );

	QUnit.test( 'Constructor sanity check', function ( assert ) {
		var progressBar = new mw.mmv.ui.ProgressBar( $( '<div>' ) );
		assert.ok( progressBar, 'ProgressBar created sccessfully' );
		assert.ok( progressBar.$progress.hasClass( 'empty' ), 'ProgressBar starts empty' );
	} );

	QUnit.test( 'animateTo()', function ( assert ) {
		var $qf = $( '#qunit-fixture' ),
			$div = $( '<div>' ).css( { width: 250, position: 'relative' } ).appendTo( $qf ),
			progress = new mw.mmv.ui.ProgressBar( $div );

		assert.ok( progress.$progress.hasClass( 'empty' ), 'Progress bar is hidden' );
		assert.strictEqual( progress.$percent.width(), 0, 'Progress bar\'s indicator is at 0' );

		this.sandbox.stub( $.fn, 'animate', function ( target ) {
			$( this ).css( target );
			assert.strictEqual( target.width, '50%', 'Animation should go to 50%' );
		} );
		progress.animateTo( 50 );
		assert.ok( !progress.$progress.hasClass( 'empty' ), 'Progress bar is visible' );

		assert.strictEqual( progress.$percent.width(), 125, 'Progress bar\'s indicator is at half' );

		$.fn.animate.restore();
		this.sandbox.stub( $.fn, 'animate', function ( target, duration, transition, callback ) {
			$( this ).css( target );

			assert.strictEqual( target.width, '100%', 'Animation should go to 100%' );

			if ( callback !== undefined ) {
				callback();
			}
		} );
		progress.animateTo( 100 );
		assert.ok( progress.$progress.hasClass( 'empty' ), 'Progress bar is hidden' );
		assert.strictEqual( progress.$percent.width(), 0, 'Progress bar\'s indicator is at 0' );
	} );

	QUnit.test( 'jumpTo()/hide()', function ( assert ) {
		var $qf = $( '#qunit-fixture' ),
			$div = $( '<div>' ).css( { width: 250, position: 'relative' } ).appendTo( $qf ),
			progress = new mw.mmv.ui.ProgressBar( $div );

		assert.ok( progress.$progress.hasClass( 'empty' ), 'Progress bar is hidden' );
		assert.strictEqual( progress.$percent.width(), 0, 'Progress bar\'s indicator is at 0' );

		progress.jumpTo( 50 );

		assert.ok( !progress.$progress.hasClass( 'empty' ), 'Progress bar is visible' );
		assert.strictEqual( progress.$percent.width(), 125, 'Progress bar\'s indicator is at half' );

		progress.hide();

		assert.ok( progress.$progress.hasClass( 'empty' ), 'Progress bar is hidden' );
		assert.strictEqual( progress.$percent.width(), 0, 'Progress bar\'s indicator is at 0' );
	} );
}( mediaWiki, jQuery ) );