darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-06-28 11:21:37 -04:00
Code Issues Packages Projects Releases Wiki Activity

show error message in banner rather than an alert

Browse Source 
the banner is a nicer user experience, and consistent with how we
display errors elsewhere in notify. For now pass through the error
message from JS, but we'll probably want to change that since the erorr
messages themselves are often a bit cryptic and unhelpful
This commit is contained in:
Leo Hemsted
2021-08-11 18:02:50 +01:00
parent c96a1dc0b7
commit 0b27d7e0a9
6 changed files with 64 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
tests/javascripts/registerSecurityKey.test.js
View File

@@ -4,7 +4,11 @@ beforeAll(() => {
// populate missing values to allow consistent jest.spyOn()
window.fetch = () => {}
window.navigator.credentials = { create: () => {} }
window.navigator.credentials = { create: () => { } }
window.GOVUK.ErrorBanner = {
showBanner: () => { },
hideBanner: () => { }
};
})
afterAll(() => {
@@ -23,9 +27,6 @@ describe('Register security key', () => {
// you might need to comment this out to debug some failures
jest.spyOn(console, 'error').mockImplementation(() => {})
// ensure window.alert() is implemented to simplify errors
jest.spyOn(window, 'alert').mockImplementation(() => {})
document.body.innerHTML = `
<a href="#" role="button" draggable="false" class="govuk-button govuk-button--secondary" data-module="register-security-key">
Register a key
@@ -78,8 +79,8 @@ describe('Register security key', () => {
done()
})
// this will make the test fail if the alert is called
jest.spyOn(window, 'alert').mockImplementation((msg) => {
// this will make the test fail if the error banner is displayed
jest.spyOn(window.GOVUK.ErrorBanner, 'showBanner').mockImplementation((msg) => {
done(msg)
})
@@ -89,7 +90,7 @@ describe('Register security key', () => {
test.each([
['network'],
['server'],
])('alerts if fetching WebAuthn options fails (%s error)', (errorType, done) => {
])('errors if fetching WebAuthn options fails (%s error)', (errorType, done) => {
jest.spyOn(window, 'fetch').mockImplementation((_url) => {
if (errorType == 'network') {
return Promise.reject('error')
@@ -98,8 +99,8 @@ describe('Register security key', () => {
}
})
jest.spyOn(window, 'alert').mockImplementation((msg) => {
expect(msg).toEqual('Error during registration.\n\nerror')
jest.spyOn(window.GOVUK.ErrorBanner, 'showBanner').mockImplementation((msg) => {
expect(msg).toEqual('Something went wrong')
done()
})
@@ -110,7 +111,7 @@ describe('Register security key', () => {
['network error'],
['internal server error'],
['bad request'],
])('alerts if sending WebAuthn credentials fails (%s)', (errorType, done) => {
])('errors if sending WebAuthn credentials fails (%s)', (errorType, done) => {
jest.spyOn(window, 'fetch').mockImplementationOnce((_url) => {
// initial fetch of options from the server
@@ -140,15 +141,15 @@ describe('Register security key', () => {
}
})
jest.spyOn(window, 'alert').mockImplementation((msg) => {
expect(msg).toEqual('Error during registration.\n\nerror')
jest.spyOn(window.GOVUK.ErrorBanner, 'showBanner').mockImplementation((msg) => {
expect(msg).toEqual('Something went wrong')
done()
})
button.click()
})
test('alerts if comms with the authenticator fails', (done) => {
test('errors if comms with the authenticator fails', (done) => {
jest.spyOn(window.navigator.credentials, 'create').mockImplementation(() => {
return Promise.reject(new DOMException('error'))
})
@@ -162,8 +163,8 @@ describe('Register security key', () => {
})
})
jest.spyOn(window, 'alert').mockImplementation((msg) => {
expect(msg).toEqual('Error during registration.\n\nerror')
jest.spyOn(window.GOVUK.ErrorBanner, 'showBanner').mockImplementation((msg) => {
expect(msg).toEqual('Something went wrong')
done()
})