Merge pull request #1491 from alphagov/ldeb-add-watch-js-test

Fix page reloads when prototype assets are changed

CHANGELOG.md

@@ -11,6 +11,10 @@
 
 - [#1476: Update to GOV.UK Frontend 4.2.0](https://github.com/alphagov/govuk-prototype-kit/pull/1476)
 
+### Fixes
+
+- [#1491: Fix page reloads when prototype assets are changed](https://github.com/alphagov/govuk-prototype-kit/pull/1491)
+
 ### Other changes
 
 - [#866: Remove docs from the Prototype Kit](https://github.com/alphagov/govuk-prototype-kit/issues/866)

cypress/integration/1-watch-files/watch-javascripts.cypress.js

@@ -0,0 +1,40 @@
+const path = require('path')
+
+const { waitForApplication } = require('../utils')
+
+const appJs = path.join(Cypress.env('projectFolder'), 'app', 'assets', 'javascripts', 'application.js')
+const backupAppJs = path.join(Cypress.env('tempFolder'), 'temp-application.js')
+
+describe('watch application.js', () => {
+  before(() => {
+    waitForApplication()
+
+    // backup application.js
+    cy.task('copyFile', { source: appJs, target: backupAppJs })
+  })
+
+  after(() => {
+    // restore files
+    cy.task('copyFile', { source: backupAppJs, target: appJs })
+  })
+
+  it('changes to application.js should be reflected in browser', (done) => {
+    const onAlert = cy.stub()
+    cy.on('window:alert', onAlert)
+
+    const markerText = 'window.GOVUKFrontend.initAll()'
+    const newText = markerText + '\n  ' + "window.alert('Test')"
+
+    cy.task('replaceTextInFile', {
+      filename: appJs,
+      originalText: markerText,
+      newText
+    })
+
+    // wait for page to be reloaded by Browsersync
+    cy.once('window:load', () => {
+      expect(onAlert).to.be.calledWith('Test')
+      done()
+    })
+  })
+})

lib/build/tasks.js

@@ -163,7 +163,7 @@ function runNodemon () {
     ignore: [
       'public/*',
       'cypress/*',
-      `${paths.assets}*`,
+      `${paths.assets}/*`,
       'node_modules/*'
     ]
   })