diff --git a/cypress/e2e/dev/5-management-tests/change-service-name.cypress.js b/cypress/e2e/dev/5-management-tests/change-service-name.cypress.js index 5d06efaa38..45f6b9537f 100644 --- a/cypress/e2e/dev/5-management-tests/change-service-name.cypress.js +++ b/cypress/e2e/dev/5-management-tests/change-service-name.cypress.js @@ -18,10 +18,8 @@ describe('change service name', () => { afterEach(restoreStarterFiles) it('The service name should change to "cypress test" and the task should be set to "Done"', () => { - waitForApplication() + waitForApplication('/') - cy.task('log', 'Visit the index page and navigate to the manage your prototype page') - cy.visit('/') cy.get('.govuk-heading-xl').contains(originalText) cy.get('p strong').contains(appConfigPath) cy.get(`main a[href="${managePagePath}"]`).contains('Manage your prototype').click() diff --git a/cypress/e2e/plugins/plugin-utils.js b/cypress/e2e/plugins/plugin-utils.js index 8a8416ab16..1045261a94 100644 --- a/cypress/e2e/plugins/plugin-utils.js +++ b/cypress/e2e/plugins/plugin-utils.js @@ -10,6 +10,7 @@ const manageInstalledPluginsPagePath = '/manage-prototype/plugins-installed' const panelProcessingQuery = '[aria-live="polite"] #panel-processing' const panelCompleteQuery = '[aria-live="polite"] #panel-complete' const panelErrorQuery = '[aria-live="polite"] #panel-error' +const processingIndicatorQuery = '#manage-plugin-progress-indicator' function getTemplateLink (type, packageName, path) { const queryString = `?package=${urlencode(packageName)}&template=${urlencode(path)}` @@ -135,13 +136,15 @@ function performPluginAction (action, plugin, pluginName) { .contains(pluginName) } - const processingText = `${action === 'update' ? 'Updat' : action}ing ...` + const processingText = `${action === 'update' ? 'Updat' : action}ing` if (Cypress.env('skipPluginActionInterimStep') !== 'true') { cy.get(panelCompleteQuery, { timeout: 20000 }) .should('not.be.visible') cy.get(panelErrorQuery) .should('not.be.visible') + cy.get(processingIndicatorQuery) + .should('be.visible') cy.get(panelProcessingQuery) .should('be.visible') .contains(capitalize(processingText)) @@ -151,6 +154,8 @@ function performPluginAction (action, plugin, pluginName) { cy.get(panelProcessingQuery, { timeout: 20000 }) .should('not.be.visible') + cy.get(processingIndicatorQuery) + .should('not.be.visible') cy.get(panelErrorQuery) .should('not.be.visible') cy.get(panelCompleteQuery) @@ -176,13 +181,17 @@ function failAction (action) { .should('not.be.visible') cy.get(panelErrorQuery) .should('not.be.visible') + cy.get(processingIndicatorQuery) + .should('be.visible') cy.get(panelProcessingQuery) .should('be.visible') - .contains(`${capitalize(action === 'update' ? 'Updat' : action)}ing ...`) + .contains(`${capitalize(action === 'update' ? 'Updat' : action)}ing`) } cy.get(panelProcessingQuery, { timeout: 40000 }) .should('not.be.visible') + cy.get(processingIndicatorQuery) + .should('not.be.visible') cy.get(panelCompleteQuery) .should('not.be.visible') cy.get(panelErrorQuery) diff --git a/lib/assets/javascripts/manage-prototype/manage-plugins.js b/lib/assets/javascripts/manage-prototype/manage-plugins.js index 1253e9b6d7..9fd37179fd 100644 --- a/lib/assets/javascripts/manage-prototype/manage-plugins.js +++ b/lib/assets/javascripts/manage-prototype/manage-plugins.js @@ -10,7 +10,7 @@ let timedOut = false let kitIsRestarting = false let actionTimeoutId - + let indicatorIntervalId const show = (id) => { const element = document.getElementById(id) if (element) { @@ -18,18 +18,38 @@ } } - const hide = (id) => { + const hide = (id, clearContents = false) => { const element = document.getElementById(id) if (element) { element.hidden = true + if (clearContents) { + element.innerHTML = '' + } + } + } + + const startProcessing = () => { + const element = document.getElementById('manage-plugin-progress-indicator') + const updateProgressIndicator = () => { + element.innerHTML += '. ' } + indicatorIntervalId = setInterval(updateProgressIndicator, 1000) + show('panel-processing') + show('manage-plugin-progress-indicator') + updateProgressIndicator() + } + + const stopProcessing = () => { + clearInterval(indicatorIntervalId) + hide('manage-plugin-progress-indicator', true) + hide('panel-processing') } const showCompleteStatus = () => { if (actionTimeoutId) { clearTimeout(actionTimeoutId) } - hide('panel-processing') + stopProcessing() show('panel-complete') show('instructions-complete') } @@ -38,7 +58,7 @@ if (actionTimeoutId) { clearTimeout(actionTimeoutId) } - hide('panel-processing') + stopProcessing() show('panel-error') } @@ -126,7 +146,7 @@ hide('plugin-action-confirmation') } - show('panel-processing') + startProcessing() return getToken() .then((token) => postRequest(`/manage-prototype/plugins/${mode}`, token)) diff --git a/lib/assets/javascripts/manage-prototype/manage-plugins.test.js b/lib/assets/javascripts/manage-prototype/manage-plugins.test.js index aa25941c13..7e3b05aeb2 100644 --- a/lib/assets/javascripts/manage-prototype/manage-plugins.test.js +++ b/lib/assets/javascripts/manage-prototype/manage-plugins.test.js @@ -14,6 +14,7 @@ const loadedHTML = `
+ @@ -26,6 +27,7 @@ const processingHTML = `
+
@@ -38,6 +40,7 @@ const completedHTML = `
+
@@ -50,6 +53,7 @@ const errorHTML = `
+
diff --git a/lib/nunjucks/views/manage-prototype/plugin-install-or-uninstall.njk b/lib/nunjucks/views/manage-prototype/plugin-install-or-uninstall.njk index 866ddbe1cb..e64896374e 100644 --- a/lib/nunjucks/views/manage-prototype/plugin-install-or-uninstall.njk +++ b/lib/nunjucks/views/manage-prototype/plugin-install-or-uninstall.njk @@ -72,7 +72,8 @@