wikimedia/mediawiki-extensions-Echo
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo synced 2024-11-28 01:30:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix issue with tab visibility

Browse source 
Danny noticed a bug where if both tabs have unread notifications,
then when opening the overlay and clicking on the alerts tab, the user
would be reverted back to the messages tab.

Test stops this from happening again.

Change-Id: I6bbbbf61251957336de8856201412fa3569ab22d
This commit is contained in:
jdlrobson 2014-08-13 10:07:32 -07:00
parent 24e8a34c50
commit bee2fe3af1
2 changed files with 29 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
modules/overlay/ext.echo.overlay.js
View file

@ -185,10 +185,6 @@
}; };
EchoOverlay.prototype = { EchoOverlay.prototype = {
/**
* @var string the name of the tab that is currently active
*/
activeTabName: 'alert',
/** /**
* @var array a list of EchoOverlayTabs * @var array a list of EchoOverlayTabs
*/ */
@ -275,7 +271,7 @@
_showTabList: function( tab ) { _showTabList: function( tab ) {
var $lists = this.$el.find( '.mw-echo-notifications' ).hide(); var $lists = this.$el.find( '.mw-echo-notifications' ).hide();
this.activeTabName = tab.name; this._activeTab = tab;
$lists.each( function() { $lists.each( function() {
if ( $( this ).data( 'tab' ).name === tab.name ) { if ( $( this ).data( 'tab' ).name === tab.name ) {
$( this ).show(); $( this ).show();
@ -316,7 +312,7 @@
self._showTabList( $this.data( 'tab' ) ); self._showTabList( $this.data( 'tab' ) );
} ) } )
.data( 'tab', echoTab ) .data( 'tab', echoTab )
.addClass( echoTab.name === self.activeTabName ? 'mw-ui-active' : 'mw-ui-quiet' ) .addClass( echoTab.name === self._activeTab.name ? 'mw-ui-active' : 'mw-ui-quiet' )
.text( label ).appendTo( $li ); .text( label ).appendTo( $li );
} ); } );
return $ul; return $ul;
@ -333,7 +329,7 @@
_getTitleElement: function() { _getTitleElement: function() {
var $title = $( '<div>' ).addClass( 'mw-echo-overlay-title' ) var $title = $( '<div>' ).addClass( 'mw-echo-overlay-title' )
.append( this._getTabsElement() ); .append( this._getTabsElement() );
this._showTabList( this.tabs[0] ); this._showTabList( this._activeTab );
return $title; return $title;
}, },
@ -366,7 +362,7 @@
self.tabs.push( tab ); self.tabs.push( tab );
self.notificationCount.all += notifications[tabOptions.name].index.length; self.notificationCount.all += notifications[tabOptions.name].index.length;
} ); } );
this.activeTabName = this.tabs[0].name; this._activeTab = this.tabs[0];
$overlay.prepend( this._getTitleElement() ); $overlay.prepend( this._getTitleElement() );
$overlay.append( this._getFooterElement() ); $overlay.append( this._getFooterElement() );

25
tests/qunit/overlay/test_ext.echo.overlay.js
View file

@ -279,4 +279,29 @@
'Check the label has a count in it and reflects the total unread and not the shown unread' ); 'Check the label has a count in it and reflects the total unread and not the shown unread' );
assert.strictEqual( $overlay.find( '.mw-echo-unread' ).length, 8, 'There are 8 unread notifications.' ); assert.strictEqual( $overlay.find( '.mw-echo-unread' ).length, 8, 'There are 8 unread notifications.' );
} ); } );
QUnit.test( 'Switching tabs visibility', 4, function( assert ) {
var $overlay;
this.sandbox.stub( mw.echo.overlay, 'api', new this.ApiStub( 2 ) );
mw.echo.overlay.buildOverlay( function( $o ) {
// put in dom so we can do visibility tests
$overlay = $o.appendTo( '#qunit-fixture' );
} );
// Test initial state
assert.strictEqual( $overlay.find( '.mw-echo-notifications' ).eq( 0 ).is( ':visible' ),
true, 'First tab is visible.' );
assert.strictEqual( $overlay.find( '.mw-echo-notifications' ).eq( 1 ).is( ':visible' ),
false, 'Second tab starts hidden.' );
// Switch to second tab
$overlay.find( '.mw-echo-overlay-title li a' ).eq( 1 ).trigger( 'click' );
// check new tab visibility
assert.strictEqual( $overlay.find( '.mw-echo-notifications' ).eq( 0 ).is( ':visible' ),
false, 'First tab is now hidden.' );
assert.strictEqual( $overlay.find( '.mw-echo-notifications' ).eq( 1 ).is( ':visible' ),
true, 'Second tab is now visible.' );
} );
}( jQuery, mediaWiki ) ); }( jQuery, mediaWiki ) );