mirror of
https://gerrit.wikimedia.org/r/mediawiki/skins/MinervaNeue
synced 2024-11-18 03:31:34 +00:00
72df451bd3
Help with readability by using module.exports and require rather than the MobileFrontend provided mw.mobileFrontend module manager (and avoid adopting webpack at this time) Replace usages of mw.mobileFrontend.require with local require and module.exports (compatible with RL or Node implementation) Changes: * Notifications modules are merged into skins.minerva.scripts and initialised via a client side check. * new file overlayManager for exporting an overlayManager singleton rather than being hidden inside resources/skins.minerva.scripts/init.js * All M.define/M.requires swapped out for require where possible The `define` method is now forbidden in the repo. Bug: T212944 Change-Id: I44790dd3fc6fe42bb502d79c39c4081c223bf2b1
77 lines
2.9 KiB
JavaScript
77 lines
2.9 KiB
JavaScript
( function ( M ) {
|
||
var OverlayManager = M.require( 'mobile.startup' ).OverlayManager,
|
||
NotificationBadge = require( '../../../resources/skins.minerva.scripts/NotificationBadge.js' );
|
||
|
||
QUnit.module( 'Minerva NotificationBadge', {
|
||
beforeEach: function () {
|
||
this.OverlayManager = OverlayManager.getSingleton();
|
||
}
|
||
} );
|
||
|
||
QUnit.test( '#setCount', function ( assert ) {
|
||
var initialClassExpectationsMet,
|
||
badge = new NotificationBadge( {
|
||
overlayManager: this.OverlayManager,
|
||
hasNotifications: true,
|
||
hasUnseenNotifications: true,
|
||
notificationCountRaw: 5
|
||
} );
|
||
initialClassExpectationsMet = badge.$el.find( '.mw-ui-icon' ).length === 0 &&
|
||
badge.$el.find( '.zero' ).length === 0;
|
||
|
||
badge.setCount( 0 );
|
||
assert.ok( initialClassExpectationsMet, 'No icon and no zero class' );
|
||
assert.strictEqual( badge.$el.find( '.zero' ).length, 1, 'A zero class is present on the badge' );
|
||
badge.setCount( 105 );
|
||
assert.strictEqual( badge.options.notificationCountRaw, 100, 'Number is capped to 100.' );
|
||
} );
|
||
|
||
QUnit.test( '#setCount (Eastern Arabic numerals)', function ( assert ) {
|
||
var badge;
|
||
|
||
this.sandbox.stub( mw.language, 'convertNumber' )
|
||
.withArgs( 2 ).returns( '۲' )
|
||
.withArgs( 5 ).returns( '۵' );
|
||
this.sandbox.stub( mw, 'message' )
|
||
.withArgs( 'echo-badge-count', '۵' ).returns( { text: function () { return '۵'; } } )
|
||
.withArgs( 'echo-badge-count', '۲' ).returns( { text: function () { return '۲'; } } );
|
||
|
||
badge = new NotificationBadge( {
|
||
overlayManager: this.OverlayManager,
|
||
el: $( '<div><a title="n" href="/" class="notification-unseen"><div class="circle" ><span data-notification-count="2">۲</span></div></a></div>' )
|
||
} );
|
||
assert.strictEqual( badge.options.notificationCountRaw, 2,
|
||
'Number is parsed from Eastern Arabic numerals' );
|
||
assert.strictEqual( badge.options.notificationCountString, '۲',
|
||
'Number will be rendered in Eastern Arabic numerals' );
|
||
badge.setCount( 5 );
|
||
assert.strictEqual( badge.options.notificationCountString, '۵',
|
||
'Number will be rendered in Eastern Arabic numerals' );
|
||
} );
|
||
|
||
QUnit.test( '#render [hasUnseenNotifications]', function ( assert ) {
|
||
var badge = new NotificationBadge( {
|
||
notificationCountRaw: 0,
|
||
overlayManager: this.OverlayManager,
|
||
hasNotifications: false,
|
||
hasUnseenNotifications: false
|
||
} );
|
||
assert.strictEqual( badge.$el.find( '.mw-ui-icon' ).length, 1, 'A bell icon is visible' );
|
||
} );
|
||
|
||
QUnit.test( '#markAsSeen', function ( assert ) {
|
||
var badge = new NotificationBadge( {
|
||
notificationCountRaw: 2,
|
||
overlayManager: this.OverlayManager,
|
||
hasNotifications: true,
|
||
hasUnseenNotifications: true
|
||
} );
|
||
// Badge resets counter to zero
|
||
badge.setCount( 0 );
|
||
assert.strictEqual( badge.$el.find( '.mw-ui-icon' ).length, 0, 'The bell icon is not visible' );
|
||
badge.markAsSeen();
|
||
assert.strictEqual( badge.$el.find( '.notification-unseen' ).length, 0,
|
||
'Unseen class disappears after markAsSeen called.' );
|
||
} );
|
||
}( mw.mobileFrontend ) );
|