Infinite refresh loop in browser

[chrisadesign]

Description of the issue

I’ve been experiencing some weird behaviour in the kit, it occasionally gets stuck on an infinite refresh loop in the browser. Happens on file save, although doesn’t seem to be tied to any code as removing the last thing doesn’t fix. I’ve realised that navigating to the ‘manage your prototype’ page and back to my views stops it.

Steps to reproduce the issue

Happens occasionally on file save, but I've not figured out if there's a specific step to reproduce, seems random.

Actual vs expected behaviour

Browser sync constantly refreshing page rather than just once on file save.

Environment (where applicable)

• Operating system: macOS: 14.1.2 (23B92)
• Browser: Brave
• Browser version: Version 1.61.104 Chromium: 120.0.6099.115 (Official Build) (arm64)
• GOV.UK Prototype Kit version: v13.16.0

I've observed this on another mac/browser too, I don't have the details to hand

[DH02]

I have suddenly begun experiencing this issue (on a repo which previously didn't). Using rudimentary browser dev inspector seems to indicate an issue relating to file 'browser-sync-client.js'? If I disable JavaScript in my browser the behaviour stops. Seems to have manifested itself around the same time I created and used some alternative layout files? (Occasionally it stops?! But this may be due to an accidental behaviour which resolves it - similar to Chris' working solution (thanks for that Chris - very handy). Kit v13.13.6. govuk-frontend 4.4.0 on Windows. Node v18.17.0. Chrome and Edge.

[joelanman]

If you get this issue, you can try this to get more info to help find a fix:

In your editor, open this file

node_modules/govuk-prototype-kit/lib/sync-changes.js

On line 57 change it to

    logLevel: 'debug',

BrowserSync will now write out a lot of debug info to the terminal when you run the kit. It should say why it is restarting.

[nataliecarey]

I'm pretty sure the issue is caused by this code.

The easiest temporary solution for those stuck in this position is to visit /manage-prototype (e.g. http://localhost:3000/manage-prototype) which should stop the refreshing.