files/en-us/web/api/sourcebuffer/abort_event/index.md
{{APIRef("Media Source Extensions")}}{{AvailableInWorkers("window_and_dedicated")}}
The abort event of the {{domxref("SourceBuffer")}} interface is fired when the buffer appending is aborted, because the {{domxref("SourceBuffer.abort()")}} or {{domxref("SourceBuffer.remove()")}} method is called while the {{domxref("SourceBuffer.appendBuffer()")}} algorithm is still running. The {{domxref("SourceBuffer.updating", "updating")}} property transitions from true to false. This event is fired before the {{domxref("SourceBuffer.updateend_event", "updateend")}} event.
Use the event name in methods like {{domxref("EventTarget.addEventListener", "addEventListener()")}}, or set an event handler property.
addEventListener("abort", (event) => { })
onabort = (event) => { }
A generic {{domxref("Event")}}.
This example demonstrates how to abort an append operation and handle the abort event.
const sourceBuffer = source.addSourceBuffer(mimeCodec);
sourceBuffer.addEventListener("abort", () => {
downloadStatus.textContent = "Canceled";
});
sourceBuffer.addEventListener("update", () => {
downloadStatus.textContent = "Done";
});
sourceBuffer.addEventListener("updateend", () => {
source.endOfStream();
});
cancelButton.addEventListener("click", () => {
if (sourceBuffer.updating) {
sourceBuffer.abort();
}
});
downloadStatus.textContent = "Downloading...";
fetch(assetURL)
.then((response) => response.arrayBuffer())
.then((data) => {
downloadStatus.textContent = "Decoding...";
sourceBuffer.appendBuffer(data);
});
{{Specifications}}
{{Compat}}