mediawiki-skins-MinervaNeue/tests/qunit/skins.minerva.scripts/watchstar.test.js
Dayllan Maza 0fc40f71c5 watchstar: Add temp-watched css class when expiry is present
MobileFrontend extension is currently tracking watched/temp-watch
css classes and applying animations to the "watch" event.
This patch starts adding temp-watched accordingly now that the
expiry is part of the event's data.

Note: this patch does not fix the lack of animation when transitioning
from half-star to empty-star or on page-load when the page is
temporarily watched but it fixes the awkward angle the half-star
icon was left in when transitioning from a full-star to a half-star

Bug: T262862
Change-Id: I1c8cb9c33cda76b87b6a9f15e408d88edbf61d93
2020-09-24 12:21:33 -04:00

39 lines
1.5 KiB
JavaScript

( function () {
var watchstar = require( '../../../resources/skins.minerva.scripts/watchstar.js' ),
toggleClasses = watchstar.test.toggleClasses,
WATCHED_CLASS = [ 'watched', 'mw-ui-icon-wikimedia-unStar-progressive' ],
TEMP_WATCHED_CLASS = [ 'temp-watched', 'mw-ui-icon-wikimedia-halfStar-progressive' ],
UNWATCHED_CLASS = 'mw-ui-icon-wikimedia-star-base20';
QUnit.module( 'Minerva Watchstar' );
function createElemWithClass( cssClass ) {
return $( '<div/>' ).addClass( cssClass );
}
QUnit.test( 'toggleClasses() from watched to unwatched', function ( assert ) {
var $elem = createElemWithClass( WATCHED_CLASS );
toggleClasses( $elem, 'unwatch' );
assert.deepEqual( $elem.attr( 'class' ), UNWATCHED_CLASS );
} );
QUnit.test( 'toggleClasses() from unwatched to watched', function ( assert ) {
var $elem = createElemWithClass( UNWATCHED_CLASS );
toggleClasses( $elem, 'watch', null );
assert.deepEqual( $elem.attr( 'class' ).split( /\s+/ ), WATCHED_CLASS );
} );
QUnit.test( 'toggleClasses() from unwatched to temp watched', function ( assert ) {
var $elem = createElemWithClass( UNWATCHED_CLASS );
toggleClasses( $elem, 'watch', 'expiry' );
assert.deepEqual( $elem.attr( 'class' ).split( /\s+/ ), TEMP_WATCHED_CLASS );
} );
QUnit.test( 'toggleClasses() from temp watched to watched', function ( assert ) {
var $elem = createElemWithClass( TEMP_WATCHED_CLASS );
toggleClasses( $elem, 'watch', null );
assert.deepEqual( $elem.attr( 'class' ).split( /\s+/ ), WATCHED_CLASS );
} );
}() );