Migrates from requires to imports

- Fixes some related linter errors in the way

war/pom.xml

@@ -575,11 +575,9 @@ THE SOFTWARE.
 
 
     <!--
-        The following profiles are required to integration the node/gulp build into this maven build.
+        The following profiles are required to integration the node/yarn build into this maven build.
         Hopefully we can push these profiles down into a parent pom.
-        See https://github.com/tfennelly/jenkins-js-builder#maven-integration
     -->
-
     <profile>
       <id>yarn-execution</id>
       <activation>

war/src/main/js/add-item.js

@@ -35,6 +35,7 @@ $.when(getItems()).done(function(data) {
       if (desc.indexOf('<a href="') === -1) {
         return desc;
       }
+      // eslint-disable-next-line
       var newDesc = desc.replace(/\&lt;/g,'<').replace(/\&gt;/g,'>');
       return newDesc;
     }

war/src/main/js/api/securityConfig.js

@@ -2,6 +2,7 @@
  * Provides a wrapper to interact with the security configuration
  */
 import jenkins from '../util/jenkins';
+import { getWindow } from 'window-handle';
 
 /**
  * Calls a stapler post method to save the first user settings
@@ -13,13 +14,13 @@ function saveFirstUser($form, success, error) {
 		function(response) {
 			var crumbRequestField = response.data.crumbRequestField;
 			if (crumbRequestField) {
-				require('window-handle').getWindow().crumb.init(crumbRequestField, response.data.crumb);
+				getWindow().crumb.init(crumbRequestField, response.data.crumb);
 			}
 			success(response);
 		}, {
 			error: error
 		});
-};
+}
 
 function saveConfigureInstance($form, success, error){
 	jenkins.staplerPost(
@@ -28,13 +29,13 @@ function saveConfigureInstance($form, success, error){
 		function(response) {
 			var crumbRequestField = response.data.crumbRequestField;
 			if (crumbRequestField) {
-				require('window-handle').getWindow().crumb.init(crumbRequestField, response.data.crumb);
+				getWindow().crumb.init(crumbRequestField, response.data.crumb);
 			}
 			success(response);
 		}, {
 			error: error
 		});
-};
+}
 
 /**
  * Calls a stapler post method to save the first user settings
@@ -47,7 +48,7 @@ function saveProxy($form, success, error) {
 			dataType: 'html',
 			error: error
 		});
-};
+}
 
 export default {
 	saveFirstUser: saveFirstUser,

war/src/main/js/config-scrollspy.js

 import $ from 'jquery';
 import windowHandle from 'window-handle';
+import page from './util/page';
+import * as tabBarWidget from './widgets/config/tabbar';
 
-var page = require('./util/page.js');
 var isScrolling = false;
 var ignoreNextScrollEvent = false;
 var pageHeaderHeight = page.pageHeaderHeight();
@@ -25,8 +26,6 @@ function notify(event) {
 }
 
 $(function() {
-    var tabBarWidget = require('./widgets/config/tabbar.js');
-
     tabBarWidget.addPageTabs('.config-table.scrollspy', function(tabBar) {
         tabbars.push(tabBar);
 

war/src/main/js/config-tabbar.js

 import $ from 'jquery';
+import jenkinsLocalStorage from './util/jenkinsLocalStorage';
+import page from './util/page';
+import * as tabBarWidget from './widgets/config/tabbar';
 
-var page = require('./util/page.js');
-var jenkinsLocalStorage = require('./util/jenkinsLocalStorage.js');
-
-exports.tabs = []; // Useful for testing.
+export const tabs = []; // Useful for testing.
 
 $(function() {
-    var tabBarWidget = require('./widgets/config/tabbar.js');
-
     tabBarWidget.addPageTabs('.config-table.tabbed', function(tabBar) {
-        exports.tabs.push(tabBar);
+        tabs.push(tabBar);
 
         // We want to merge some sections together.
         // Merge the "Advanced" section into the "General" section.

war/src/main/js/page-init.js

@@ -2,9 +2,8 @@
  * Page initialisation tasks.
  */
 import $ from 'jquery';
-
 // Require this one to ensure jenkins-js-modules works all the time
-var jsModules = require('jenkins-js-modules');
+import jsModules from 'jenkins-js-modules';
 
 $(function() {
     loadScripts();

war/src/main/js/plugin-setup-wizard/bootstrap-detached.js

@@ -33,4 +33,4 @@ export function enhanceJQueryWithBootstrap($) {
       window.$ = _$;
       window.jQuery = _jQuery;
   }
-};
+}

war/src/main/js/pluginSetupWizardGui.js

@@ -1266,7 +1266,5 @@ var createPluginSetupWizard = function(appendTarget) {
 	}));
 };
 
-var exports = {};
 // export wizard creation method
-exports.init = createPluginSetupWizard;
-export default exports;
+export default { init: createPluginSetupWizard };

war/src/main/js/upgradeWizard.js

+import upgradePanel from './templates/upgradePanel.hbs';
+import upgradeSuccessPanel from './templates/upgradeSuccessPanel.hbs';
+import upgradeSkippedPanel from './templates/upgradeSkippedPanel.hbs';
+
 /* globals onSetupWizardInitialized: true */
 onSetupWizardInitialized(function(wizard) {
 	var jenkins = wizard.jenkins; // wizard-provided jenkins api
 	var pluginManager = wizard.pluginManager;
 
-	var upgradePanel = require('./templates/upgradePanel.hbs');
-	var upgradeSuccessPanel = require('./templates/upgradeSuccessPanel.hbs');
-	var upgradeSkippedPanel = require('./templates/upgradeSkippedPanel.hbs');
 
 	wizard.addActions({
 		'.skip-recommended-plugins': function() {

war/src/main/js/util/behavior-shim.js

+function specify(selector, id, priority, behavior) {
+    // eslint-ignore-next-line
+    Behaviour.specify(selector, id, priority, behavior);
+};
 
-exports.specify = function(selector, id, priority, behavior) {
-    Behaviour.specify(selector, id, priority, behavior); // jshint ignore:line
-};
+export default { specify };
\ No newline at end of file

war/src/main/js/util/jenkinsLocalStorage.js

-var windowHandle = require('window-handle');
-var storage = require('./localStorage.js');
+import { getWindow } from 'window-handle';
+import storage from './localStorage'
 
 /** 
  * Store a Jenkins globally scoped value.
  */
-exports.setGlobalItem = function(name, value) {
+function setGlobalItem(name, value) {
     storage.setItem('jenkins:' + name, value);
-};
+}
 
 /** 
  * Get a Jenkins globally scoped value.
  */
-exports.getGlobalItem = function(name, defaultVal) {
+function getGlobalItem(name, defaultVal) {
     return storage.getItem('jenkins:' + name, defaultVal);
-};
+}
 
 /** 
  * Store a Jenkins page scoped value.
  */
-exports.setPageItem = function(name, value) {
-    name = 'jenkins:' + name + ':' + windowHandle.getWindow().location.href;
+function setPageItem(name, value) {
+    name = 'jenkins:' + name + ':' + getWindow().location.href;
     storage.setItem(name, value);
-};
+}
 
 /** 
  * Get a Jenkins page scoped value.
  */
-exports.getPageItem = function(name, defaultVal) {
-    name = 'jenkins:' + name + ':' + windowHandle.getWindow().location.href;
+function getPageItem(name, defaultVal) {
+    name = 'jenkins:' + name + ':' + getWindow().location.href;
     return storage.getItem(name, defaultVal);
-};
+}
\ No newline at end of file
+
+export default {
+    setGlobalItem,
+    getGlobalItem,
+    setPageItem,
+    getPageItem
+};

war/src/main/js/util/localStorage.js

-var windowHandle = require('window-handle');
-var win = windowHandle.getWindow();
-var storage = win.localStorage;
+import { getWindow } from 'window-handle';
 
-exports.setMock = function() {
+let storage = getWindow().localStorage;
+
+function setMock() {
     storage = {
         storage: {},
         setItem: function (name, value) {
@@ -15,26 +15,33 @@ exports.setMock = function() {
             delete this.storage[name];
         }
     };
-};
+}
 
-exports.setItem = function(name, value) {
+function setItem(name, value) {
     storage.setItem(name, value);
-};
+}
 
-exports.getItem = function(name, defaultVal) {
+function getItem(name, defaultVal) {
     var value = storage.getItem(name);
     if (!value) {
         value = defaultVal;
     }
     return  value;
-};
+}
 
-exports.removeItem = function(name) {
+function removeItem(name) {
     return storage.removeItem(name);
-};
+}
 
 if (typeof storage === "undefined") {
     console.warn('HTML5 localStorage not supported by this browser.');
     // mock it...
-    exports.setMock();
-}
+    setMock();
+}
\ No newline at end of file
+
+export default {
+    setMock,
+    setItem,
+    getItem,
+    removeItem,
+};

war/src/main/js/util/page.js

 import $ from 'jquery';
-import windowHandle from 'window-handle';
+import { getWindow } from 'window-handle';
 
 var timestamp = (new Date().getTime());
 var loadedClass = 'jenkins-loaded-' + timestamp;
@@ -13,7 +13,7 @@ var loadedClass = 'jenkins-loaded-' + timestamp;
  * callback must return a boolean value of true if scanning is to continue.
  * @param contextEl The jQuery selector context (optional).
  */
-export var onload =  function(selector, callback, contextEl) {
+function onload(selector, callback, contextEl) {
     function registerRescan() {
         setTimeout(scan, 50);
     }
@@ -29,32 +29,32 @@ export var onload =  function(selector, callback, contextEl) {
         }
     }
     scan();
-};
+}
 
-export var winScrollTop = function() {
-    var win = $(windowHandle.getWindow());
+function winScrollTop() {
+    var win = $(getWindow());
     return win.scrollTop();
-};
+}
 
-export var onWinScroll = function(callback) {
-    $(windowHandle.getWindow()).on('scroll', callback);
-};
+function onWinScroll(callback) {
+    $(getWindow()).on('scroll', callback);
+}
 
-export var pageHeaderHeight = function() {
+function pageHeaderHeight() {
     return elementHeight('#page-head');
-};
+}
 
-export var breadcrumbBarHeight = function() {
+function breadcrumbBarHeight() {
     return elementHeight('#breadcrumbBar');
-};
+}
 
-export var fireBottomStickerAdjustEvent = function() {
+function fireBottomStickerAdjustEvent() {
     Event.fire(window, 'jenkins:bottom-sticker-adjust'); // jshint ignore:line
-};
+}
 
 // YUI Drag widget does not like to work on elements with a relative position.
 // This tells the element to switch to static position at the start of the drag, so it can work.
-export var fixDragEvent = function(handle) {
+function fixDragEvent(handle) {
     var isReady = false;
     var $handle = $(handle);
     var $chunk = $handle.closest('.repeated-chunk');
@@ -70,16 +70,27 @@ export var fixDragEvent = function(handle) {
 	    isReady = false;
 	    $chunk.removeClass('dragging');
 	});
-};
+}
 
-export var removeTextHighlighting = function(selector) {
+function removeTextHighlighting(selector) {
     $('span.highlight-split', selector).each(function() {
         var highlightSplit = $(this);
         highlightSplit.before(highlightSplit.text());
         highlightSplit.remove();
     });
-};
+}
 
 function elementHeight(selector) {
     return $(selector).height();
-}
+}
\ No newline at end of file
+
+export default {
+    onload,
+    winScrollTop,
+    onWinScroll,
+    pageHeaderHeight,
+    breadcrumbBarHeight,
+    fireBottomStickerAdjustEvent,
+    fixDragEvent,
+    removeTextHighlighting
+}

war/src/main/js/widgets/config/model/ConfigRowGrouping.js

-var jQD = require('../../../util/jquery-ext.js');
-
-module.exports = ConfigRowGrouping;
+import { getJQuery } from '../../../util/jquery-ext';
 
 /*
  * =======================================================================================
  * Configuration table row grouping i.e. row-set-*, optional-block-*, radio-block-* etc
- * 
+ *
  * A ConfigSection maintains a list of ConfigRowGrouping and then ConfigRowGrouping
  * itself maintains a list i.e. it's hierarchical. See ConfigSection.gatherRowGroups().
  * =======================================================================================
@@ -65,7 +63,7 @@ ConfigRowGrouping.prototype.updateVisibility = function() {
  * the row-set rows should be made visible or not.
  */
 ConfigRowGrouping.prototype.findToggleWidget = function(row) {
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
     var input = $(':input.block-control', row);
     if (input.size() === 1) {
         this.toggleWidget = input;
@@ -73,3 +71,5 @@ ConfigRowGrouping.prototype.findToggleWidget = function(row) {
         input.addClass('disable-behavior');
     }
 };
+
+export default ConfigRowGrouping;

war/src/main/js/widgets/config/model/ConfigSection.js

-var jQD = require('../../../util/jquery-ext.js');
-var util = require('./util.js');
-var page = require('../../../util/page.js');
-var ConfigRowGrouping = require('./ConfigRowGrouping.js');
+import { getJQuery } from '../../../util/jquery-ext';
+import page from '../../../util/page.js';
+import { toId } from './util';
+import ConfigRowGrouping from './ConfigRowGrouping';
 var pageHeaderHeight = page.pageHeaderHeight();
 
-module.exports = ConfigSection;
-
 /*
  * =======================================================================================
  * Configuration table section.
@@ -15,7 +13,7 @@ function ConfigSection(headerRow, parentCMD) {
     this.headerRow = headerRow;
     this.parentCMD = parentCMD;
     this.title = headerRow.attr('title');
-    this.id = util.toId(this.title);
+    this.id = toId(this.title);
     this.rowGroups = undefined;
     this.activator = undefined;
     this.subSections = [];
@@ -149,7 +147,7 @@ ConfigSection.prototype.markRowsAsActive = function() {
 };
 
 ConfigSection.prototype.hasText = function(text) {
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
     var selector = ":containsci('" + text + "')";
     var sectionRows = this.getRows();
 
@@ -255,7 +253,7 @@ ConfigSection.prototype.getRowGroupLabels = function() {
 };
 
 ConfigSection.prototype.highlightText = function(text) {
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
     var selector = ":containsci('" + text + "')";
     var rows = this.getRows();
     
@@ -286,3 +284,5 @@ ConfigSection.prototype.highlightText = function(text) {
         this.subSections[i2].highlightText(text);
     }
 };
+
+export default ConfigSection;

war/src/main/js/widgets/config/model/ConfigTableMetaData.js

 /*
  * Internal support module for config tables.
  */
+import { getJQuery } from '../../../util/jquery-ext';
+import page from '../../../util/page';
+import ConfigSection from './ConfigSection';
+import { toId } from './util';
 
-var jQD = require('../../../util/jquery-ext.js');
-var ConfigSection = require('./ConfigSection.js');
-var page = require('../../../util/page.js');
-var util = require('./util.js');
-
-exports.markConfigTableParentForm = function(configTable) {
+function markConfigTableParentForm(configTable) {
     var form = configTable.closest('form');
     form.addClass('jenkins-config');
     return form;
-};
+}
 
-exports.findConfigTables = function() {
-    var $ = jQD.getJQuery();
+function findConfigTables() {
+    var $ = getJQuery();
     // The config tables are the immediate child <table> elements of <form> elements
     // with a name of "config"?
     return $('form[name="config"] > table');
-};
+}
 
-exports.fromConfigTable = function(configTable) {
-    var $ = jQD.getJQuery();
+function fromConfigTable(configTable) {
+    var $ = getJQuery();
     var sectionHeaders = $('.section-header', configTable);
-    var configForm = exports.markConfigTableParentForm(configTable);
+    var configForm = markConfigTableParentForm(configTable);
 
     // Mark the ancestor <tr>s of the section headers and add a title
     sectionHeaders.each(function () {
@@ -75,10 +74,10 @@ exports.fromConfigTable = function(configTable) {
 
     var buttonsRow = $('#bottom-sticker', configTable).closest('tr');
     buttonsRow.removeClass(curSection.id);
-    buttonsRow.addClass(util.toId('buttons'));
+    buttonsRow.addClass(toId('buttons'));
 
     return configTableMetadata;
-};
+}
 
 /*
  * =======================================================================================
@@ -86,7 +85,7 @@ exports.fromConfigTable = function(configTable) {
  * =======================================================================================
  */
 function ConfigTableMetaData(configForm, configTable) {
-    this.$ = jQD.getJQuery();
+    this.$ = getJQuery();
     this.configForm = configForm;
     this.configTable = configTable;
     this.configTableBody = this.$('> tbody', configTable);
@@ -110,13 +109,13 @@ ConfigTableMetaData.prototype.getFirstRow = function() {
 };
 
 ConfigTableMetaData.prototype.addWidgetsContainer = function() {
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
     this.configWidgets = $('<div class="jenkins-config-widgets"></div>');
     this.configWidgets.insertBefore(this.configForm);
 };
 
 ConfigTableMetaData.prototype.addFindWidget = function() {
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
     var thisTMD = this;
     var findWidget = $('<div class="find-container"><div class="find"><span title="Clear" class="clear">x</span><input placeholder="find"/></div></div>');
 
@@ -268,7 +267,7 @@ ConfigTableMetaData.prototype.showSection = function(section) {
 
 ConfigTableMetaData.prototype.hideSection = function() {
     var topRows = this.getTopRows();
-    var $ = jQD.getJQuery();
+    var $ = getJQuery();
 
     $('.config-section-activator.active', this.activatorContainer).removeClass('active');
     topRows.filter('.active').removeClass('active');
@@ -383,4 +382,10 @@ function isTestEnv() {
     }
     
     return false;
-}
+}
\ No newline at end of file
+
+export default {
+    markConfigTableParentForm,
+    findConfigTables,
+    fromConfigTable
+};

war/src/main/js/widgets/config/model/util.js

-
-exports.toId = function(string) {
+export function toId(string) {
     string = string.trim();
     return 'config_' + string.replace(/[\W_]+/g, '_').toLowerCase();
-};
+}
\ No newline at end of file

war/src/main/js/widgets/config/tabbar.js

 import $ from 'jquery';
-
-var page = require('../../util/page.js');
-var jenkinsLocalStorage = require('../../util/jenkinsLocalStorage.js');
-var tableMetadata = require('./model/ConfigTableMetaData.js');
-var behaviorShim = require('../../util/behavior-shim');
+import { getWindow } from 'window-handle';
+import page from '../../util/page';
+import tableMetadata from './model/ConfigTableMetaData';
+import behaviorShim from '../../util/behavior-shim';
+import jenkinsLocalStorage from '../../util/jenkinsLocalStorage';
 
 export var tabBarShowPreferenceKey = 'config:usetabs';
 
@@ -32,7 +32,7 @@ export var addPageTabs = function(configSelector, onEachConfigTable, options) {
 
                         tabBar.deactivator.click(function() {
                             jenkinsLocalStorage.setGlobalItem(tabBarShowPreferenceKey, "no");
-                            require('window-handle').getWindow().location.reload();
+                            getWindow().location.reload();
                         });
                     });
                 } else {
@@ -42,7 +42,7 @@ export var addPageTabs = function(configSelector, onEachConfigTable, options) {
                         tableMetadata.markConfigTableParentForm(configTable);
                         activator.click(function() {
                             jenkinsLocalStorage.setGlobalItem(tabBarShowPreferenceKey, "yes");
-                            require('window-handle').getWindow().location.reload();
+                            getWindow().location.reload();
                         });
                     });
                 }

war/src/test/js/pluginSetupWizard.spec.js

@@ -2,17 +2,28 @@ import jsTest from '@jenkins-cd/js-test';
 
 var debug = false;
 
+// Registers needed handlebars helpers that are loaded through webpack
+function registerHandlebars() {
+    // eslint-disable-next-line no-undef
+    const Handlebars = require('handlebars').default;
+    // eslint-disable-next-line no-undef
+    Handlebars.registerHelper('id', require('../../main/js/handlebars-helpers/id').default)
+}
+
 var getJQuery = function() {
+    // eslint-disable-next-line no-undef
     var $ = require('jquery');
     $.fx.off = true;
     return $;
 };
 
 var getJenkins = function() {
+    // eslint-disable-next-line no-undef
     return require('../../main/js/util/jenkins').default;
 }
 
 var getSetupWizardGui = function() {
+    // eslint-disable-next-line no-undef
     return require('../../main/js/pluginSetupWizardGui').default;
 }
 
@@ -212,9 +223,7 @@ describe("pluginSetupWizard.js", function () {
     let $body;
 
     beforeEach(() => {
-        // Registers needed handlebars helpers that are loaded through webpack
-        const Handlebars = require('handlebars').default;
-        Handlebars.registerHelper('id', require('../../main/js/handlebars-helpers/id').default)
+        registerHandlebars();
 
         // Create a new <body> tag for every test
         $ = getJQuery();

war/src/test/js/widgets/config/mocks.js

+import { getWindow } from 'window-handle';
+import localStorage from '../../../../main/js/util/localStorage';
+
 // mock the behaviors stuff.
-var behaviorShim = require('../../../../main/js/util/behavior-shim');
-behaviorShim.specify = function(selector, id, priority, behavior) {
-    behavior();
-};
+export function mockBehaviorShim() {
+    const mockActualBehaviorShim = jest.requireActual('../../../../main/js/util/behavior-shim');
 
-// Mock out the fireBottomStickerAdjustEvent function ... it accesses Event.
-var page = require('../../../../main/js/util/page');
-page.fireBottomStickerAdjustEvent = function() {};
+    jest.mock('../../../../main/js/util/behavior-shim', () => ({
+        __esModule: true,
+        default: {
+            ...mockActualBehaviorShim.default,
+            specify: jest.fn((selector, id, priority, behavior) => behavior())
+        }
+    }));
+}
+
+// Mock out the Event.fire function
+global.Event = { // eslint-disable-line no-undef
+    fire: jest.fn()
+};
 
-var windowHandle = require('window-handle');
-windowHandle.getWindow(function() {
-    var localStorage = require('../../../../main/js/util/localStorage');
+getWindow(function() {
     localStorage.setMock();
 });

war/src/test/js/widgets/config/scrollspy.spec.js

 import fs from 'fs';
 import path from 'path';
 import jsTest from '@jenkins-cd/js-test';
-import './mocks';
+import { mockBehaviorShim } from './mocks';
 
 const debug = false;
 
@@ -24,13 +24,20 @@ describe("scrollspy-spec tests", function () {
     );
 
     beforeEach(() => {
+        mockBehaviorShim();
+
         jest.mock('../../../../main/js/util/page', () => ({
+            __esModule: true,
             ...mockPageUtils,
-            winScrollTop: mockWinScrollTop,
-            onWinScroll: mockOnWinScroll,
+            default: {
+                ...mockPageUtils.default,
+                fireBottomStickerAdjustEvent: jest.fn(),
+                winScrollTop: mockWinScrollTop,
+                onWinScroll: mockOnWinScroll,
+            }
         }));
 
-        mockConfigSection.prototype.isVisible = jest.fn();
+        mockConfigSection.default.prototype.isVisible = jest.fn();
         jest.mock(
             '../../../../main/js/widgets/config/model/ConfigSection',
             () => mockConfigSection
@@ -65,12 +72,13 @@ describe("scrollspy-spec tests", function () {
 
     it("- test scrolling", function (done) {
         // Needs to return true for the tests
-        mockConfigSection.prototype.isVisible.mockReturnValue(true);
+        mockConfigSection.default.prototype.isVisible.mockReturnValue(true);
 
         jsTest.onPage(function () {
             document.documentElement.innerHTML = htmlContent;
 
             var manualScroller = newManualScroller();
+            // eslint-disable-next-line no-undef
             var tabbars = require('../../../../main/js/config-scrollspy');
             tabbars.setScrollspeed(1); // speed up the scroll speed for testing
 

war/src/test/js/widgets/config/tabbar.spec.js

@@ -2,7 +2,7 @@ import fs from 'fs';
 import path from 'path';
 import $ from 'jquery';
 import jsTest from '@jenkins-cd/js-test';
-import './mocks';
+import { mockBehaviorShim } from './mocks';
 
 const htmlConfigTabbedContent = fs.readFileSync(
     path.resolve(__dirname, './freestyle-config-tabbed.html'),
@@ -10,14 +10,41 @@ const htmlConfigTabbedContent = fs.readFileSync(
 );
 
 function getConfigTabbar() {
+    // eslint-disable-next-line no-undef
     return require('../../../../main/js/config-tabbar');
 }
 
 function getConfigTabbarWidget() {
+    // eslint-disable-next-line no-undef
     return require('../../../../main/js/widgets/config/tabbar');
 }
 
 describe("tabbar-spec tests", function () {
+    // Need to mock the utils/page module because we will hijack the scroll events
+    const mockPageUtils = jest.requireActual('../../../../main/js/util/page');
+
+    beforeEach(() => {
+        mockBehaviorShim();
+
+        jest.mock('../../../../main/js/util/page', () => ({
+            __esModule: true,
+            ...mockPageUtils,
+            default: {
+                ...mockPageUtils.default,
+                fireBottomStickerAdjustEvent: jest.fn(),
+            }
+        }));
+    });
+
+    afterEach(() => {
+        jest.resetAllMocks()
+    });
+
+    afterAll(() => {
+        // Should call resetModules on afterAll because the test "test section activation"
+        // will break if resetModules is called on afterEach.
+        jest.resetModules();
+    });
 
     it("- test section count", function (done) {
         jsTest.onPage(function() {
@@ -41,6 +68,7 @@ describe("tabbar-spec tests", function () {
         }, htmlConfigTabbedContent);
     });
 
+    // This test may be deterministic, as it breaks if jest.resetModules is called on afterEach
     it("- test section activation", function (done) {
         jsTest.onPage(function() {
             document.documentElement.innerHTML = htmlConfigTabbedContent;