Use CustomEvent constructor instead of deprecated initCustomEvent()

[angryziber]

Describe the bug

Compiled components use a deprecated initCustomEvent, which is not supported by e.g. happy-dom.

Instead of

function custom_event(type, detail, bubbles = false) {
    const e = document.createEvent('CustomEvent');
    e.initCustomEvent(type, bubbles, false, detail);
    return e;
}

it would be nice to use the CustomEvent constructor, which is supported in all modern browsers.
https://caniuse.com/?search=CustomEvent

Reproduction

Open svelte/internal/index.mjs

Logs

No response

System Info

Not relevant

Severity

annoyance

[bluwy]

This would be a breaking change, since initCustomEvent is used to support old browsers. An alternative is to check for the CustomeEvent constructor and conditionally use that, but that increases the bundle size a bit for everyone.

[MorganR]

Just to check in on this:

Can-I-use indicates that this is now fully supported by 97.11% of browsers, with IE being the major hold-out.

MDN recommends folks replace any code using initCustomEvent with the CustomEvent constructor, with note that "[initCustomEvent] may cease to work at any time."

Edit: initCustomEvent is supported by 97.74%, so the support difference is less than 0.6%.

[imperator-maximus]

Any update on this?
I have
import { createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
...
dispatch('test',{})
Error TypeError: e.initCustomEvent is not a function

so dispatch doesn't work anymore?

[bluwy]

@imperator-maximus What browser are you using that doesn't work? Caniuse still shows that all evergreen browsers support it.

[imperator-maximus]

Adobe UXP