darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-08-23 15:57:23 -04:00
Code Issues Packages Projects Releases Wiki Activity

More govuk cleanup

Browse Source
This commit is contained in:
alexjanousekGSA
2025-08-07 16:49:14 -04:00
parent a695412699
commit c6529ad453
22 changed files with 209 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/collapsibleCheckboxes.js
View File

@@ -220,6 +220,8 @@
this.summary.bindEvents(this); this.summary.bindEvents(this);
}; };
NotifyModules['collapsible-checkboxes'] = CollapsibleCheckboxes; NotifyModules['collapsible-checkboxes'] = function() {
return new CollapsibleCheckboxes();
};
}(window)); }(window));

5
app/assets/javascripts/enhancedTextbox.js
View File

@@ -11,8 +11,9 @@
window.NotifyModules['enhanced-textbox'] = function() { window.NotifyModules['enhanced-textbox'] = function() {
this.start = function(textarea) { this.start = function(element) {
let textarea = $(element);
let visibleTextbox; let visibleTextbox;
this.highlightPlaceholders = ( this.highlightPlaceholders = (
@@ -20,7 +21,7 @@
!!textarea.data('highlightPlaceholders') !!textarea.data('highlightPlaceholders')
); );
this.$textbox = $(textarea) this.$textbox = textarea
.wrap(` .wrap(`
<div class='textbox-highlight-wrapper' /> <div class='textbox-highlight-wrapper' />
`) `)

22
app/assets/javascripts/errorTracking.js
View File

@@ -3,17 +3,19 @@
window.NotifyModules['track-error'] = function() { window.NotifyModules['track-error'] = function() {
this.start = function(component) { this.start = function(element) {
var component = $(element);
// Analytics tracking removed - no longer using GOVUK analytics // Track error to analytics if available
// If analytics is needed, integrate with USWDS analytics or custom solution if (window.NotifyModules && window.NotifyModules.analytics && window.NotifyModules.analytics.trackEvent) {
console.log( window.NotifyModules.analytics.trackEvent(
'Error', 'Error',
$(component).data('error-type'), component.data('error-type'),
{ {
'label': $(component).data('error-label') 'label': component.data('error-label')
} }
); );
}
}; };

6
app/assets/javascripts/liveSearch.js
View File

@@ -61,10 +61,8 @@
// make sticky JS recalculate its cache of the element's position // make sticky JS recalculate its cache of the element's position
// because live search can change the height document // because live search can change the height document
if ('stickAtBottomWhenScrolling' in GOVUK) { if (window.NotifyModules && 'stickAtBottomWhenScrolling' in window.NotifyModules) {
if (window.NotifyModules && window.NotifyModules.stickAtBottomWhenScrolling) { window.NotifyModules.stickAtBottomWhenScrolling.recalculate();
window.NotifyModules.stickAtBottomWhenScrolling.recalculate();
}
} }
}; };

41
tests/javascripts/collapsibleCheckboxes.test.js
View File

@@ -75,7 +75,7 @@ describe('Collapsible fieldset', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -172,7 +172,7 @@ describe('Collapsible fieldset', () => {
test('has the right summary text when started with no checkboxes selected', () => { test('has the right summary text when started with no checkboxes selected', () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
const summaryText = document.querySelector('.selection-summary__text'); const summaryText = document.querySelector('.selection-summary__text');
@@ -189,7 +189,7 @@ describe('Collapsible fieldset', () => {
}); });
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
const summaryText = document.querySelector('.selection-summary__text'); const summaryText = document.querySelector('.selection-summary__text');
@@ -203,7 +203,7 @@ describe('Collapsible fieldset', () => {
checkboxes.forEach(el => el.setAttribute('checked', '')); checkboxes.forEach(el => el.setAttribute('checked', ''));
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
const summaryText = document.querySelector('.selection-summary__text'); const summaryText = document.querySelector('.selection-summary__text');
@@ -216,7 +216,7 @@ describe('Collapsible fieldset', () => {
wrapper.dataset.fieldLabel = 'team member'; wrapper.dataset.fieldLabel = 'team member';
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
const summaryText = document.querySelector('.selection-summary__text'); const summaryText = document.querySelector('.selection-summary__text');
@@ -229,7 +229,7 @@ describe('Collapsible fieldset', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
@@ -266,7 +266,7 @@ describe('Collapsible fieldset', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// show the checkboxes // show the checkboxes
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
@@ -308,7 +308,7 @@ describe('Collapsible fieldset', () => {
test("after the fieldset", () => { test("after the fieldset", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// show the checkboxes // show the checkboxes
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
@@ -326,7 +326,7 @@ describe('Collapsible fieldset', () => {
checkboxesContainer.querySelector('.usa-checkbox').appendChild(nestedCheckboxes); checkboxesContainer.querySelector('.usa-checkbox').appendChild(nestedCheckboxes);
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// show the checkboxes // show the checkboxes
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
@@ -342,10 +342,11 @@ describe('Collapsible fieldset', () => {
beforeEach(() => { beforeEach(() => {
// track calls to sticky JS // track calls to sticky JS
window.GOVUK.stickAtBottomWhenScrolling.recalculate = jest.fn(() => {}); window.NotifyModules.stickAtBottomWhenScrolling = window.NotifyModules.stickAtBottomWhenScrolling || {};
window.NotifyModules.stickAtBottomWhenScrolling.recalculate = jest.fn(() => {});
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// show the checkboxes // show the checkboxes
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
@@ -374,7 +375,7 @@ describe('Collapsible fieldset', () => {
describe("check/uncheck all functionality", () => { describe("check/uncheck all functionality", () => {
beforeEach(() => { beforeEach(() => {
window.GOVUK.modules.start(); window.NotifyModules.start();
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
}); });
@@ -434,7 +435,7 @@ describe('Collapsible fieldset', () => {
describe("toggle button visibility on re-expansion", () => { describe("toggle button visibility on re-expansion", () => {
test("shows toggle button again when fieldset is re-opened", () => { test("shows toggle button again when fieldset is re-opened", () => {
window.GOVUK.modules.start(); window.NotifyModules.start();
helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click'); helpers.triggerEvent(formGroup.querySelector('.selection-footer__button'), 'click');
const toggleButton = document.querySelector('.usa-button--small'); const toggleButton = document.querySelector('.usa-button--small');
@@ -487,7 +488,7 @@ describe('Collapsible fieldset', () => {
checkFirstCheckbox(); checkFirstCheckbox();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -507,7 +508,7 @@ describe('Collapsible fieldset', () => {
checkFirstCheckbox(); checkFirstCheckbox();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -527,7 +528,7 @@ describe('Collapsible fieldset', () => {
checkFirstCheckbox(); checkFirstCheckbox();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -551,7 +552,7 @@ describe('Collapsible fieldset', () => {
checkAllCheckboxes(); checkAllCheckboxes();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -571,7 +572,7 @@ describe('Collapsible fieldset', () => {
checkAllCheckboxes(); checkAllCheckboxes();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -595,7 +596,7 @@ describe('Collapsible fieldset', () => {
checkAllCheckboxesButTheLast(); checkAllCheckboxesButTheLast();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();
@@ -614,7 +615,7 @@ describe('Collapsible fieldset', () => {
checkAllCheckboxesButTheLast(); checkAllCheckboxesButTheLast();
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
showCheckboxes(); showCheckboxes();

20
tests/javascripts/copyToClipboard.test.js
View File

@@ -45,7 +45,7 @@ describe('copy to clipboard', () => {
document.execCommand = jest.fn(() => {}); document.execCommand = jest.fn(() => {});
// mock sticky JS // mock sticky JS
window.GOVUK.stickAtBottomWhenScrolling = { window.NotifyModules.stickAtBottomWhenScrolling = {
recalculate: jest.fn(() => {}) recalculate: jest.fn(() => {})
} }
@@ -63,7 +63,7 @@ describe('copy to clipboard', () => {
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(component.querySelector('button')).toBeNull(); expect(component.querySelector('button')).toBeNull();
@@ -120,7 +120,7 @@ describe('copy to clipboard', () => {
}); });
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -139,7 +139,7 @@ describe('copy to clipboard', () => {
test("It should tell any sticky JS present the page has changed", () => { test("It should tell any sticky JS present the page has changed", () => {
// recalculate forces the sticky JS to recalculate any stored DOM position/dimensions // recalculate forces the sticky JS to recalculate any stored DOM position/dimensions
expect(window.GOVUK.stickAtBottomWhenScrolling.recalculate).toHaveBeenCalled(); expect(window.NotifyModules.stickAtBottomWhenScrolling.recalculate).toHaveBeenCalled();
}); });
@@ -154,7 +154,7 @@ describe('copy to clipboard', () => {
expect(component.querySelector('.copy-to-clipboard__value').textContent).toBe('00000000-0000-0000-0000-000000000000'); expect(component.querySelector('.copy-to-clipboard__value').textContent).toBe('00000000-0000-0000-0000-000000000000');
}); });
}); });
@@ -169,7 +169,7 @@ describe('copy to clipboard', () => {
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -205,7 +205,7 @@ describe('copy to clipboard', () => {
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -233,7 +233,7 @@ describe('copy to clipboard', () => {
setUpDOM({ 'thing': 'Some Thing', 'name': 'Some Thing' }); setUpDOM({ 'thing': 'Some Thing', 'name': 'Some Thing' });
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');
keyEl = component.querySelector('.copy-to-clipboard__value'); keyEl = component.querySelector('.copy-to-clipboard__value');
@@ -332,7 +332,7 @@ describe('copy to clipboard', () => {
setUpDOM({ 'thing': 'ID', 'name': 'Default' }); setUpDOM({ 'thing': 'ID', 'name': 'Default' });
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');
@@ -375,7 +375,7 @@ describe('copy to clipboard', () => {
setUpDOM({ 'thing': 'Some Thing', 'name': 'Some Thing' }); setUpDOM({ 'thing': 'Some Thing', 'name': 'Some Thing' });
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
component = document.querySelector('[data-module=copy-to-clipboard]'); component = document.querySelector('[data-module=copy-to-clipboard]');

36
tests/javascripts/enhancedTextbox.test.js
View File

@@ -63,7 +63,7 @@ describe('Enhanced textbox', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -98,7 +98,7 @@ describe('Enhanced textbox', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -135,7 +135,7 @@ describe('Enhanced textbox', () => {
setDisplayPropertyOfFormGroups('none'); setDisplayPropertyOfFormGroups('none');
window.GOVUK.modules.start(); window.NotifyModules.start();
setDisplayPropertyOfFormGroups('block'); setDisplayPropertyOfFormGroups('block');
@@ -163,7 +163,7 @@ describe('Enhanced textbox', () => {
textarea.textContent = "Dear ((title)) ((name))"; textarea.textContent = "Dear ((title)) ((name))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -180,7 +180,7 @@ describe('Enhanced textbox', () => {
input.value = "Dear ((title)) ((name))"; input.value = "Dear ((title)) ((name))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;
@@ -198,7 +198,7 @@ describe('Enhanced textbox', () => {
textarea.setAttribute('data-highlight-placeholders', 'false') textarea.setAttribute('data-highlight-placeholders', 'false')
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -217,7 +217,7 @@ describe('Enhanced textbox', () => {
textarea.textContent = "When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance))"; textarea.textContent = "When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -234,7 +234,7 @@ describe('Enhanced textbox', () => {
input.value = "When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance))"; input.value = "When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;
@@ -270,7 +270,7 @@ describe('Enhanced textbox', () => {
`; `;
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -288,7 +288,7 @@ describe('Enhanced textbox', () => {
test("If a resize changes the textarea's width, the width of the element below should still match", () => { test("If a resize changes the textarea's width, the width of the element below should still match", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -310,7 +310,7 @@ describe('Enhanced textbox', () => {
textarea.textContent = "Dear ((title)) ((name))"; textarea.textContent = "Dear ((title)) ((name))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -330,7 +330,7 @@ describe('Enhanced textbox', () => {
input.value = "Hospital appointment for ((name))"; input.value = "Hospital appointment for ((name))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;
@@ -355,7 +355,7 @@ describe('Enhanced textbox', () => {
textarea.textContent = "Dear ((title)) ((name))"; textarea.textContent = "Dear ((title)) ((name))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -378,7 +378,7 @@ describe('Enhanced textbox', () => {
input.value = "Hospital appointment"; input.value = "Hospital appointment";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;
@@ -405,7 +405,7 @@ describe('Enhanced textbox', () => {
Ref: ((reference))`; Ref: ((reference))`;
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -426,7 +426,7 @@ describe('Enhanced textbox', () => {
input.value = "Hospital appointment for ((name)), ref: ((reference))"; input.value = "Hospital appointment for ((name)), ref: ((reference))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;
@@ -453,7 +453,7 @@ describe('Enhanced textbox', () => {
Your appointment will be on ((date)). When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance)).`; Your appointment will be on ((date)). When you arrive, please go to the ((weekday??main entrance))((weekend??side entrance)).`;
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = textarea.nextElementSibling; backgroundEl = textarea.nextElementSibling;
@@ -482,7 +482,7 @@ describe('Enhanced textbox', () => {
input.value = "Hospital appointment for ((name))((important?? - IMPORTANT))"; input.value = "Hospital appointment for ((name))((important?? - IMPORTANT))";
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
backgroundEl = input.nextElementSibling; backgroundEl = input.nextElementSibling;

4
tests/javascripts/errorBanner.test.js
View File

@@ -16,7 +16,7 @@ describe("Error Banner", () => {
document.body.innerHTML = ` document.body.innerHTML = `
<span class="usa-error-message banner-dangerous js-error-visible"> <span class="usa-error-message banner-dangerous js-error-visible">
</span>`; </span>`;
window.GOVUK.ErrorBanner.hideBanner(); window.NotifyModules.ErrorBanner.hideBanner();
expect(document.querySelector('.banner-dangerous').classList).toContain('display-none') expect(document.querySelector('.banner-dangerous').classList).toContain('display-none')
}); });
}); });
@@ -27,7 +27,7 @@ describe("Error Banner", () => {
<span class="usa-error-message banner-dangerous js-error-visible display-none"> <span class="usa-error-message banner-dangerous js-error-visible display-none">
</span>`; </span>`;
window.GOVUK.ErrorBanner.showBanner('Some Err'); window.NotifyModules.ErrorBanner.showBanner('Some Err');
}); });
test("Will show the element", () => { test("Will show the element", () => {

12
tests/javascripts/errorTracking.test.js
View File

@@ -18,21 +18,21 @@ describe('Error tracking', () => {
afterEach(() => { afterEach(() => {
document.body.innerHTML = ''; document.body.innerHTML = '';
delete window.GOVUK.analytics; delete window.NotifyModules.analytics;
}); });
test("If there is an analytics tracker set up, it should send details of the error to window.GOVUK.analytic", () => { test("If there is an analytics tracker set up, it should send details of the error to window.NotifyModules.analytic", () => {
window.GOVUK.analytics = { window.NotifyModules.analytics = {
'trackEvent': jest.fn() 'trackEvent': jest.fn()
}; };
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(window.GOVUK.analytics.trackEvent).toHaveBeenCalled(); expect(window.NotifyModules.analytics.trackEvent).toHaveBeenCalled();
expect(window.GOVUK.analytics.trackEvent.mock.calls[0]).toEqual(['Error', 'validation', { expect(window.NotifyModules.analytics.trackEvent.mock.calls[0]).toEqual(['Error', 'validation', {
'label': 'missing field' 'label': 'missing field'
}]); }]);

6
tests/javascripts/fileUpload.test.js
View File

@@ -44,7 +44,7 @@ describe('File upload', () => {
form.reset = jest.fn(() => {}); form.reset = jest.fn(() => {});
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
helpers.triggerEvent(window, 'pageshow'); helpers.triggerEvent(window, 'pageshow');
@@ -59,7 +59,7 @@ describe('File upload', () => {
form.submit = jest.fn(() => {}); form.submit = jest.fn(() => {});
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
helpers.triggerEvent(uploadControl, 'change', { eventInit: { bubbles: true } }); helpers.triggerEvent(uploadControl, 'change', { eventInit: { bubbles: true } });
@@ -96,7 +96,7 @@ describe('File upload "upload-trigger" click handler', () => {
form = document.querySelector('form'); form = document.querySelector('form');
// Register the module // Register the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
afterEach(() => { afterEach(() => {

16
tests/javascripts/fullscreenTable.test.js
View File

@@ -121,7 +121,7 @@ describe('FullscreenTable', () => {
test("it fixes the number column for each row without changing the semantics", () => { test("it fixes the number column for each row without changing the semantics", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
tableFrame = document.querySelector('.fullscreen-scrollable-table'); tableFrame = document.querySelector('.fullscreen-scrollable-table');
numberColumnFrame = document.querySelector('.fullscreen-fixed-table'); numberColumnFrame = document.querySelector('.fullscreen-fixed-table');
@@ -134,10 +134,10 @@ describe('FullscreenTable', () => {
test("it calls the sticky JS to update any cached dimensions", () => { test("it calls the sticky JS to update any cached dimensions", () => {
const stickyJSSpy = jest.spyOn(window.GOVUK.stickAtBottomWhenScrolling, 'recalculate'); const stickyJSSpy = jest.spyOn(window.NotifyModules.stickAtBottomWhenScrolling, 'recalculate');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(stickyJSSpy.mock.calls.length).toBe(1); expect(stickyJSSpy.mock.calls.length).toBe(1);
@@ -148,7 +148,7 @@ describe('FullscreenTable', () => {
test("the scrolling section is focusable and has an accessible name matching the table caption", () => { test("the scrolling section is focusable and has an accessible name matching the table caption", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
tableFrame = document.querySelector('.fullscreen-scrollable-table'); tableFrame = document.querySelector('.fullscreen-scrollable-table');
caption = tableFrame.querySelector('caption'); caption = tableFrame.querySelector('caption');
@@ -163,7 +163,7 @@ describe('FullscreenTable', () => {
test("the section providing the fixed row headers is not focusable and is hidden from assistive tech'", () => { test("the section providing the fixed row headers is not focusable and is hidden from assistive tech'", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
fixedRowHeaders = document.querySelector('.fullscreen-fixed-table'); fixedRowHeaders = document.querySelector('.fullscreen-fixed-table');
@@ -194,7 +194,7 @@ describe('FullscreenTable', () => {
}); });
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
tableFrame = document.querySelector('.fullscreen-scrollable-table'); tableFrame = document.querySelector('.fullscreen-scrollable-table');
numberColumnFrame = document.querySelector('.fullscreen-fixed-table'); numberColumnFrame = document.querySelector('.fullscreen-fixed-table');
@@ -254,7 +254,7 @@ describe('FullscreenTable', () => {
rowNumberColumnCell.setAttribute('style', 'width: 40px'); rowNumberColumnCell.setAttribute('style', 'width: 40px');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
tableFrame = document.querySelector('.fullscreen-scrollable-table'); tableFrame = document.querySelector('.fullscreen-scrollable-table');
numberColumnFrame = document.querySelector('.fullscreen-fixed-table'); numberColumnFrame = document.querySelector('.fullscreen-fixed-table');
@@ -301,7 +301,7 @@ describe('FullscreenTable', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
tableFrame = document.querySelector('.fullscreen-scrollable-table'); tableFrame = document.querySelector('.fullscreen-scrollable-table');
table = tableFrame.querySelector('table'); table = tableFrame.querySelector('table');

32
tests/javascripts/listEntry.test.js
View File

@@ -88,7 +88,7 @@ describe("List entry", () => {
test("Should remove all the fields except the first 2 if no values are present", () => { test("Should remove all the fields except the first 2 if no values are present", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(inputList.querySelectorAll('.list-entry').length).toEqual(2); expect(inputList.querySelectorAll('.list-entry').length).toEqual(2);
@@ -102,7 +102,7 @@ describe("List entry", () => {
fields[0].setAttribute('value', domains[0]); fields[0].setAttribute('value', domains[0]);
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// re-select fields, based on updated DOM // re-select fields, based on updated DOM
fields = inputList.querySelectorAll('.list-entry input[type=text]'); fields = inputList.querySelectorAll('.list-entry input[type=text]');
@@ -120,7 +120,7 @@ describe("List entry", () => {
fields[1].setAttribute('value', domains[1]); fields[1].setAttribute('value', domains[1]);
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// re-select fields, based on updated DOM // re-select fields, based on updated DOM
fields = inputList.querySelectorAll('.list-entry input[type=text]'); fields = inputList.querySelectorAll('.list-entry input[type=text]');
@@ -138,7 +138,7 @@ describe("List entry", () => {
fourDomains.forEach((domain, idx) => { fields[idx].setAttribute('value', domain) }); fourDomains.forEach((domain, idx) => { fields[idx].setAttribute('value', domain) });
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// re-select fields, based on updated DOM // re-select fields, based on updated DOM
fields = inputList.querySelectorAll('.list-entry input[type=text]'); fields = inputList.querySelectorAll('.list-entry input[type=text]');
@@ -154,7 +154,7 @@ describe("List entry", () => {
test("Should add 'remove' buttons to all fields except the first", () => { test("Should add 'remove' buttons to all fields except the first", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
inputList.querySelectorAll('.list-entry').forEach((listEntry, idx) => { inputList.querySelectorAll('.list-entry').forEach((listEntry, idx) => {
@@ -171,7 +171,7 @@ describe("List entry", () => {
test("Should add an 'add feature' button to the bottom of the list", () => { test("Should add an 'add feature' button to the bottom of the list", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
const listItems = inputList.children; const listItems = inputList.children;
@@ -192,7 +192,7 @@ describe("List entry", () => {
}); });
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// re-select fields, based on updated DOM // re-select fields, based on updated DOM
fields = inputList.querySelectorAll('.list-entry input[type=text]').forEach((field, idx) => { fields = inputList.querySelectorAll('.list-entry input[type=text]').forEach((field, idx) => {
@@ -214,7 +214,7 @@ describe("List entry", () => {
}); });
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// re-select fields, based on updated DOM // re-select fields, based on updated DOM
fields = inputList.querySelectorAll('.list-entry input[type=text]'); fields = inputList.querySelectorAll('.list-entry input[type=text]');
@@ -230,7 +230,7 @@ describe("List entry", () => {
setFieldValues(10); setFieldValues(10);
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
test("Should remove the associated field", () => { test("Should remove the associated field", () => {
@@ -307,7 +307,7 @@ describe("List entry", () => {
test("Should add a new field", () => { test("Should add a new field", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
triggerEvent(inputList.querySelector('.input-list__button--add'), 'click'); triggerEvent(inputList.querySelector('.input-list__button--add'), 'click');
@@ -318,7 +318,7 @@ describe("List entry", () => {
test("Should update the number of fields users are allowed to enter if one is removed", () => { test("Should update the number of fields users are allowed to enter if one is removed", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
triggerEvent(inputList.querySelectorAll('.input-list__button--remove')[0], 'click'); triggerEvent(inputList.querySelectorAll('.input-list__button--remove')[0], 'click');
@@ -329,7 +329,7 @@ describe("List entry", () => {
test("Should update the number of fields users are allowed to enter if one is added", () => { test("Should update the number of fields users are allowed to enter if one is added", () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
triggerEvent(inputList.querySelector('.input-list__button--add'), 'click'); triggerEvent(inputList.querySelector('.input-list__button--add'), 'click');
@@ -342,7 +342,7 @@ describe("List entry", () => {
setFieldValues(9); setFieldValues(9);
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
triggerEvent(inputList.querySelector('.input-list__button--add'), 'click'); triggerEvent(inputList.querySelector('.input-list__button--add'), 'click');
@@ -364,7 +364,7 @@ describe("List entry", () => {
inputList = document.querySelector('.input-list'); inputList = document.querySelector('.input-list');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// Check that it handles missing classes gracefully // Check that it handles missing classes gracefully
const newInput = inputList.querySelector('.list-entry input'); const newInput = inputList.querySelector('.list-entry input');
@@ -381,7 +381,7 @@ describe("List entry", () => {
// This should not throw an error // This should not throw an error
expect(() => { expect(() => {
window.GOVUK.modules.start(); window.NotifyModules.start();
}).not.toThrow(); }).not.toThrow();
}); });
}); });
@@ -402,7 +402,7 @@ describe("List entry", () => {
inputList = document.querySelector('.input-list'); inputList = document.querySelector('.input-list');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
// After module starts, check that IDs are generated correctly // After module starts, check that IDs are generated correctly
// The module will have regenerated the DOM // The module will have regenerated the DOM

16
tests/javascripts/liveSearch.test.js
View File

@@ -132,7 +132,7 @@ describe('Live search', () => {
test("If there is no search term, the results should be unchanged", () => { test("If there is no search term, the results should be unchanged", () => {
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
const listItems = list.querySelectorAll('.user-list-item'); const listItems = list.querySelectorAll('.user-list-item');
const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden')); const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden'));
@@ -147,7 +147,7 @@ describe('Live search', () => {
searchTextbox.value = 'admin'; searchTextbox.value = 'admin';
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
const listItems = list.querySelectorAll('.user-list-item'); const listItems = list.querySelectorAll('.user-list-item');
const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden')); const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden'));
@@ -163,7 +163,7 @@ describe('Live search', () => {
searchTextbox.value = 'Administrator (admin@nhs.uk)'; searchTextbox.value = 'Administrator (admin@nhs.uk)';
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
const listItems = list.querySelectorAll('.user-list-item'); const listItems = list.querySelectorAll('.user-list-item');
const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden')); const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden'));
@@ -179,7 +179,7 @@ describe('Live search', () => {
searchTextbox.value = "Add and edit templates"; searchTextbox.value = "Add and edit templates";
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
const listItems = list.querySelectorAll('.user-list-item'); const listItems = list.querySelectorAll('.user-list-item');
const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden')); const listItemsShowing = Array.from(listItems).filter(item => !item.classList.contains('js-hidden'));
@@ -200,7 +200,7 @@ describe('Live search', () => {
searchTextbox.value = 'Admin'; searchTextbox.value = 'Admin';
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
// simulate input of new search text // simulate input of new search text
searchTextbox.value = ''; searchTextbox.value = '';
@@ -218,7 +218,7 @@ describe('Live search', () => {
searchTextbox.value = 'Admin'; searchTextbox.value = 'Admin';
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
// simulate input of new search text // simulate input of new search text
searchTextbox.value = 'Administrator'; searchTextbox.value = 'Administrator';
@@ -237,7 +237,7 @@ describe('Live search', () => {
searchTextbox.value = 'Admin'; searchTextbox.value = 'Admin';
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
// simulate input of new search text // simulate input of new search text
searchTextbox.value = 'Administrator (admin@nhs.uk)'; searchTextbox.value = 'Administrator (admin@nhs.uk)';
@@ -256,7 +256,7 @@ describe('Live search', () => {
searchTextbox.value = "Admin"; searchTextbox.value = "Admin";
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
// simulate input of new search text // simulate input of new search text
searchTextbox.value = 'Add and edit templates'; searchTextbox.value = 'Add and edit templates';

2
tests/javascripts/loginAlert.test.js
View File

@@ -13,7 +13,7 @@ beforeAll(() => {
` `
const sessionTimerModule = require('../../app/assets/javascripts/loginAlert.js'); const sessionTimerModule = require('../../app/assets/javascripts/loginAlert.js');
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
jest.useFakeTimers(); jest.useFakeTimers();

12
tests/javascripts/radioSelect.test.js
View File

@@ -127,7 +127,7 @@ describe('RadioSelect', () => {
// default is for it to be set to true // default is for it to be set to true
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(document.querySelectorAll('.radio-select__column').length).toEqual(2); expect(document.querySelectorAll('.radio-select__column').length).toEqual(2);
@@ -138,7 +138,7 @@ describe('RadioSelect', () => {
document.querySelector('.radio-select').setAttribute('data-show-now-as-default', 'false'); document.querySelector('.radio-select').setAttribute('data-show-now-as-default', 'false');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(document.querySelectorAll('.radio-select__column').length).toEqual(1); expect(document.querySelectorAll('.radio-select__column').length).toEqual(1);
@@ -153,7 +153,7 @@ describe('RadioSelect', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
categoryButtons = document.querySelectorAll('.radio-select__column:nth-child(2) .radio-select__button--category'); categoryButtons = document.querySelectorAll('.radio-select__column:nth-child(2) .radio-select__button--category');
@@ -201,7 +201,7 @@ describe('RadioSelect', () => {
originalOptionsForCategory = originalOptionsForAllCategories.filter(option => categoryRegExp.test(option.label)); originalOptionsForCategory = originalOptionsForAllCategories.filter(option => categoryRegExp.test(option.label));
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
clickButtonForCategory(category); clickButtonForCategory(category);
@@ -236,7 +236,7 @@ describe('RadioSelect', () => {
test(`clicking the button for a category should add a 'Done' button below its options`, () => { test(`clicking the button for a category should add a 'Done' button below its options`, () => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
clickButtonForCategory(CATEGORIES[0]); clickButtonForCategory(CATEGORIES[0]);
@@ -255,7 +255,7 @@ describe('RadioSelect', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
clickButtonForCategory(CATEGORIES[0]); clickButtonForCategory(CATEGORIES[0]);

64
tests/javascripts/stick-to-window-when-scrolling.test.js
View File

@@ -140,7 +140,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
document.body.innerHTML = ''; document.body.innerHTML = '';
window.GOVUK.stickAtTopWhenScrolling.clearEvents(); window.NotifyModules.stickAtTopWhenScrolling.clearEvents();
screenMock.reset(); screenMock.reset();
@@ -150,7 +150,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll position defaults to 0, element top defaults to 138px // scroll position defaults to 0, element top defaults to 138px
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
expect(inputForm.classList.contains('content-fixed-onload')).toBe(false); expect(inputForm.classList.contains('content-fixed-onload')).toBe(false);
expect(inputForm.classList.contains('content-fixed')).toBe(false); expect(inputForm.classList.contains('content-fixed')).toBe(false);
@@ -167,7 +167,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past top of form // scroll past top of form
screenMock.scrollTo(inputForm.offsetTop + 10); screenMock.scrollTo(inputForm.offsetTop + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
expect(inputForm.classList.contains('content-fixed')).toBe(false); expect(inputForm.classList.contains('content-fixed')).toBe(false);
expect(inputForm.classList.contains('content-fixed-onload')).toBe(false); // check the class for onload isn't applied expect(inputForm.classList.contains('content-fixed-onload')).toBe(false); // check the class for onload isn't applied
@@ -181,7 +181,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past the top of the form // scroll past the top of the form
screenMock.scrollTo(inputForm.offsetTop + 10); screenMock.scrollTo(inputForm.offsetTop + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -215,7 +215,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past the furthest point // scroll past the furthest point
screenMock.scrollTo(furthestTopPoint + 10); screenMock.scrollTo(furthestTopPoint + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
// `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction // `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction
expect(inputForm.classList.contains('content-fixed-onload')).toBe(true); expect(inputForm.classList.contains('content-fixed-onload')).toBe(true);
@@ -232,7 +232,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
beforeEach(() => { beforeEach(() => {
// default scroll position is above top of form // default scroll position is above top of form
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -275,7 +275,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past top of form // scroll past top of form
screenMock.scrollTo(inputForm.offsetTop + 10); screenMock.scrollTo(inputForm.offsetTop + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -315,7 +315,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// move the sticky over the link. It's 168px high so this position will cause it to overlap. // move the sticky over the link. It's 168px high so this position will cause it to overlap.
screenMock.scrollTo(link.offsetTop - 140); screenMock.scrollTo(link.offsetTop - 140);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -336,7 +336,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
expect(stickyPosition.top).toBeLessThanOrEqual(link.offsetTop); expect(stickyPosition.top).toBeLessThanOrEqual(link.offsetTop);
expect(stickyPosition.bottom).toBeGreaterThanOrEqual(linkBottom); expect(stickyPosition.bottom).toBeGreaterThanOrEqual(linkBottom);
window.GOVUK.stickAtTopWhenScrolling.scrollToRevealElement(link); window.NotifyModules.stickAtTopWhenScrolling.scrollToRevealElement(link);
stickyPosition = getStickyGroupPosition(screenMock, { stickyEls: [inputForm], edge: 'top' }); stickyPosition = getStickyGroupPosition(screenMock, { stickyEls: [inputForm], edge: 'top' });
@@ -370,7 +370,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// move the sticky over the checkbox. It's 168px high so this position will cause it to overlap. // move the sticky over the checkbox. It's 168px high so this position will cause it to overlap.
screenMock.scrollTo(checkbox.offsetTop - 10); screenMock.scrollTo(checkbox.offsetTop - 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -439,7 +439,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// update inputForm position as DOM normally would // update inputForm position as DOM normally would
inputForm.offsetTop = screenMock.window.top; inputForm.offsetTop = screenMock.window.top;
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -522,7 +522,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
const inputFormBottom = getScreenItemBottomPosition(inputForm); const inputFormBottom = getScreenItemBottomPosition(inputForm);
// set mode to 'dialog' so sticky elements are treated as one item // set mode to 'dialog' so sticky elements are treated as one item
window.GOVUK.stickAtTopWhenScrolling.setMode('dialog') window.NotifyModules.stickAtTopWhenScrolling.setMode('dialog')
// add another sticky element before the form footer // add another sticky element before the form footer
radios = helpers.getRadioGroup({ radios = helpers.getRadioGroup({
@@ -567,7 +567,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
afterEach(() => { afterEach(() => {
window.GOVUK.stickAtTopWhenScrolling.setMode('default'); window.NotifyModules.stickAtTopWhenScrolling.setMode('default');
}); });
@@ -578,7 +578,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past top of first sticky element // scroll past top of first sticky element
screenMock.scrollTo(inputForm.offsetTop + 10); screenMock.scrollTo(inputForm.offsetTop + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -623,7 +623,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past top of first sticky element // scroll past top of first sticky element
screenMock.scrollTo(furthestTopPoint + 10); screenMock.scrollTo(furthestTopPoint + 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
}); });
@@ -684,7 +684,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
screenMock.scrollTo(inputForm.offsetTop + 10); screenMock.scrollTo(inputForm.offsetTop + 10);
window.GOVUK.stickAtTopWhenScrolling.init() window.NotifyModules.stickAtTopWhenScrolling.init()
}); });
@@ -804,7 +804,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
afterEach(() => { afterEach(() => {
window.GOVUK.stickAtBottomWhenScrolling.clearEvents(); window.NotifyModules.stickAtBottomWhenScrolling.clearEvents();
}); });
@@ -815,7 +815,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll so the bottom of the window goes past the bottom of the element // scroll so the bottom of the window goes past the bottom of the element
screenMock.scrollTo((pageFooterBottom - windowHeight) + 10); screenMock.scrollTo((pageFooterBottom - windowHeight) + 10);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
// `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction // `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction
expect(pageFooter.classList.contains('content-fixed-onload')).toBe(false); expect(pageFooter.classList.contains('content-fixed-onload')).toBe(false);
@@ -835,7 +835,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll past top of form // scroll past top of form
screenMock.scrollTo(pageFooterBottom - 10); screenMock.scrollTo(pageFooterBottom - 10);
window.GOVUK.stickAtTopWhenScrolling.init(); window.NotifyModules.stickAtTopWhenScrolling.init();
expect(pageFooter.classList.contains('content-fixed')).toBe(false); expect(pageFooter.classList.contains('content-fixed')).toBe(false);
expect(pageFooter.classList.contains('content-fixed-onload')).toBe(false); // check the class for onload isn't applied expect(pageFooter.classList.contains('content-fixed-onload')).toBe(false); // check the class for onload isn't applied
@@ -847,7 +847,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
beforeEach(() => { beforeEach(() => {
// scroll position defaults to 0 so bottom of window starts at 940px. Element bottom defaults to 1160px. // scroll position defaults to 0 so bottom of window starts at 940px. Element bottom defaults to 1160px.
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -883,7 +883,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll the window bottom past the furthest point // scroll the window bottom past the furthest point
screenMock.scrollTo((furthestBottomPoint - windowHeight) - 10); screenMock.scrollTo((furthestBottomPoint - windowHeight) - 10);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
// `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction // `.content-fixed-onload` adds the drop-shadow without fading in to show it did not become sticky from user interaction
expect(pageFooter.classList.contains('content-fixed-onload')).toBe(true); expect(pageFooter.classList.contains('content-fixed-onload')).toBe(true);
@@ -911,7 +911,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll to just below the element // scroll to just below the element
screenMock.scrollTo((pageFooterBottom - windowHeight) + 10); screenMock.scrollTo((pageFooterBottom - windowHeight) + 10);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -982,7 +982,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// move the sticky over the link. It's 50px high so this position will cause it to overlap. // move the sticky over the link. It's 50px high so this position will cause it to overlap.
screenMock.scrollTo((linkBottom - windowHeight) + 5); screenMock.scrollTo((linkBottom - windowHeight) + 5);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -1003,7 +1003,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
expect(stickyPosition.top).toBeLessThanOrEqual(link.offsetTop); expect(stickyPosition.top).toBeLessThanOrEqual(link.offsetTop);
expect(stickyPosition.bottom).toBeGreaterThanOrEqual(linkBottom); expect(stickyPosition.bottom).toBeGreaterThanOrEqual(linkBottom);
window.GOVUK.stickAtBottomWhenScrolling.scrollToRevealElement(link) window.NotifyModules.stickAtBottomWhenScrolling.scrollToRevealElement(link)
stickyPosition = getStickyGroupPosition(screenMock, { stickyEls: [pageFooter], edge: 'bottom' }); stickyPosition = getStickyGroupPosition(screenMock, { stickyEls: [pageFooter], edge: 'bottom' });
@@ -1031,7 +1031,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
offsetTop: pageFooter.offsetTop offsetTop: pageFooter.offsetTop
}; };
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
// add mock for shim // add mock for shim
pageFooterShim = document.querySelector('.shim'); pageFooterShim = document.querySelector('.shim');
@@ -1103,7 +1103,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// move the sticky over the checkbox. It's 50px high so this position will cause it to overlap. // move the sticky over the checkbox. It's 50px high so this position will cause it to overlap.
screenMock.scrollTo((checkboxBottom - windowHeight) + 5); screenMock.scrollTo((checkboxBottom - windowHeight) + 5);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -1171,7 +1171,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// update content position as DOM normally would // update content position as DOM normally would
pageFooter.offsetTop = screenMock.window.bottom - pageFooter.offsetHeight; pageFooter.offsetTop = screenMock.window.bottom - pageFooter.offsetHeight;
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -1251,7 +1251,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
const contentBottom = getScreenItemBottomPosition(content); const contentBottom = getScreenItemBottomPosition(content);
// set mode to 'dialog' so sticky elements are treated as one item // set mode to 'dialog' so sticky elements are treated as one item
window.GOVUK.stickAtBottomWhenScrolling.setMode('dialog') window.NotifyModules.stickAtBottomWhenScrolling.setMode('dialog')
// add another sticky element before the form footer // add another sticky element before the form footer
radios = helpers.getRadioGroup({ radios = helpers.getRadioGroup({
@@ -1294,7 +1294,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
afterEach(() => { afterEach(() => {
window.GOVUK.stickAtBottomWhenScrolling.setMode('default'); window.NotifyModules.stickAtBottomWhenScrolling.setMode('default');
}); });
@@ -1309,7 +1309,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
// scroll to just above the element // scroll to just above the element
screenMock.scrollTo((pageFooterBottom - windowHeight) - 10); screenMock.scrollTo((pageFooterBottom - windowHeight) - 10);
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -1352,7 +1352,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
screenMock.scrollTo((furthestBottomPoint - windowHeight) - 10) screenMock.scrollTo((furthestBottomPoint - windowHeight) - 10)
window.GOVUK.stickAtBottomWhenScrolling.init(); window.NotifyModules.stickAtBottomWhenScrolling.init();
}); });
@@ -1414,7 +1414,7 @@ describe("Stick to top/bottom of window when scrolling", () => {
screenMock.scrollTo((pageFooterBottom - windowHeight) - 10); screenMock.scrollTo((pageFooterBottom - windowHeight) - 10);
window.GOVUK.stickAtBottomWhenScrolling.init() window.NotifyModules.stickAtBottomWhenScrolling.init()
}); });

18
tests/javascripts/support/jest.setup.js
View File

@@ -11,4 +11,20 @@ global.io = jest.fn().mockReturnValue({
}); });
// Load module code // Load module code
require('govuk_frontend_toolkit/javascripts/govuk/modules.js'); global.window = global.window || {};
global.window.NotifyModules = global.window.NotifyModules || {};
global.window.NotifyModules.start = function() {
var modules = document.querySelectorAll('[data-module]');
modules.forEach(function(element) {
var moduleName = element.getAttribute('data-module');
var moduleStarted = element.getAttribute('data-module-started');
if (!moduleStarted && global.window.NotifyModules[moduleName]) {
var module = new global.window.NotifyModules[moduleName]();
if (module.start) {
module.start(element);
}
element.setAttribute('data-module-started', 'true');
}
});
};

3
tests/javascripts/support/setup.js
View File

@@ -8,4 +8,5 @@ require('./polyfills.js');
global.$ = global.jQuery = require('jquery'); global.$ = global.jQuery = require('jquery');
// Bring in the GOV.UK modules system // Bring in the GOV.UK modules system
require('govuk_frontend_toolkit/javascripts/govuk/modules.js'); // Removing - now using NotifyModules instead
// require('govuk_frontend_toolkit/javascripts/govuk/modules.js');

22
tests/javascripts/templateFolderForm.test.js
View File

@@ -132,8 +132,8 @@ function setFixtures (hierarchy, newTemplateDataModules = "") {
function resetStickyMocks () { function resetStickyMocks () {
GOVUK.stickAtBottomWhenScrolling.recalculate.mockClear(); window.NotifyModules.stickAtBottomWhenScrolling.recalculate.mockClear();
GOVUK.stickAtBottomWhenScrolling.setMode.mockClear(); window.NotifyModules.stickAtBottomWhenScrolling.setMode.mockClear();
}; };
@@ -192,7 +192,7 @@ describe('TemplateFolderForm', () => {
beforeAll(() => { beforeAll(() => {
// stub out calls to sticky JS // stub out calls to sticky JS
GOVUK.stickAtBottomWhenScrolling = { window.NotifyModules.stickAtBottomWhenScrolling = {
setMode: jest.fn(), setMode: jest.fn(),
recalculate: jest.fn() recalculate: jest.fn()
}; };
@@ -201,7 +201,7 @@ describe('TemplateFolderForm', () => {
afterAll(() => { afterAll(() => {
GOVUK.stickAtBottomWhenScrolling = undefined; window.NotifyModules.stickAtBottomWhenScrolling = undefined;
}); });
@@ -252,7 +252,7 @@ describe('TemplateFolderForm', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
formControls = templateFolderForm.querySelector('#sticky_template_forms'); formControls = templateFolderForm.querySelector('#sticky_template_forms');
visibleCounter = getVisibleCounter(); visibleCounter = getVisibleCounter();
@@ -307,7 +307,7 @@ describe('TemplateFolderForm', () => {
templateFolderForm = document.querySelector('form[data-module=template-folder-form]'); templateFolderForm = document.querySelector('form[data-module=template-folder-form]');
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
formControls = templateFolderForm.querySelector('#sticky_template_forms'); formControls = templateFolderForm.querySelector('#sticky_template_forms');
@@ -339,7 +339,7 @@ describe('TemplateFolderForm', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
formControls = templateFolderForm.querySelector('#sticky_template_forms'); formControls = templateFolderForm.querySelector('#sticky_template_forms');
@@ -449,7 +449,7 @@ describe('TemplateFolderForm', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
formControls = templateFolderForm.querySelector('#sticky_template_forms'); formControls = templateFolderForm.querySelector('#sticky_template_forms');
@@ -513,7 +513,7 @@ describe('TemplateFolderForm', () => {
expect(formControls.querySelector('#add_new_folder_form .js-stick-at-bottom-when-scrolling')).not.toBeNull(); expect(formControls.querySelector('#add_new_folder_form .js-stick-at-bottom-when-scrolling')).not.toBeNull();
// .recalculate should have been called so the sticky JS picks up the controls // .recalculate should have been called so the sticky JS picks up the controls
expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(0); expect(window.NotifyModules.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(0);
}); });
@@ -552,7 +552,7 @@ describe('TemplateFolderForm', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
templateFolderCheckboxes = getTemplateFolderCheckboxes(); templateFolderCheckboxes = getTemplateFolderCheckboxes();
@@ -836,7 +836,7 @@ describe('TemplateFolderForm', () => {
beforeEach(() => { beforeEach(() => {
// start module // start module
window.GOVUK.modules.start(); window.NotifyModules.start();
templateFolderCheckboxes = getTemplateFolderCheckboxes(); templateFolderCheckboxes = getTemplateFolderCheckboxes();
visibleCounterText = getVisibleCounter().textContent.trim(); visibleCounterText = getVisibleCounter().textContent.trim();

16
tests/javascripts/timeoutPopup.test.js
View File

@@ -35,7 +35,7 @@ beforeAll(() => {
`; `;
const sessionTimerModule = require('../../app/assets/javascripts/timeoutPopup.js'); const sessionTimerModule = require('../../app/assets/javascripts/timeoutPopup.js');
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
afterAll(() => { afterAll(() => {
@@ -73,7 +73,7 @@ describe('The session timer ', () => {
const restore = mockWindowLocation(); const restore = mockWindowLocation();
// Test the actual function, not a mock // Test the actual function, not a mock
const signoutUserMethod = window.GOVUK.Modules.TimeoutPopup.signoutUser; const signoutUserMethod = window.NotifyModules.TimeoutPopup.signoutUser;
// This will try to set location.href but our mock will catch it // This will try to set location.href but our mock will catch it
expect(() => signoutUserMethod()).not.toThrow(); expect(() => signoutUserMethod()).not.toThrow();
@@ -85,7 +85,7 @@ describe('The session timer ', () => {
const restore = mockWindowLocation(); const restore = mockWindowLocation();
// Test the actual function, not a mock // Test the actual function, not a mock
const expireUserSessionMethod = window.GOVUK.Modules.TimeoutPopup.expireUserSession; const expireUserSessionMethod = window.NotifyModules.TimeoutPopup.expireUserSession;
// This will try to set location.href but our mock will catch it // This will try to set location.href but our mock will catch it
expect(() => expireUserSessionMethod()).not.toThrow(); expect(() => expireUserSessionMethod()).not.toThrow();
@@ -97,7 +97,7 @@ describe('The session timer ', () => {
const restore = mockWindowLocation(); const restore = mockWindowLocation();
// Test the actual function, not a mock // Test the actual function, not a mock
const extendSessionMethod = window.GOVUK.Modules.TimeoutPopup.extendSession; const extendSessionMethod = window.NotifyModules.TimeoutPopup.extendSession;
// This will try to call location.reload but our mock will catch it // This will try to call location.reload but our mock will catch it
expect(() => extendSessionMethod()).not.toThrow(); expect(() => extendSessionMethod()).not.toThrow();
@@ -111,7 +111,7 @@ describe('The session timer ', () => {
const showTimerMock = jest.spyOn(sessionTimer, 'showModal'); const showTimerMock = jest.spyOn(sessionTimer, 'showModal');
window.GOVUK.Modules.TimeoutPopup.showTimer(); window.NotifyModules.TimeoutPopup.showTimer();
expect(showTimerMock).toHaveBeenCalled(); expect(showTimerMock).toHaveBeenCalled();
}); });
@@ -122,17 +122,17 @@ describe('The session timer ', () => {
const closeTimerMock = jest.spyOn(sessionTimer, 'close'); const closeTimerMock = jest.spyOn(sessionTimer, 'close');
window.GOVUK.Modules.TimeoutPopup.closeTimer(); window.NotifyModules.TimeoutPopup.closeTimer();
expect(closeTimerMock).toHaveBeenCalled(); expect(closeTimerMock).toHaveBeenCalled();
}); });
test('checkTimer is called', () => { test('checkTimer is called', () => {
const checkTimerMock = jest.spyOn( const checkTimerMock = jest.spyOn(
window.GOVUK.Modules.TimeoutPopup, window.NotifyModules.TimeoutPopup,
'checkTimer' 'checkTimer'
); );
window.GOVUK.Modules.TimeoutPopup.checkTimer(); window.NotifyModules.TimeoutPopup.checkTimer();
expect(checkTimerMock).toHaveBeenCalled(); expect(checkTimerMock).toHaveBeenCalled();
}); });
}); });

28
tests/javascripts/updateContent.test.js
View File

@@ -30,10 +30,10 @@ beforeAll(() => {
$.ajax.mockImplementation(() => jqueryAJAXReturnObj); $.ajax.mockImplementation(() => jqueryAJAXReturnObj);
// RollupJS assigns our bundled module code, including morphdom, to window.GOVUK. // RollupJS assigns our bundled module code, including morphdom, to window.NotifyModules.
// morphdom is assigned to its vendor property so we need to copy that here for the updateContent // morphdom is assigned to its vendor property so we need to copy that here for the updateContent
// code to pick it up. // code to pick it up.
window.GOVUK.vendor = { window.NotifyModules.vendor = {
morphdom: require('morphdom') morphdom: require('morphdom')
}; };
require('../../app/assets/javascripts/updateContent.js'); require('../../app/assets/javascripts/updateContent.js');
@@ -68,7 +68,7 @@ describe('Update content', () => {
beforeEach(() => { beforeEach(() => {
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -115,7 +115,7 @@ describe('Update content', () => {
[24000, 10000], [24000, 10000],
]).test('It calculates a delay of %dms if the API responds in %dms', (waitTime, responseTime) => { ]).test('It calculates a delay of %dms if the API responds in %dms', (waitTime, responseTime) => {
expect( expect(
window.GOVUK.Modules.UpdateContent.calculateBackoff(responseTime) window.NotifyModules['update-content'].calculateBackoff(responseTime)
).toBe( ).toBe(
waitTime waitTime
); );
@@ -138,7 +138,7 @@ describe('Update content', () => {
document.querySelector('[data-module=update-content]').setAttribute('data-form', 'service'); document.querySelector('[data-module=update-content]').setAttribute('data-form', 'service');
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
}); });
@@ -225,7 +225,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
expect(document.querySelector('.ajax-block-container').parentNode.hasAttribute('data-resource')).toBe(false); expect(document.querySelector('.ajax-block-container').parentNode.hasAttribute('data-resource')).toBe(false);
@@ -237,7 +237,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
expect($.ajax.mock.calls[0][0]).toEqual(resourceURL); expect($.ajax.mock.calls[0][0]).toEqual(resourceURL);
@@ -250,7 +250,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check a sample DOM node is unchanged // check a sample DOM node is unchanged
@@ -266,7 +266,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check the right DOM node is updated // check the right DOM node is updated
@@ -349,7 +349,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check it has the same number of items // check it has the same number of items
@@ -376,7 +376,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check the node has been added // check the node has been added
@@ -408,7 +408,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check the node has been removed // check the node has been removed
@@ -442,7 +442,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// check the class is still there // check the class is still there
@@ -480,7 +480,7 @@ describe('Update content', () => {
responseObj[updateKey] = getPartial(partialData); responseObj[updateKey] = getPartial(partialData);
// start the module // start the module
window.GOVUK.modules.start(); window.NotifyModules.start();
jest.advanceTimersByTime(2000); jest.advanceTimersByTime(2000);
// re-select in case nodes in partialsInPage have changed // re-select in case nodes in partialsInPage have changed

12
tests/javascripts/updateStatus.test.js
View File

@@ -68,7 +68,7 @@ describe('Update content', () => {
test("It should add attributes to the elements", () => { test("It should add attributes to the elements", () => {
window.GOVUK.modules.start(); window.NotifyModules.start();
expect( expect(
document.querySelectorAll('[data-module=update-status]')[0].id document.querySelectorAll('[data-module=update-status]')[0].id
@@ -88,7 +88,7 @@ describe('Update content', () => {
document.getElementById('template_content').removeAttribute('aria-describedby'); document.getElementById('template_content').removeAttribute('aria-describedby');
window.GOVUK.modules.start(); window.NotifyModules.start();
expect( expect(
document.getElementById('template_content').getAttribute('aria-describedby') document.getElementById('template_content').getAttribute('aria-describedby')
@@ -100,7 +100,7 @@ describe('Update content', () => {
test("It should make requests to the URL specified in the data-updates-url attribute", () => { test("It should make requests to the URL specified in the data-updates-url attribute", () => {
window.GOVUK.modules.start(); window.NotifyModules.start();
expect($.ajax.mock.calls[0][0]).toEqual(updatesURL); expect($.ajax.mock.calls[0][0]).toEqual(updatesURL);
expect($.ajax.mock.calls[0]).toEqual([ expect($.ajax.mock.calls[0]).toEqual([
@@ -123,7 +123,7 @@ describe('Update content', () => {
"Initial content" "Initial content"
); );
window.GOVUK.modules.start(); window.NotifyModules.start();
expect( expect(
document.querySelectorAll('[data-module=update-status]')[0].textContent.trim() document.querySelectorAll('[data-module=update-status]')[0].textContent.trim()
@@ -138,7 +138,7 @@ describe('Update content', () => {
let textarea = document.getElementById('template_content'); let textarea = document.getElementById('template_content');
// Initial update triggered // Initial update triggered
window.GOVUK.modules.start(); window.NotifyModules.start();
expect($.ajax.mock.calls.length).toEqual(1); expect($.ajax.mock.calls.length).toEqual(1);
// 150ms of inactivity // 150ms of inactivity
@@ -154,7 +154,7 @@ describe('Update content', () => {
let textarea = document.getElementById('template_content'); let textarea = document.getElementById('template_content');
// Initial update triggered // Initial update triggered
window.GOVUK.modules.start(); window.NotifyModules.start();
expect($.ajax.mock.calls.length).toEqual(1); expect($.ajax.mock.calls.length).toEqual(1);
helpers.triggerEvent(textarea, 'input'); helpers.triggerEvent(textarea, 'input');