( function ( mw, $ ) { QUnit.module( 'multilightbox.interface', QUnit.newMwEnvironment() ); QUnit.test( 'Sanity test, object creation and ui construction', 9, function ( assert ) { var lightbox = new window.LightboxInterface(); function checkIfUIAreasAttachedToDocument( inDocument ) { var msg = inDocument === 1 ? ' ' : ' not '; assert.strictEqual( $( '.mlb-wrapper' ).length, inDocument, 'Wrapper area' + msg + 'attached.' ); assert.strictEqual( $( '.mlb-main' ).length, inDocument, 'Main area' + msg + 'attached.' ); assert.strictEqual( $( '.mlb-overlay' ).length, inDocument, 'Overlay area' + msg + 'attached.' ); } // UI areas not attached to the document yet. checkIfUIAreasAttachedToDocument(0); // Attach lightbox to testing fixture to avoid interference with other tests. lightbox.attach( '#qunit-fixture' ); // UI areas should now be attached to the document. checkIfUIAreasAttachedToDocument(1); // Unattach lightbox from document lightbox.unattach(); checkIfUIAreasAttachedToDocument(0); } ); QUnit.asyncTest( 'Check we are saving the resize listener', 2, function ( assert ) { var img = new window.LightboxImage('http://en.wikipedia.org/w/skins/vector/images/search-ltr.png'), lightbox = new window.LightboxInterface(); // resizeListener not saved yet assert.strictEqual( this.resizeListener, undefined, 'Listener is not saved yet' ); // Save original loadCallback lightbox.originalLoadCallback = lightbox.loadCallback; // Mock loadCallback lightbox.loadCallback = function ( image, ele ) { // Call original loadCallback this.originalLoadCallback( image, ele ); // resizeListener should have been saved assert.notStrictEqual( this.resizeListener, undefined, 'Saved listener !' ); QUnit.start(); }; lightbox.load(img); } ); QUnit.test( 'Fullscreen mode', 8, function ( assert ) { var lightbox = new window.LightboxInterface(), oldFnEnterFullscreen = $.fn.enterFullscreen, oldFnExitFullscreen = $.fn.exitFullscreen, oldSupportFullscreen = $.support.fullscreen; // Since we don't want these tests to really open fullscreen // which is subject to user security confirmation, // we use a mock that pretends regular jquery.fullscreen behavior happened $.fn.enterFullscreen = mw.mmvTestHelpers.enterFullscreenMock; $.fn.exitFullscreen = mw.mmvTestHelpers.exitFullscreenMock; // Attach lightbox to testing fixture to avoid interference with other tests. lightbox.attach( '#qunit-fixture' ); $.support.fullscreen = false; lightbox.setupFullscreenButton(); assert.ok( !lightbox.$fullscreenButton.is(':visible'), 'Fullscreen button is hidden when fullscreen mode is unavailable' ); $.support.fullscreen = true; lightbox.setupFullscreenButton(); assert.ok( lightbox.$fullscreenButton.is(':visible'), 'Fullscreen button is visible when fullscreen mode is available' ); // Entering fullscreen lightbox.$fullscreenButton.click(); assert.strictEqual( lightbox.$main.hasClass( 'jq-fullscreened' ) , true, 'Fullscreened area has the fullscreen class'); assert.strictEqual( lightbox.isFullscreen , true, 'Lightbox knows it\'s in fullscreen mode'); // Exiting fullscreen lightbox.$fullscreenButton.click(); assert.strictEqual( lightbox.$main.hasClass( 'jq-fullscreened' ) , false, 'Fullscreened area doesn\'t have the fullscreen class anymore'); assert.strictEqual( lightbox.isFullscreen , false, 'Lightbox knows it\'s not in fullscreen mode'); // Entering fullscreen lightbox.$fullscreenButton.click(); // Hard-exiting fullscreen lightbox.$closeButton.click(); // Re-attach after hard-exit lightbox.attach( '#qunit-fixture' ); assert.strictEqual( lightbox.$main.hasClass( 'jq-fullscreened' ) , false, 'Fullscreened area doesn\'t have the fullscreen class anymore'); assert.strictEqual( lightbox.isFullscreen , false, 'Lightbox knows it\'s not in fullscreen mode'); // Unattach lightbox from document lightbox.unattach(); $.fn.enterFullscreen = oldFnEnterFullscreen; $.fn.exitFullscreen = oldFnExitFullscreen; $.support.fullscreen = oldSupportFullscreen; } ); }( mediaWiki, jQuery ) );