Embrace packageFiles

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

.eslintrc.json

@@ -15,6 +15,10 @@
 	"rules": {
 		"no-restricted-properties": [
 			"error",
+			{
+				"property": "define",
+				"message": "The method `define` if used with mw.mobileFrontend is deprecated. Please use `module.exports`."
+			},
 			{
 				"property": "done",
 				"message": "The method `done` if used with Deferred objects is incompatible with ES6 Promises. Please use `then`."

components/ToggleList/ToggleList.js

@@ -1,4 +1,4 @@
-( function ( M ) {
+( function () {
 	var
 		/** The component selector. */
 		selector = '.toggle-list',
@@ -91,9 +91,9 @@
 		checkbox.setAttribute( 'aria-expanded', ( !!checkbox.checked ).toString() );
 	}
 
-	M.define( 'skins.minerva.scripts/ToggleList', Object.freeze( {
+	module.exports = Object.freeze( {
 		selector: selector,
 		render: render,
 		bind: bind
-	} ) );
-}( mw.mobileFrontend ) );
+	} );
+}() );

includes/MinervaHooks.php

@@ -111,17 +111,19 @@ class MinervaHooks {
 		$testModule = [
 			'dependencies' => [
 				'mobile.startup',
-				'skins.minerva.notifications.badge',
 				'mediawiki.user',
 				'mediawiki.experiments'
 			],
+			'templates' => [
+				"badge.mustache" => "includes/skins/userNotifications.mustache",
+			],
 			'localBasePath' => dirname( __DIR__ ),
 			'remoteSkinPath' => 'MinervaNeue',
 			'targets' => [ 'mobile', 'desktop' ],
-			'scripts' => [
+			'packageFiles' => [
 				// additional scaffolding (minus initialisation scripts)
-				'tests/qunit/skins.minerva.scripts/stubs.js',
-
+				'tests/qunit/skins.minerva.scripts/index.js',
+				'resources/skins.minerva.scripts/NotificationBadge.js',
 				'resources/skins.minerva.scripts/page-issues/parser.js',
 				'resources/skins.minerva.scripts/downloadPageAction.js',
 				'resources/skins.minerva.scripts/AB.js',
@@ -136,12 +138,12 @@ class MinervaHooks {
 				'resources/skins.minerva.scripts/TitleUtil.js',
 				// test files
 				'tests/qunit/skins.minerva.scripts/downloadPageAction.test.js',
-				'tests/qunit/skins.minerva.scripts/pageIssuesParser.test.js',
+				'tests/qunit/skins.minerva.scripts/page-issues/parser.test.js',
 				'tests/qunit/skins.minerva.scripts/AB.test.js',
-				'tests/qunit/skins.minerva.scripts/pageIssues.test.js',
+				'tests/qunit/skins.minerva.scripts/page-issues/index.test.js',
 				'tests/qunit/skins.minerva.scripts/UriUtil.test.js',
 				'tests/qunit/skins.minerva.scripts/TitleUtil.test.js',
-				'tests/qunit/skins.minerva.notifications.badge/NotificationBadge.test.js'
+				'tests/qunit/skins.minerva.scripts/NotificationBadge.test.js'
 			],
 		];
 

includes/skins/SkinMinerva.php

@@ -829,10 +829,6 @@ class SkinMinerva extends SkinTemplate {
 			$modules[] = 'skins.minerva.watchstar';
 		}
 
-		if ( $user->isLoggedIn() && $this->useEcho() ) {
-			$modules[] = 'skins.minerva.notifications';
-		}
-
 		// TalkOverlay feature
 		if (
 			$this->getUserPageHelper()->isUserPage() ||

resources/skins.minerva.options/categories.js

@@ -4,7 +4,7 @@ module.exports = function () {
 		mobile = M.require( 'mobile.startup' ),
 		loader = mobile.rlModuleLoader,
 		features = mw.config.get( 'wgMinervaFeatures', {} ),
-		overlayManager = M.require( 'skins.minerva.scripts/overlayManager' ),
+		overlayManager = require( 'skins.minerva.scripts' ).overlayManager,
 		eventBus = mobile.eventBusSingleton,
 		isAnon = mw.user.isAnon();
 

resources/skins.minerva.scripts/AB.js

@@ -73,5 +73,5 @@
 		};
 	}
 
-	M.define( 'skins.minerva.scripts/AB', AB );
+	module.exports = AB;
 }( mw.mobileFrontend, mw.experiments ) );

resources/skins.minerva.scripts/NotificationBadge.js

@@ -58,7 +58,7 @@
 	}
 
 	mfExtend( NotificationBadge, View, {
-		template: mw.template.get( 'skins.minerva.notifications.badge', 'badge.mustache' ),
+		template: mw.template.get( 'skins.minerva.scripts', 'badge.mustache' ),
 		/**
 		 * Update the notification count
 		 * @memberof NotificationBadge
@@ -88,5 +88,5 @@
 		}
 	} );
 
-	M.define( 'skins.minerva.notifications/NotificationBadge', NotificationBadge );
+	module.exports = NotificationBadge;
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/TitleUtil.js

@@ -3,8 +3,8 @@
 // of a SiteInfo, it still becomes a public API. If it lives where used, it becomes a copy and paste
 // implementation where each copy can deviate but deletion is easy. See additional discussion in
 // T218358 and I95b08e77eece5cd4dae62f6f237d492d6b0fe42b.
-( function ( M ) {
-	var UriUtil = M.require( 'skins.minerva.scripts/UriUtil' );
+( function () {
+	var UriUtil = require( './UriUtil.js' );
 
 	/**
 	 * Returns the decoded wiki page title referenced by the passed link as a string when parsable.
@@ -132,7 +132,7 @@
 		return length === ( ( 'oldid' in uri.query ? 1 : 0 ) + ( 'title' in uri.query ? 1 : 0 ) );
 	}
 
-	M.define( 'skins.minerva.scripts/TitleUtil', {
+	module.exports = {
 		newFromUri: newFromUri
-	} );
-}( mw.mobileFrontend ) );
+	};
+}() );

resources/skins.minerva.scripts/Toolbar.js

@@ -1,8 +1,8 @@
 ( function ( M ) {
 	var
 		mobile = M.require( 'mobile.startup' ),
-		ToggleList = M.require( 'skins.minerva.scripts/ToggleList' ),
-		downloadPageAction = M.require( 'skins.minerva.scripts/downloadPageAction' ),
+		ToggleList = require( '../../components/ToggleList/ToggleList.js' ),
+		downloadPageAction = require( './downloadPageAction.js' ).downloadPageAction,
 		Icon = mobile.Icon,
 		skin = M.require( 'mobile.init/skin' ),
 		/** The top level menu. */
@@ -105,9 +105,9 @@
 		}
 	}
 
-	M.define( 'skins.minerva.scripts/Toolbar', {
+	module.exports = {
 		selector: toolbarSelector,
 		bind: bind,
 		render: render
-	} );
+	};
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/UriUtil.js

@@ -1,4 +1,4 @@
-( function ( M ) {
+( function () {
 	/**
 	 * Compares the default Uri host, usually `window.location.host`, and `mw.Uri.host`. Equivalence
 	 * tests internal linkage, a mismatch may indicate an external link. Interwiki links are
@@ -28,7 +28,7 @@
 		return uri.host === mw.Uri().host;
 	}
 
-	M.define( 'skins.minerva.scripts/UriUtil', {
+	module.exports = {
 		isInternal: isInternal
-	} );
-}( mw.mobileFrontend ) );
+	};
+}() );

resources/skins.minerva.scripts/downloadPageAction.js

@@ -158,7 +158,11 @@
 		}
 	}
 
-	M.define( 'skins.minerva.scripts/test/getOnClickHandler', getOnClickHandler );
-	M.define( 'skins.minerva.scripts/test/isAvailable', isAvailable );
-	M.define( 'skins.minerva.scripts/downloadPageAction', downloadPageAction );
+	module.exports = {
+		downloadPageAction: downloadPageAction,
+		test: {
+			isAvailable: isAvailable,
+			getOnClickHandler: getOnClickHandler
+		}
+	};
 }( mw.mobileFrontend, mw.track, mw.msg ) );

resources/skins.minerva.scripts/init.js

@@ -4,15 +4,20 @@
 		PageGateway = mobile.PageGateway,
 		toast = mobile.toast,
 		time = mobile.time,
-		TitleUtil = M.require( 'skins.minerva.scripts/TitleUtil' ),
-		issues = M.require( 'skins.minerva.scripts/pageIssues' ),
-		Toolbar = M.require( 'skins.minerva.scripts/Toolbar' ),
+		notifications = require( './notifications.js' ),
+		preInit = require( './preInit.js' ),
+		initLogging = require( './initLogging.js' ),
+		mobileRedirect = require( './mobileRedirect.js' ),
+		search = require( './search.js' ),
+		references = require( './references.js' ),
+		TitleUtil = require( './TitleUtil.js' ),
+		issues = require( './page-issues/index.js' ),
+		Toolbar = require( './Toolbar.js' ),
 		router = require( 'mediawiki.router' ),
-		OverlayManager = mobile.OverlayManager,
 		CtaDrawer = mobile.CtaDrawer,
 		Button = mobile.Button,
 		Anchor = mobile.Anchor,
-		overlayManager = OverlayManager.getSingleton(),
+		overlayManager = require( './overlayManager.js' ),
 		currentPage = mobile.currentPage(),
 		currentPageHTMLParser = mobile.currentPageHTMLParser(),
 		$redLinks = currentPageHTMLParser.getRedLinks(),
@@ -334,6 +339,18 @@
 
 	$( function () {
 		var toolbarElement = document.querySelector( Toolbar.selector );
+		// Init:
+		// - main menu closes when you click outside of it
+		// - redirects show a toast.
+		preInit();
+		// - logging
+		initLogging();
+		// - references
+		references();
+		// - search
+		search();
+		// - mobile redirect
+		mobileRedirect();
 		// Update anything else that needs enhancing (e.g. watchlist)
 		initModifiedInfo();
 		initRegistrationInfo();
@@ -351,7 +368,12 @@
 		if ( !currentPage.isMissing ) {
 			issues.init( overlayManager, currentPageHTMLParser );
 		}
+		// If Echo is installed (using config as a proxy) and user is logged in init notifications
+		if ( !mw.user.isAnon() && mw.config.get( 'wgEchoMaxNotificationCount' ) !== undefined ) {
+			notifications();
+		}
 	} );
-
-	M.define( 'skins.minerva.scripts/overlayManager', overlayManager );
+	module.exports = {
+		overlayManager: overlayManager
+	};
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/initLogging.js

@@ -1,9 +1,7 @@
 // This initialises EventLogging for main menu and some prominent links in the UI.
 // This code should only be loaded on the Minerva skin, it does not apply to other skins.
-( function ( M ) {
-	var mainMenu = M.require( 'skins.minerva.scripts/mainMenu' );
+var mainMenu = require( './menu.js' );
 
-	$( function () {
-		mainMenu.enableLogging();
-	} );
-}( mw.mobileFrontend ) );
+module.exports = function () {
+	mainMenu.enableLogging();
+};

resources/skins.minerva.scripts/menu.js

@@ -1,34 +1,31 @@
-( function ( M ) {
-	var MainMenu = M.require( 'skins.minerva.scripts/MainMenu' ),
-		mainMenu = createMainMenu();
+var MainMenu = require( './menu/MainMenu.js' ),
+	mainMenu = createMainMenu();
 
-	/**
-	 * Creates an instance of the `MainMenu`, using the `wgMinervaMenuData` for configuration.
-	 *
-	 * N.B. that the activator - the UI element that the user must click in order to open the main
-	 * menu - is always `.header .main-menu-button`.
-	 *
-	 * @return {MainMenu}
-	 *
-	 * @ignore
-	 */
-	function createMainMenu() {
-		// Failsafe in case this is not defined e.g. T225423
-		var options = mw.config.get( 'wgMinervaMenuData', {} );
+/**
+ * Creates an instance of the `MainMenu`, using the `wgMinervaMenuData` for configuration.
+ *
+ * N.B. that the activator - the UI element that the user must click in order to open the main
+ * menu - is always `.header .main-menu-button`.
+ *
+ * @return {MainMenu}
+ *
+ * @ignore
+ */
+function createMainMenu() {
+	var options = mw.config.get( 'wgMinervaMenuData', {} );
 
-		options.activator = '.header .main-menu-button';
+	options.activator = '.header .main-menu-button';
 
-		return new MainMenu( options );
+	return new MainMenu( options );
+}
+
+$( function () {
+	// eslint-disable-next-line no-jquery/no-global-selector
+	if ( !$( '#mw-mf-page-left' ).find( '.menu' ).length ) {
+		// Now we have a main menu button register it.
+		mainMenu.registerClickEvents();
+		mainMenu.appendTo( '#mw-mf-page-left' );
 	}
+} );
 
-	$( function () {
-		// eslint-disable-next-line no-jquery/no-global-selector
-		if ( !$( '#mw-mf-page-left' ).find( '.menu' ).length ) {
-			// Now we have a main menu button register it.
-			mainMenu.registerClickEvents();
-			mainMenu.appendTo( '#mw-mf-page-left' );
-		}
-	} );
-
-	M.define( 'skins.minerva.scripts/mainMenu', mainMenu );
-}( mw.mobileFrontend ) );
+module.exports = mainMenu;

resources/skins.minerva.scripts/menu/MainMenu.js

@@ -131,6 +131,6 @@
 		}
 	} );
 
-	M.define( 'skins.minerva.scripts/MainMenu', MainMenu );
+	module.exports = MainMenu;
 
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/mobileRedirect.js

@@ -1,11 +1,7 @@
 /*
  * Warn people if they're trying to switch to desktop but have cookies disabled.
  */
-
-( function ( M ) {
-
-	var popup = M.require( 'mobile.startup' ).toast;
-
+module.exports = function () {
 	/**
 	 * Checks whether cookies are enabled
 	 * @method
@@ -36,7 +32,7 @@
 	 */
 	function desktopViewClick() {
 		if ( !cookiesEnabled() ) {
-			popup.show(
+			mw.notify(
 				mw.msg( 'mobile-frontend-cookies-required' ),
 				{ type: 'error' }
 			);
@@ -47,5 +43,4 @@
 
 	// eslint-disable-next-line no-jquery/no-global-selector
 	$( '#mw-mf-display-toggle' ).on( 'click', desktopViewClick );
-
-}( mw.mobileFrontend ) );
+};

resources/skins.minerva.scripts/notifications.js

@@ -2,14 +2,15 @@
  * This code loads the necessary modules for the notifications overlay, not to be confused
  * with the Toast notifications defined by common/toast.js.
  */
-( function ( M ) {
+module.exports = function () {
 	var badge,
-		mainMenu = M.require( 'skins.minerva.scripts/mainMenu' ),
+		M = mw.mobileFrontend,
+		mainMenu = require( './menu.js' ),
 		router = require( 'mediawiki.router' ),
 		mobile = M.require( 'mobile.startup' ),
 		util = mobile.util,
-		NotificationBadge = M.require( 'skins.minerva.notifications/NotificationBadge' ),
-		overlayManager = M.require( 'skins.minerva.scripts/overlayManager' ),
+		NotificationBadge = require( './NotificationBadge.js' ),
+		overlayManager = require( './overlayManager.js' ),
 		initialized = false;
 
 	function showNotificationOverlay() {
@@ -106,4 +107,4 @@
 		} );
 	} );
 
-}( mw.mobileFrontend ) );
+};

resources/skins.minerva.scripts/overlayManager.js

@@ -0,0 +1,6 @@
+var
+	mobile = mw.mobileFrontend.require( 'mobile.startup' ),
+	OverlayManager = mobile.OverlayManager,
+	overlayManager = OverlayManager.getSingleton();
+
+module.exports = overlayManager;

resources/skins.minerva.scripts/page-issues/index.js

@@ -9,9 +9,9 @@
 		NS_CATEGORY = 14,
 		CURRENT_NS = config.get( 'wgNamespaceNumber' ),
 		features = mw.config.get( 'wgMinervaFeatures', {} ),
-		pageIssuesParser = M.require( 'skins.minerva.scripts/pageIssuesParser' ),
-		pageIssuesOverlay = M.require( 'skins.minerva.scripts/pageIssuesOverlay' ),
-		pageIssueFormatter = M.require( 'skins.minerva.scripts/page-issues/page/pageIssueFormatter' ),
+		pageIssuesParser = require( './parser.js' ),
+		pageIssuesOverlay = require( './overlay/pageIssuesOverlay.js' ),
+		pageIssueFormatter = require( './page/pageIssueFormatter.js' ),
 		// When the query string flag is set force on new treatment.
 		// When wgMinervaPageIssuesNewTreatment is the default this line can be removed.
 		QUERY_STRING_FLAG = mw.util.getParamValue( 'minerva-issues' ),
@@ -194,11 +194,11 @@
 		} );
 	}
 
-	M.define( 'skins.minerva.scripts/pageIssues', {
+	module.exports = {
 		init: initPageIssues,
 		test: {
 			insertBannersOrNotice: insertBannersOrNotice
 		}
-	} );
+	};
 
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/page-issues/overlay/IssueList.js

@@ -3,7 +3,7 @@
 		mobile = M.require( 'mobile.startup' ),
 		mfExtend = mobile.mfExtend,
 		View = mobile.View,
-		IssueNotice = M.require( 'skins.minerva.scripts/IssueNotice' );
+		IssueNotice = require( './IssueNotice.js' );
 
 	/**
 	 * IssueList
@@ -29,5 +29,5 @@
 		}
 	} );
 
-	M.define( 'skins.minerva.scripts/IssueList', IssueList );
+	module.exports = IssueList;
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.js

@@ -22,5 +22,5 @@
 			this.$el.find( '.issue-notice' ).prepend( this.options.issue.icon.$el );
 		}
 	} );
-	M.define( 'skins.minerva.scripts/IssueNotice', IssueNotice );
+	module.exports = IssueNotice;
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/page-issues/overlay/pageIssuesOverlay.js

@@ -1,7 +1,7 @@
 ( function ( M, mwMsg ) {
 	var
 		Overlay = M.require( 'mobile.startup' ).Overlay,
-		IssueList = M.require( 'skins.minerva.scripts/IssueList' ),
+		IssueList = require( './IssueList.js' ),
 		KEYWORD_ALL_SECTIONS = 'all',
 		NS_MAIN = 0,
 		NS_TALK = 1,
@@ -53,5 +53,5 @@
 		}
 	}
 
-	M.define( 'skins.minerva.scripts/pageIssuesOverlay', pageIssuesOverlay );
+	module.exports = pageIssuesOverlay;
 }( mw.mobileFrontend, mw.msg ) );

resources/skins.minerva.scripts/page-issues/page/PageIssueLearnMoreLink.js

@@ -1,4 +1,4 @@
-( function ( M ) {
+( function () {
 	/**
 	 * Creates a "read more" button with given text.
 	 * @param {string} msg
@@ -10,5 +10,5 @@
 			.text( msg );
 	}
 
-	M.define( 'skins.minerva.scripts/page-issues/page/PageIssueLearnMoreLink', newPageIssueLearnMoreLink );
-}( mw.mobileFrontend ) );
+	module.exports = newPageIssueLearnMoreLink;
+}() );

resources/skins.minerva.scripts/page-issues/page/PageIssueLink.js

@@ -1,4 +1,4 @@
-( function ( M ) {
+( function () {
 	/**
 	 * Create a link element that opens the issues overlay.
 	 *
@@ -9,5 +9,5 @@
 		return $( '<a>' ).addClass( 'cleanup mw-mf-cleanup' ).text( labelText );
 	}
 
-	M.define( 'skins.minerva.scripts/page-issues/page/PageIssueLink', newPageIssueLink );
-}( mw.mobileFrontend ) );
+	module.exports = newPageIssueLink;
+}() );

resources/skins.minerva.scripts/page-issues/page/pageIssueFormatter.js

@@ -1,7 +1,7 @@
-( function ( M ) {
+( function () {
 	var
-		newPageIssueLink = M.require( 'skins.minerva.scripts/page-issues/page/PageIssueLink' ),
-		newPageIssueLearnMoreLink = M.require( 'skins.minerva.scripts/page-issues/page/PageIssueLearnMoreLink' );
+		newPageIssueLink = require( './PageIssueLink.js' ),
+		newPageIssueLearnMoreLink = require( './PageIssueLearnMoreLink.js' );
 
 	/**
 	 * Modifies the `issue` DOM to create a banner designed for single / multiple issue templates,
@@ -44,8 +44,8 @@
 		$link.insertAfter( $( 'h1#section_0' ) );
 	}
 
-	M.define( 'skins.minerva.scripts/page-issues/page/pageIssueFormatter', {
+	module.exports = {
 		insertPageIssueBanner: insertPageIssueBanner,
 		insertPageIssueNotice: insertPageIssueNotice
-	} );
-}( mw.mobileFrontend ) );
+	};
+}() );

resources/skins.minerva.scripts/page-issues/parser.js

@@ -217,7 +217,7 @@
 	/**
 	 * @module skins.minerva.scripts/utils
 	 */
-	M.define( 'skins.minerva.scripts/pageIssuesParser', {
+	module.exports = {
 		extract: extract,
 		parse: parse,
 		maxSeverity: maxSeverity,
@@ -227,6 +227,6 @@
 			parseType: parseType,
 			parseGroup: parseGroup
 		}
-	} );
+	};
 
 }( mw.mobileFrontend ) );

resources/skins.minerva.scripts/preInit.js

@@ -5,14 +5,12 @@
  * @class mw.mobileFrontend
  * @singleton
  */
-( function ( M ) {
-	var skin = M.require( 'mobile.init/skin' ),
-		mainMenu = M.require( 'skins.minerva.scripts/mainMenu' ),
+module.exports = function () {
+	var M = mw.mobileFrontend,
+		skin = M.require( 'mobile.init/skin' ),
+		mainMenu = require( './menu.js' ),
 		toast = M.require( 'mobile.startup' ).toast;
 
-	// Proxy to MobileFrontend defined skin
-	M.define( 'skins.minerva.scripts/skin', skin );
-
 	/**
 	 * Close navigation if skin is tapped
 	 * @param {JQuery.Event} ev
@@ -55,4 +53,4 @@
 		}
 	}( mw.config.get( 'wgRedirectedFrom' ) ) );
 	/* eslint-enable no-console */
-}( mw.mobileFrontend ) );
+};

resources/skins.minerva.scripts/references.js

@@ -1,5 +1,6 @@
-( function ( M ) {
+module.exports = function () {
 	var drawer,
+		M = mw.mobileFrontend,
 		router = require( 'mediawiki.router' ),
 		mobile = M.require( 'mobile.startup' ),
 		currentPage = mobile.currentPage(),
@@ -93,4 +94,4 @@
 	}
 
 	init();
-}( mw.mobileFrontend ) );
+};

resources/skins.minerva.scripts/search.js

@@ -1,9 +1,10 @@
-( function ( M ) {
+module.exports = function () {
 	var
+		M = mw.mobileFrontend,
 		mobile = M.require( 'mobile.startup' ),
 		SearchOverlay = mobile.search.SearchOverlay,
 		SearchGateway = mobile.search.SearchGateway,
-		overlayManager = M.require( 'skins.minerva.scripts/overlayManager' ),
+		overlayManager = require( './overlayManager.js' ),
 		searchLogger = mobile.search.MobileWebSearchLogger,
 		// eslint-disable-next-line no-jquery/no-global-selector
 		$searchInput = $( '#searchInput' ),
@@ -75,4 +76,4 @@
 		getSearchOverlay().showKeyboard();
 	} );
 
-}( mw.mobileFrontend ) );
+};

resources/skins.minerva.talk/init.js

@@ -11,8 +11,9 @@
 		$talk = $( '.talk, [rel="discussion"]' ),
 		// use the plain return value here - T128273
 		title = $talk.attr( 'data-title' ),
-		overlayManager = M.require( 'skins.minerva.scripts/overlayManager' ),
-		skin = M.require( 'skins.minerva.scripts/skin' ),
+		overlayManager = require( 'skins.minerva.scripts' ).overlayManager,
+		// FIXME: This dependency shouldn't exist
+		skin = M.require( 'mobile.init/skin' ),
 		inTalkNamespace = false,
 		pageTitle, talkTitle, talkNs, pageNs;
 

skin.json

@@ -455,6 +455,7 @@
 				"desktop"
 			],
 			"dependencies": [
+				"mediawiki.ui.anchor",
 				"wikimedia.ui",
 				"skins.minerva.mainMenu.icons",
 				"skins.minerva.mainMenu.styles",
@@ -472,6 +473,8 @@
 				"mediawiki.experiments"
 			],
 			"messages": [
+				"echo-badge-count",
+				"mobile-frontend-notifications-filter",
 				"skin-minerva-issue-learn-more",
 				"mobile-frontend-meta-data-issues",
 				"minerva-meta-data-issues-section-header",
@@ -492,11 +495,16 @@
 				"resources/skins.minerva.scripts/page-issues/overlay/PageIssuesOverlay.less"
 			],
 			"templates": {
+				"badge.mustache": "includes/skins/userNotifications.mustache",
 				"IssueNotice.mustache": "resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.mustache",
 				"menu.mustache": "resources/skins.minerva.scripts/menu/menu.mustache",
 				"menuGroup.mustache": "resources/skins.minerva.scripts/menu/menuGroup.mustache"
 			},
-			"scripts": [
+			"packageFiles": [
+				"resources/skins.minerva.scripts/init.js",
+				"resources/skins.minerva.scripts/NotificationBadge.js",
+				"resources/skins.minerva.scripts/notifications.js",
+				"resources/skins.minerva.scripts/overlayManager.js",
 				"resources/skins.minerva.scripts/menu/schema.js",
 				"resources/skins.minerva.scripts/menu/MainMenu.js",
 				"resources/skins.minerva.scripts/menu.js",
@@ -516,7 +524,6 @@
 				"resources/skins.minerva.scripts/TitleUtil.js",
 				"components/ToggleList/ToggleList.js",
 				"resources/skins.minerva.scripts/Toolbar.js",
-				"resources/skins.minerva.scripts/init.js",
 				"resources/skins.minerva.scripts/initLogging.js",
 				"resources/skins.minerva.scripts/mobileRedirect.js",
 				"resources/skins.minerva.scripts/search.js",
@@ -524,42 +531,6 @@
 				"resources/skins.minerva.scripts/toc.js"
 			]
 		},
-		"skins.minerva.notifications.badge": {
-			"messages": [
-				"echo-badge-count"
-			],
-			"dependencies": [
-				"mediawiki.router",
-				"mobile.startup"
-			],
-			"scripts": [
-				"resources/skins.minerva.notifications.badge/NotificationBadge.js"
-			],
-			"templates": {
-				"badge.mustache": "includes/skins/userNotifications.mustache"
-			},
-			"targets": [
-				"mobile",
-				"desktop"
-			]
-		},
-		"skins.minerva.notifications": {
-			"dependencies": [
-				"skins.minerva.notifications.badge",
-				"mediawiki.ui.anchor",
-				"skins.minerva.scripts"
-			],
-			"scripts": [
-				"resources/skins.minerva.notifications/init.js"
-			],
-			"messages": [
-				"mobile-frontend-notifications-filter"
-			],
-			"targets": [
-				"mobile",
-				"desktop"
-			]
-		},
 		"skins.minerva.options.share.icon": {
 			"class": "ResourceLoaderImageModule",
 			"selector": ".mw-ui-icon-minerva-{name}:before",

tests/qunit/skins.minerva.scripts/AB.test.js

@@ -1,6 +1,6 @@
 ( function ( M ) {
 
-	var AB = M.require( 'skins.minerva.scripts/AB' ),
+	var AB = require( '../../../resources/skins.minerva.scripts/AB.js' ),
 		util = M.require( 'mobile.startup' ).util,
 		defaultConfig = {
 			testName: 'WME.MinervaABTest',

tests/qunit/skins.minerva.scripts/NotificationBadge.test.js

@@ -1,6 +1,6 @@
 ( function ( M ) {
 	var OverlayManager = M.require( 'mobile.startup' ).OverlayManager,
-		NotificationBadge = M.require( 'skins.minerva.notifications/NotificationBadge' );
+		NotificationBadge = require( '../../../resources/skins.minerva.scripts/NotificationBadge.js' );
 
 	QUnit.module( 'Minerva NotificationBadge', {
 		beforeEach: function () {
@@ -32,6 +32,9 @@
 		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,

tests/qunit/skins.minerva.scripts/TitleUtil.test.js

@@ -1,5 +1,5 @@
-( function ( M ) {
-	var TitleUtil = M.require( 'skins.minerva.scripts/TitleUtil' );
+( function () {
+	var TitleUtil = require( '../../../resources/skins.minerva.scripts/TitleUtil.js' );
 
 	QUnit.module( 'Minerva TitleUtil', QUnit.newMwEnvironment( {
 		setup: function () {
@@ -226,4 +226,4 @@
 			'mismatching host (2)'
 		);
 	} );
-}( mw.mobileFrontend ) );
+}() );

tests/qunit/skins.minerva.scripts/UriUtil.test.js

@@ -1,5 +1,5 @@
-( function ( M ) {
-	var UriUtil = M.require( 'skins.minerva.scripts/UriUtil' );
+( function () {
+	var UriUtil = require( '../../../resources/skins.minerva.scripts/UriUtil.js' );
 
 	QUnit.module( 'Minerva UriUtil', QUnit.newMwEnvironment( {
 		setup: function () {
@@ -44,4 +44,4 @@
 			'differing subdomains are not internal'
 		);
 	} );
-}( mw.mobileFrontend ) );
+}() );

tests/qunit/skins.minerva.scripts/downloadPageAction.test.js

@@ -7,8 +7,9 @@
 		windowChrome = { chrome: true },
 		downloadIcon = icons.spinner(),
 		windowNotChrome = {},
-		getOnClickHandler = M.require( 'skins.minerva.scripts/test/getOnClickHandler' ),
-		isAvailable = M.require( 'skins.minerva.scripts/test/isAvailable' ),
+		downloadAction = require( '../../../resources/skins.minerva.scripts/downloadPageAction.js' ),
+		getOnClickHandler = downloadAction.test.getOnClickHandler,
+		isAvailable = downloadAction.test.isAvailable,
 		browser = mobile.Browser.getSingleton(),
 		lazyImageLoader = mobile.lazyImages.lazyImageLoader,
 		Page = mobile.Page;

tests/qunit/skins.minerva.scripts/index.js

@@ -0,0 +1,15 @@
+// Since tests.minerva.scripts does
+// not pull in the entire module skins.minerva.scripts
+// we have to stub certain templates to make it appear like its been loaded.
+mw.template.add( 'skins.minerva.scripts', 'IssueNotice.mustache', '' );
+mw.template.add( 'skins.minerva.scripts', 'badge.mustache',
+	mw.template.get( 'tests.skins.minerva', 'badge.mustache' ).getSource() );
+module.exports = [
+	require( './NotificationBadge.test.js' ),
+	require( './downloadPageAction.test.js' ),
+	require( './page-issues/parser.test.js' ),
+	require( './AB.test.js' ),
+	require( './page-issues/index.test.js' ),
+	require( './UriUtil.test.js' ),
+	require( './TitleUtil.test.js' )
+];

tests/qunit/skins.minerva.scripts/page-issues/index.test.js

@@ -1,7 +1,7 @@
 ( function ( M ) {
 	var
 		mobile = M.require( 'mobile.startup' ),
-		pageIssues = M.require( 'skins.minerva.scripts/pageIssues' ),
+		pageIssues = require( '../../../../resources/skins.minerva.scripts/page-issues/index.js' ),
 		insertBannersOrNotice = pageIssues.test.insertBannersOrNotice,
 		OverlayManager = mobile.OverlayManager,
 		PageHTMLParser = mobile.PageHTMLParser,

tests/qunit/skins.minerva.scripts/page-issues/parser.test.js

@@ -1,6 +1,6 @@
-( function ( M ) {
+( function () {
 	var icon = {},
-		pageIssuesParser = M.require( 'skins.minerva.scripts/pageIssuesParser' ),
+		pageIssuesParser = require( '../../../../resources/skins.minerva.scripts/page-issues/parser.js' ),
 		extractMessage = pageIssuesParser.extract;
 
 	QUnit.module( 'Minerva pageIssuesParser' );
@@ -188,4 +188,4 @@
 		} );
 	} );
 
-}( mw.mobileFrontend ) );
+}() );

tests/qunit/skins.minerva.scripts/stubs.js

@@ -1,4 +0,0 @@
-// Since tests.minerva.scripts does
-// not pull in the entire module skins.minerva.scripts
-// we have to stub certain templates to make it appear like its been loaded.
-mw.template.add( 'skins.minerva.scripts', 'IssueNotice.mustache', '' );

tests/selenium/features/step_definitions/notification_steps.js

@@ -9,7 +9,7 @@ const iHaveNoNotifications = () => {
 };
 
 const iClickOnTheNotificationIcon = () => {
-	ArticlePage.waitUntilResourceLoaderModuleReady( 'skins.minerva.notifications' );
+	ArticlePage.waitUntilResourceLoaderModuleReady( 'skins.minerva.scripts' );
 	ArticlePage.notifications_button_element.click();
 };