next/script creates unhandled promise rejection with empty error for every script that fails to load #27747
Description
What version of Next.js are you using?
11
What version of Node.js are you using?
12.14.1
What browser are you using?
Chrome
What operating system are you using?
macOS
How are you deploying your application?
next start
Describe the Bug
Loading any script which fails to load generates an unhandled rejection error "Uncaught (in promise) undefined"
This is due to this code
https://github.com/vercel/next.js/blob/canary/packages/next/client/script.tsx#L58
const loadPromise = new Promise<void>((resolve, reject) => {
el.addEventListener('load', function () {
resolve()
if (onLoad) {
onLoad.call(this)
}
})
el.addEventListener('error', function () {
reject()
if (onError) {
onError()
}
})
})
reject is called but loadPromise never has an error handler attached unless you create two tags for the same script which will do ScriptCache.get(src).then(onLoad, onError)
Expected Behavior
No unhandled rejection error for errors and pass the real error to the onError
To Reproduce
<Script
src="https://somebrokenlink.doesntexist"
strategy="lazyOnload"
onLoad={() => {
console.log('success');
}}
onLoad={(e) => {
console.log('error');
console.log(e); // this doesn't exist either
}}
/>