alphagov · BenSurgisonGDS · Jan 31, 2023 · Jan 26, 2023
diff --git a/cypress/e2e/plugins/1-available-plugins-tests/available-plugins.cypress.js b/cypress/e2e/plugins/1-available-plugins-tests/available-plugins.cypress.js
@@ -1,20 +1,9 @@
 // local dependencies
-const { waitForApplication, uninstallPlugin } = require('../../utils')
+const { uninstallPlugin } = require('../../utils')
+const { managePluginsPagePath, loadTemplatesPage, loadPluginsPage } = require('../plugin-utils')
 
-const managePluginsPagePath = '/manage-prototype/plugins'
-const manageTemplatesPagePath = '/manage-prototype/templates'
 const panelCompleteQuery = '[aria-live="polite"] #panel-complete'
 
-async function loadPluginsPage () {
-  cy.task('log', 'Visit the manage prototype plugins page')
-  await waitForApplication(managePluginsPagePath)
-}
-
-async function loadTemplatesPage () {
-  cy.task('log', 'Visit the manage prototype templates page')
-  await waitForApplication(manageTemplatesPagePath)
-}
-
 async function installPluginTests ({ plugin, templates, version }) {
   describe(plugin, () => {
     before(() => {

diff --git a/cypress/e2e/plugins/1-available-plugins-tests/install-available-plugin.cypress.js b/cypress/e2e/plugins/1-available-plugins-tests/install-available-plugin.cypress.js
@@ -1,16 +1,18 @@
-
 // core dependencies
 const path = require('path')
 
-// npm dependencies
-const { capitalize } = require('lodash')
-
 // local dependencies
-const { waitForApplication, getTemplateLink, deleteFile } = require('../../utils')
+const { deleteFile } = require('../../utils')
+const {
+  failAction,
+  performPluginAction,
+  managePluginsPagePath,
+  getTemplateLink,
+  loadPluginsPage
+} = require('../plugin-utils')
 const { showHideAllLinkQuery, assertVisible, assertHidden } = require('../../step-by-step-utils')
 
 const appViews = path.join(Cypress.env('projectFolder'), 'app', 'views')
-const managePluginsPagePath = '/manage-prototype/plugins'
 const plugin = '@govuk-prototype-kit/step-by-step'
 const version1 = '1.0.0'
 const version2 = '2.1.0'
@@ -19,41 +21,6 @@ const pluginPageTemplate = '/templates/step-by-step-navigation.html'
 const pluginPageTitle = 'Step by step navigation'
 const pluginPagePath = '/step-by-step-navigation'
 
-const panelProcessingQuery = '[aria-live="polite"] #panel-processing'
-const panelCompleteQuery = '[aria-live="polite"] #panel-complete'
-const panelErrorQuery = '[aria-live="polite"] #panel-error'
-
-const performPluginAction = (action) => {
-  cy.task('log', `The ${plugin} plugin should be displayed`)
-  cy.get('h2')
-    .should('contains.text', `${capitalize(action)} ${pluginName}`)
-
-  cy.get(panelCompleteQuery)
-    .should('not.be.visible')
-  cy.get(panelCompleteQuery)
-    .should('not.be.visible')
-  cy.get(panelErrorQuery)
-    .should('not.be.visible')
-  cy.get(panelProcessingQuery)
-    .should('be.visible')
-    .should('contain.text', `${capitalize(action === 'upgrade' ? 'Upgrad' : action)}ing ...`)
-
-  cy.get(panelProcessingQuery, { timeout: 20000 })
-    .should('not.be.visible')
-  cy.get(panelErrorQuery)
-    .should('not.be.visible')
-  cy.get(panelCompleteQuery)
-    .should('be.visible')
-    .should('contain.text', `${capitalize(action)} complete`)
-
-  cy.get('#instructions-complete a')
-    .should('contain.text', 'Back to plugins')
-    .wait(3000)
-    .click()
-
-  cy.get('h1').should('have.text', 'Plugins')
-}
-
 const provePluginFunctionalityWorks = () => {
   cy.wait(2000)
 
@@ -62,12 +29,12 @@ const provePluginFunctionalityWorks = () => {
   cy.visit(pluginPagePath)
 
   // click toggle button and check that all steps details are visible
-  cy.get(showHideAllLinkQuery).should('contains.text', 'Show all').click()
+  cy.get(showHideAllLinkQuery).contains('Show all').click()
   assertVisible(1)
   assertVisible(2)
 
   // click toggle button and check that all steps details are hidden
-  cy.get(showHideAllLinkQuery).should('contains.text', 'Hide all').click()
+  cy.get(showHideAllLinkQuery).contains('Hide all').click()
   assertHidden(1)
   assertHidden(2)
 }
@@ -98,11 +65,6 @@ describe('Management plugins: ', () => {
     cy.wait(4000)
   })
 
-  const loadPluginsPage = async () => {
-    cy.task('log', 'Visit the manage prototype plugins page')
-    await waitForApplication(managePluginsPagePath)
-  }
-
   it('CSRF Protection on POST action', () => {
     const installUrl = `${managePluginsPagePath}/install`
     cy.task('log', `Posting to ${installUrl} without csrf protection`)
@@ -122,21 +84,21 @@ describe('Management plugins: ', () => {
 
     cy.get('#plugin-action-button').click()
 
-    performPluginAction('install')
+    performPluginAction('install', plugin, pluginName)
   })
 
   it(`Upgrade the ${plugin}@${version1} plugin to ${plugin}@${version2}`, () => {
     loadPluginsPage()
     cy.task('log', `Upgrade the ${plugin} plugin`)
     cy.get(`[data-plugin-package-name="${plugin}"] button`).contains('Upgrade').click()
 
-    performPluginAction('upgrade')
+    performPluginAction('upgrade', plugin, pluginName)
   })
 
   it(`Create a page using a template from the ${plugin} plugin`, () => {
     loadPluginsPage()
     cy.get('a[href*="/templates"]')
-      .should('contains.text', 'Templates').click()
+      .contains('Templates').click()
 
     cy.get('h2').contains(pluginName)
 
@@ -146,7 +108,7 @@ describe('Management plugins: ', () => {
 
     // create step-by-step-navigation page
     cy.get('.govuk-heading-l')
-      .should('contains.text', `Create new ${pluginPageTitle} page`)
+      .contains(`Create new ${pluginPageTitle} page`)
     cy.get('#chosen-url')
       .type(pluginPagePath)
     cy.get('.govuk-button').contains('Create page').click()
@@ -159,7 +121,7 @@ describe('Management plugins: ', () => {
     cy.task('log', `Uninstall the ${plugin} plugin`)
     cy.get(`[data-plugin-package-name="${plugin}"] button`).contains('Uninstall').click()
 
-    performPluginAction('uninstall')
+    performPluginAction('uninstall', plugin, pluginName)
 
     provePluginFunctionalityFails()
   })
@@ -169,7 +131,7 @@ describe('Management plugins: ', () => {
     cy.task('log', `Install the ${plugin} plugin`)
     cy.get(`[data-plugin-package-name="${plugin}"] button`).contains('Install').click()
 
-    performPluginAction('install')
+    performPluginAction('install', plugin, pluginName)
 
     provePluginFunctionalityWorks()
   })
@@ -181,47 +143,23 @@ describe('Management plugins: ', () => {
 
       cy.get('#plugin-action-button').click()
 
-      performPluginAction('install')
+      performPluginAction('install', plugin, pluginName)
     })
 
     describe('fail', () => {
-      const failAction = () => {
-        cy.get('#plugin-action-button').click()
-
-        cy.get(panelCompleteQuery)
-          .should('not.be.visible')
-        cy.get(panelErrorQuery)
-          .should('not.be.visible')
-        cy.get(panelProcessingQuery)
-          .should('be.visible')
-          .should('contain.text', 'Installing ...')
-
-        cy.get(panelProcessingQuery, { timeout: 40000 })
-          .should('not.be.visible')
-        cy.get(panelCompleteQuery)
-          .should('not.be.visible')
-        cy.get(panelErrorQuery)
-          .should('be.visible')
-
-        cy.get(`${panelErrorQuery} .govuk-panel__title`)
-          .should('contain.text', 'There was a problem installing')
-        cy.get(`${panelErrorQuery} a`)
-          .should('contain.text', 'Please contact support')
-      }
-
       it('Fail when installing a non existent plugin', () => {
         const pkg = 'invalid-prototype-kit-plugin'
         const pluginName = 'Invalid Prototype Kit Plugin'
         cy.visit(`${managePluginsPagePath}/install?package=${encodeURIComponent(pkg)}`)
         cy.get('h2').contains(`Install ${pluginName}`)
-        failAction()
+        failAction('install')
       })
 
       it('Fail when installing a plugin with a non existent version', () => {
         cy.visit(`${managePluginsPagePath}/install?package=${encodeURIComponent(plugin)}&version=0.0.1`)
         cy.get('h2')
-          .should('contains.text', `Install ${pluginName}`)
-        failAction()
+          .contains(`Install ${pluginName}`)
+        failAction('install')
       })
     })
   })

diff --git a/cypress/e2e/plugins/1-available-plugins-tests/preview-template-view.cypress.js b/cypress/e2e/plugins/1-available-plugins-tests/preview-template-view.cypress.js
@@ -1,9 +1,9 @@
 
 // local dependencies
-const { installPlugin, waitForApplication, getTemplateLink } = require('../../utils')
+const { installPlugin, waitForApplication } = require('../../utils')
 const { showHideAllLinkQuery, assertVisible, assertHidden } = require('../../step-by-step-utils')
+const { manageTemplatesPagePath, getTemplateLink } = require('../plugin-utils')
 
-const manageTemplatesPagePath = '/manage-prototype/templates'
 const plugin = '@govuk-prototype-kit/step-by-step'
 const version1 = '@1.0.0'
 const version2 = '@2.1.0'

diff --git a/cypress/e2e/plugins/plugin-utils.js b/cypress/e2e/plugins/plugin-utils.js
@@ -0,0 +1,91 @@
+// npm dependencies
+const { capitalize } = require('lodash')
+const { urlencode } = require('nunjucks/src/filters')
+const { waitForApplication } = require('../utils')
+
+const manageTemplatesPagePath = '/manage-prototype/templates'
+const managePluginsPagePath = '/manage-prototype/plugins'
+
+const panelProcessingQuery = '[aria-live="polite"] #panel-processing'
+const panelCompleteQuery = '[aria-live="polite"] #panel-complete'
+const panelErrorQuery = '[aria-live="polite"] #panel-error'
+
+function getTemplateLink (type, packageName, path) {
+  const queryString = `?package=${urlencode(packageName)}&template=${urlencode(path)}`
+  return `${manageTemplatesPagePath}/${type}${queryString}`
+}
+
+async function loadPluginsPage () {
+  cy.task('log', 'Visit the manage prototype plugins page')
+  await waitForApplication(managePluginsPagePath)
+}
+
+async function loadTemplatesPage () {
+  cy.task('log', 'Visit the manage prototype templates page')
+  await waitForApplication(manageTemplatesPagePath)
+}
+
+function performPluginAction (action, plugin, pluginName) {
+  cy.task('log', `The ${plugin} plugin should be displayed`)
+  cy.get('h2')
+    .contains(`${capitalize(action)} ${pluginName}`)
+
+  cy.get(panelCompleteQuery)
+    .should('not.be.visible')
+  cy.get(panelCompleteQuery)
+    .should('not.be.visible')
+  cy.get(panelErrorQuery)
+    .should('not.be.visible')
+  cy.get(panelProcessingQuery)
+    .should('be.visible')
+    .contains(`${capitalize(action === 'upgrade' ? 'Upgrad' : action)}ing ...`)
+
+  cy.get(panelProcessingQuery, { timeout: 20000 })
+    .should('not.be.visible')
+  cy.get(panelErrorQuery)
+    .should('not.be.visible')
+  cy.get(panelCompleteQuery)
+    .should('be.visible')
+    .contains(`${capitalize(action)} complete`)
+
+  cy.get('#instructions-complete a')
+    .contains('Back to plugins')
+    .wait(3000)
+    .click()
+
+  cy.get('h1').should('have.text', 'Plugins')
+}
+
+function failAction (action) {
+  cy.get('#plugin-action-button').click()
+
+  cy.get(panelCompleteQuery)
+    .should('not.be.visible')
+  cy.get(panelErrorQuery)
+    .should('not.be.visible')
+  cy.get(panelProcessingQuery)
+    .should('be.visible')
+    .contains(`${capitalize(action === 'upgrade' ? 'Upgrad' : action)}ing ...`)
+
+  cy.get(panelProcessingQuery, { timeout: 40000 })
+    .should('not.be.visible')
+  cy.get(panelCompleteQuery)
+    .should('not.be.visible')
+  cy.get(panelErrorQuery)
+    .should('be.visible')
+
+  cy.get(`${panelErrorQuery} .govuk-panel__title`)
+    .contains(`There was a problem ${action === 'upgrade' ? 'Upgrad' : action}ing`)
+  cy.get(`${panelErrorQuery} a`)
+    .contains('Please contact support')
+}
+
+module.exports = {
+  managePluginsPagePath,
+  manageTemplatesPagePath,
+  loadPluginsPage,
+  loadTemplatesPage,
+  getTemplateLink,
+  performPluginAction,
+  failAction
+}
diff --git a/cypress/e2e/utils.js b/cypress/e2e/utils.js
@@ -1,7 +1,4 @@
 
-// npm dependencies
-const { urlencode } = require('nunjucks/src/filters')
-
 const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
 
 const authenticate = () => {
@@ -40,11 +37,6 @@ const replaceInFile = (filename, originalText, source, newText) => {
   cy.task('replaceTextInFile', { filename, originalText, source, newText })
 }
 
-const getTemplateLink = (type, packageName, path) => {
-  const queryString = `?package=${urlencode(packageName)}&template=${urlencode(path)}`
-  return `/manage-prototype/templates/${type}${queryString}`
-}
-
 function uninstallPlugin (plugin) {
   cy.task('log', `Uninstalling ${plugin}`)
   cy.exec(`cd ${Cypress.env('projectFolder')} && npm uninstall ${plugin}`)
@@ -65,7 +57,6 @@ module.exports = {
   authenticate,
   sleep,
   waitForApplication,
-  getTemplateLink,
   copyFile,
   deleteFile,
   createFile,