mediawiki-extensions-Multim.../tests/qunit/mmv/ui/mmv.ui.metadataPanel.test.js
Gergő Tisza af508f066a Make the ellipsis of truncated texts more prominent
Also fixes popup texts which should have been updated in the parent commit
and the panel opening mechanism which did not work when the below-the-fold
description box was display:none-d.

Change-Id: I5fc37429a7dc7a8f1517fa42375cd140d7d11674
Mingle: https://wikimedia.mingle.thoughtworks.com/projects/multimedia/cards/589
2014-11-11 15:37:14 +00:00

206 lines
8.5 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

( function ( mw, $ ) {
var thingsShouldBeEmptied = [
'$license',
'$title',
'$username',
'$location',
'$datetime'
],
thingsShouldHaveEmptyClass = [
'$licenseLi',
'$credit',
'$usernameLi',
'$locationLi',
'$datetimeLi'
];
QUnit.module( 'mmv.ui.metadataPanel', QUnit.newMwEnvironment() );
QUnit.test( 'The panel is emptied properly when necessary', thingsShouldBeEmptied.length + thingsShouldHaveEmptyClass.length, function ( assert ) {
var i,
$qf = $( '#qunit-fixture' ),
panel = new mw.mmv.ui.MetadataPanel( $qf, $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) );
panel.empty();
for ( i = 0; i < thingsShouldBeEmptied.length; i++ ) {
assert.strictEqual( panel[thingsShouldBeEmptied[i]].text(), '', 'We successfully emptied the ' + thingsShouldBeEmptied[i] + ' element' );
}
for ( i = 0; i < thingsShouldHaveEmptyClass.length; i++ ) {
assert.strictEqual( panel[thingsShouldHaveEmptyClass[i]].hasClass( 'empty' ), true, 'We successfully applied the empty class to the ' + thingsShouldHaveEmptyClass[i] + ' element' );
}
} );
QUnit.test( 'Setting location information works as expected', 6, function ( assert ) {
var $qf = $( '#qunit-fixture' ),
panel = new mw.mmv.ui.MetadataPanel( $qf, $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) ),
fileName = 'Foobar.jpg',
latitude = 12.3456789,
longitude = 98.7654321,
imageData = {
latitude: latitude,
longitude: longitude,
hasCoords: function() { return true; },
title: mw.Title.newFromText( 'File:Foobar.jpg' )
};
panel.setLocationData( imageData );
assert.strictEqual(
panel.$location.text(),
'Location: 12° 20 44.44″ N, 98° 45 55.56″ E',
'Location text is set as expected - if this fails it may be due to i18n issues.'
);
assert.strictEqual(
panel.$location.prop( 'href' ),
'http://tools.wmflabs.org/geohack/geohack.php?pagename=File:' + fileName + '&params=' + latitude + '_N_' + longitude + '_E_&language=en',
'Location URL is set as expected'
);
latitude = -latitude;
longitude = -longitude;
imageData.latitude = latitude;
imageData.longitude = longitude;
panel.setLocationData( imageData );
assert.strictEqual(
panel.$location.text(),
'Location: 12° 20 44.44″ S, 98° 45 55.56″ W',
'Location text is set as expected - if this fails it may be due to i18n issues.'
);
assert.strictEqual(
panel.$location.prop( 'href' ),
'http://tools.wmflabs.org/geohack/geohack.php?pagename=File:' + fileName + '&params=' + ( - latitude) + '_S_' + ( - longitude ) + '_W_&language=en',
'Location URL is set as expected'
);
latitude = 0;
longitude = 0;
imageData.latitude = latitude;
imageData.longitude = longitude;
panel.setLocationData( imageData );
assert.strictEqual(
panel.$location.text(),
'Location: 0° 0 0″ N, 0° 0 0″ E',
'Location text is set as expected - if this fails it may be due to i18n issues.'
);
assert.strictEqual(
panel.$location.prop( 'href' ),
'http://tools.wmflabs.org/geohack/geohack.php?pagename=File:' + fileName + '&params=' + latitude + '_N_' + longitude + '_E_&language=en',
'Location URL is set as expected'
);
} );
QUnit.test( 'Setting image information works as expected', 18, function ( assert ) {
var gender,
$qf = $( '#qunit-fixture' ),
panel = new mw.mmv.ui.MetadataPanel( $qf, $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) ),
title = 'Foo bar',
image = {
filePageTitle : mw.Title.newFromText( 'File:' + title + '.jpg' )
},
imageData = {
title: image.filePageTitle,
url: 'https://upload.wikimedia.org/wikipedia/commons/3/3a/Foobar.jpg',
descriptionUrl: 'https://commons.wikimedia.org/wiki/File:Foobar.jpg',
hasCoords: function() { return false; }
},
repoData = {
getArticlePath : function() { return 'Foo'; },
isCommons: function() { return false; }
},
oldMoment = window.moment;
/*window.moment = function( date ) {
// This has no effect for now, since writing this test revealed that our moment.js
// doesn't have any language configuration
return oldMoment( date ).lang( 'fr' );
};*/
panel.setImageInfo( image, imageData, repoData, gender );
assert.strictEqual( panel.$title.text(), title, 'Title is correctly set' );
assert.ok( panel.$credit.text(), 'Default credit is shown' );
assert.strictEqual( panel.$license.prop( 'href' ), imageData.descriptionUrl,
'User is directed to file page for license information' );
assert.ok( !panel.$license.prop( 'target' ), 'License information opens in same window' );
assert.ok( panel.$usernameLi.hasClass( 'empty' ), 'Username is empty' );
assert.ok( panel.$datetimeLi.hasClass( 'empty' ), 'Date/Time is empty' );
assert.ok( panel.$locationLi.hasClass( 'empty' ), 'Location is empty' );
imageData.creationDateTime = '2013-08-26T14:41:02Z';
imageData.uploadDateTime = '2013-08-25T14:41:02Z';
imageData.source = '<b>Lost</b><a href="foo">Bar</a>';
imageData.author = 'Bob';
imageData.license = new mw.mmv.model.License( 'CC-BY-2.0', 'cc-by-2.0',
'Creative Commons Attribution - Share Alike 2.0',
'http://creativecommons.org/licenses/by-sa/2.0/' );
gender = 'female';
imageData.lastUploader = 'Ursula';
panel.setImageInfo( image, imageData, repoData, gender );
assert.strictEqual( panel.$title.text(), title, 'Title is correctly set' );
assert.ok( !panel.$credit.hasClass( 'empty' ), 'Credit is not empty' );
assert.ok( !panel.$datetimeLi.hasClass( 'empty' ), 'Date/Time is not empty' );
assert.strictEqual( panel.creditField.$element.find( '.mw-mmv-author' ).text(), imageData.author, 'Author text is correctly set' );
assert.strictEqual( panel.creditField.$element.find( '.mw-mmv-source' ).html(), 'Lost<a href="foo">Bar</a>', 'Source text is correctly set' );
assert.strictEqual( panel.creditField.$element.attr( 'original-title' ), 'Author and source information', 'Source tooltip is correctly set' );
assert.ok( panel.$datetime.text().indexOf( 'August 26, 2013' ) > 0, 'Correct date is displayed' );
assert.strictEqual( panel.$license.text(), 'CC BY 2.0', 'License is correctly set' );
assert.ok( panel.$license.prop( 'target' ), 'License information opens in new window' );
assert.ok( panel.$username.text().indexOf( imageData.lastUploader ) > 0, 'Correct username is displayed' );
imageData.creationDateTime = undefined;
panel.setImageInfo( image, imageData, repoData, gender );
assert.ok( panel.$datetime.text().indexOf( 'August 25, 2013' ) > 0, 'Correct date is displayed' );
window.moment = oldMoment;
} );
QUnit.test( 'Setting permission information works as expected', 1, function ( assert ) {
var $qf = $( '#qunit-fixture' ),
panel = new mw.mmv.ui.MetadataPanel( $qf, $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) );
panel.setLicense( null, 'http://example.com' ); // make sure license is visible as it contains the permission
panel.setPermission( 'Look at me, I am a permission!' );
assert.ok( panel.$permissionLink.is( ':visible' ) );
} );
QUnit.test( 'Date formatting', 1, function ( assert ) {
var $qf = $( '#qunit-fixture' ),
panel = new mw.mmv.ui.MetadataPanel( $qf, $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) ),
date1 = 'Garbage',
promise = panel.formatDate( date1 );
QUnit.stop();
promise.then( function ( result ) {
assert.strictEqual( result, date1, 'Invalid date is correctly ignored' );
QUnit.start();
} );
} );
QUnit.test( 'About links', 3, function ( assert ) {
var panel,
$qf = $( '#qunit-fixture'),
oldWgMediaViewerIsInBeta = mw.config.get( 'wgMediaViewerIsInBeta' );
this.sandbox.stub( mw.user, 'isAnon' );
mw.config.set( 'wgMediaViewerIsInBeta', false );
panel = new mw.mmv.ui.MetadataPanel( $qf.empty(), $( '<div>' ).appendTo( $qf ), window.localStorage, new mw.mmv.Config( {}, mw.config, mw.user, new mw.Api(), window.localStorage ) );
assert.strictEqual( $qf.find( '.mw-mmv-about-link' ).length, 1, 'About link is created.' );
assert.strictEqual( $qf.find( '.mw-mmv-discuss-link' ).length, 1, 'Discuss link is created.' );
assert.strictEqual( $qf.find( '.mw-mmv-help-link' ).length, 1, 'Help link is created.' );
mw.config.set( 'wgMediaViewerIsInBeta', oldWgMediaViewerIsInBeta );
} );
}( mediaWiki, jQuery ) );