# DOM events

> How Elide supports Event, CustomEvent and EventTarget: the DOM Standard without a DOM tree, so dispatch has one target and no capture or bubble phase.

`Event`, `CustomEvent`, and `EventTarget` are globals and follow the [DOM Standard](https://dom.spec.whatwg.org/).

## Example

```js
// domevents.mjs
const bus = new EventTarget();
bus.addEventListener("order", (event) => console.log("order", event.detail.id), { once: true });
bus.addEventListener("order", (event) => {
  event.preventDefault();
  console.log("cancelable", event.cancelable);
});

const event = new CustomEvent("order", { detail: { id: 7 }, cancelable: true });
console.log("dispatched", bus.dispatchEvent(event), event.defaultPrevented);
bus.dispatchEvent(new CustomEvent("order", { detail: { id: 8 } }));
```

`elide run domevents.mjs` prints:

```text
order 7
cancelable true
dispatched false true
cancelable false
```

## Differences from browsers

- There is no DOM tree: dispatch has one target and no capture or bubble phase.
- During dispatch, `eventPhase` is `Event.AT_TARGET` and `composedPath()` holds only the current target.
- A listener that throws is reported; the remaining listeners still run.

<!-- api-reference:start dcf40cee5081 -->
## Reference

**Status:** Full · Not measured · since 1.1.0

### Exports

| Export | Kind | Status | Notes |
| --- | --- | --- | --- |
| `Event` | class | Full | `type`, `target`, `currentTarget`, `NONE`, `CAPTURING_PHASE`, `AT_TARGET`, `BUBBLING_PHASE`, `eventPhase`, `composedPath()`, `stopPropagation()`, `stopImmediatePropagation()`, `bubbles`, `cancelable`, `preventDefault()`, `defaultPrevented`, `composed`, `isTrusted`, `timeStamp`, `cancelBubble` |
| `CustomEvent` | class | Full | `detail` |
| `EventTarget` | class | Full | `addEventListener()`, `removeEventListener()`, `dispatchEvent()` |
<!-- api-reference:end -->