DevTools "Update on reload" Bug #889
Description
According to ( https://whatwebcando.today/articles/use-chrome-dev-tools-switches#update-on-reload-switch ) there is a bug in Chrome that causes the tab to get stuck in a reload loop when the Application > Update on reload setting is ticked. They offer a solution, which I tested a variation of in src\client\build\register.ts, then in my project which did fix the bug experienced. It's generally low priority since it's not user-facing, but two other devs (one being the CTO) randomly came across since they leave dev tools open. Ultimately it wastes a lot of company time, so it seems important enough to address.
This was the solution tested:
31: // Guard to prevent infinite reload loops when Chrome DevTools "Update on reload" is enabled
32: let preventDevToolsReloadLoop = false
63: wb.addEventListener('activated', (event) => {
64: if (event.isUpdate || event.isExternal) {
65: // Ensure refresh is only called once.
66: // This works around a bug in "force update on reload".
67: if (preventDevToolsReloadLoop) return
68: preventDevToolsReloadLoop = true
69: window.location.reload()
70: }
71: })
93: wb?.addEventListener('controlling', (event) => {
94: if (event.isUpdate) {
95: // Ensure refresh is only called once.
96: // This works around a bug in "force update on reload".
97: if (preventDevToolsReloadLoop) return
98: preventDevToolsReloadLoop = true
99: window.location.reload()
100: }
101: })