When I open a Cardwall page in the AgileDashboard (not the Tracker renderer one), there are about 13 JavaScript console errors, like the following:
tuleap-including-prototypejs-b2ae42cc41.js:12 Uncaught TypeError: element2.attachEvent is not a function
at observeCustomEvent (tuleap-including-prototypejs-b2ae42cc41.js:12:11677)
at observe (tuleap-including-prototypejs-b2ae42cc41.js:12:11176)
at HTMLDocument._methodized [as observe] (tuleap-including-prototypejs-b2ae42cc41.js:1:9354)
at tracker-f64f870d9c.js:1:7972
observeCustomEvent @ tuleap-including-prototypejs-b2ae42cc41.js:12
observe @ tuleap-including-prototypejs-b2ae42cc41.js:12
_methodized @ tuleap-including-prototypejs-b2ae42cc41.js:1
(anonymous) @ tracker-f64f870d9c.js:1
tuleap-including-prototypejs-b2ae42cc41.js:12 Uncaught TypeError: element2.attachEvent is not a function
at observeCustomEvent (tuleap-including-prototypejs-b2ae42cc41.js:12:11677)
at observe (tuleap-including-prototypejs-b2ae42cc41.js:12:11176)
at HTMLDocument._methodized [as observe] (tuleap-including-prototypejs-b2ae42cc41.js:1:9354)
at cardwall-9028fca197.js:1:9880
observeCustomEvent @ tuleap-including-prototypejs-b2ae42cc41.js:12
observe @ tuleap-including-prototypejs-b2ae42cc41.js:12
_methodized @ tuleap-including-prototypejs-b2ae42cc41.js:1
(anonymous) @ cardwall-9028fca197.js:1
initiate-app-CHWosGSs.js:1 Uncaught TypeError: wa.createElement is not a function
at initiate-app-CHWosGSs.js:1:51280
(anonymous) @ initiate-app-CHWosGSs.js:1
tuleap-including-prototypejs-b2ae42cc41.js:12 Uncaught TypeError: document.createEvent is not a function
at fireEvent_DOM (tuleap-including-prototypejs-b2ae42cc41.js:12:14035)
at fire (tuleap-including-prototypejs-b2ae42cc41.js:12:13891)
at HTMLDocument._methodized [as fire] (tuleap-including-prototypejs-b2ae42cc41.js:1:9354)
at HTMLDocument.fireContentLoadedEvent (tuleap-including-prototypejs-b2ae42cc41.js:12:17249)
fireEvent_DOM @ tuleap-including-prototypejs-b2ae42cc41.js:12
fire @ tuleap-including-prototypejs-b2ae42cc41.js:12
_methodized @ tuleap-including-prototypejs-b2ae42cc41.js:1
fireContentLoadedEvent @ tuleap-including-prototypejs-b2ae42cc41.js:12
tuleap-including-prototypejs-b2ae42cc41.js:14 Uncaught TypeError: C.removeEventListener is not a function
at HTMLDocument.P (tuleap-including-prototypejs-b2ae42cc41.js:14:52400)
P @ tuleap-including-prototypejs-b2ae42cc41.js:14
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:77 Uncaught TypeError: document.getElementsByTagName is not a function
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:77:187886)
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:77
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:80 Uncaught TypeError: document.getElementById is not a function
at N9 (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:80:1480)
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:80:1442)
N9 @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:80
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:80
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110 Uncaught TypeError: document.getElementById is not a function
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110:24194)
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110 Uncaught TypeError: document.querySelectorAll is not a function
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110:35598)
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:11 Uncaught TypeError: document.querySelector is not a function
at T (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:11:671)
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110:35926)
T @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:11
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110
project-banner-b8af4548808bd4d7b64a.js:1 Uncaught TypeError: e.getElementById is not a function
at N (project-banner-b8af4548808bd4d7b64a.js:1:148)
at HTMLDocument.<anonymous> (project-banner-b8af4548808bd4d7b64a.js:1:3579)
N @ project-banner-b8af4548808bd4d7b64a.js:1
(anonymous) @ project-banner-b8af4548808bd4d7b64a.js:1
flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'dataset')
at HTMLDocument.<anonymous> (flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110:35313)
(anonymous) @ flamingparrot-with-polyfills-01517e7e2a637e367e41.js:110
tuleap-including-prototypejs-b2ae42cc41.js:14 Uncaught TypeError: C.removeEventListener is not a function
at P (tuleap-including-prototypejs-b2ae42cc41.js:14:52400)
P @ tuleap-including-prototypejs-b2ae42cc41.js:14
All JS functionality is broken: Buttons do nothing, I cannot open the modal, drag-and-drop cards, edit remaining effort, expand/collapse cards, etc. Even the sidebar, which is supposed to be independent, gets broken when I click on the collapse button.
After running git bisect, I learned that:
77462ffe9f6376dd365a076462a10e145016ce80 is the first bad commit
So this is related to request #47192 Vite: 6.x to 8.x. Since the upgrade has been back-ported to Tuleap 17.5, both master and Tuleap 17.5 are affected.
It turns out that the legacy-modal-v2 scripts seems to break some global variables. When I block it via network dev tools, the page loads correctly without error. It seems that the new minifier used by vite v8 causes conflicts with our older code based on PrototypeJS, it reuses $ as a name identifier, which breaks other scripts.
We should repair this page so that it loads without error.