Initialise media element's range bindings to an empty array

Author: martinandert

src/generators/dom/visitors/Element/Binding.ts

@@ -267,7 +267,7 @@ function getBindingValue(
 	}
 
 	if (isMediaElement && (attribute.name === 'buffered' || attribute.name === 'seekable' || attribute.name === 'played')) {
-		return `@timeRangesToArray(${state.parentNode}.${attribute.name})`
+		return `${state.parentNode}.${attribute.name} ? @timeRangesToArray(${state.parentNode}.${attribute.name}) : []`
 	}
 
 	// everything else

test/js/samples/media-bindings/expected-bundle.js

@@ -184,19 +184,19 @@ function create_main_fragment(state, component) {
 
 	function audio_progress_loadedmetadata_handler() {
 		audio_updating = true;
-		component.set({ buffered: timeRangesToArray(audio.buffered) });
+		component.set({ buffered: audio.buffered ? timeRangesToArray(audio.buffered) : [] });
 		audio_updating = false;
 	}
 
 	function audio_loadedmetadata_handler() {
 		audio_updating = true;
-		component.set({ seekable: timeRangesToArray(audio.seekable) });
+		component.set({ seekable: audio.seekable ? timeRangesToArray(audio.seekable) : [] });
 		audio_updating = false;
 	}
 
 	function audio_timeupdate_handler() {
 		audio_updating = true;
-		component.set({ played: timeRangesToArray(audio.played) });
+		component.set({ played: audio.played ? timeRangesToArray(audio.played) : [] });
 		audio_updating = false;
 	}
 

test/js/samples/media-bindings/expected.js

@@ -5,19 +5,19 @@ function create_main_fragment(state, component) {
 
 	function audio_progress_loadedmetadata_handler() {
 		audio_updating = true;
-		component.set({ buffered: timeRangesToArray(audio.buffered) });
+		component.set({ buffered: audio.buffered ? timeRangesToArray(audio.buffered) : [] });
 		audio_updating = false;
 	}
 
 	function audio_loadedmetadata_handler() {
 		audio_updating = true;
-		component.set({ seekable: timeRangesToArray(audio.seekable) });
+		component.set({ seekable: audio.seekable ? timeRangesToArray(audio.seekable) : [] });
 		audio_updating = false;
 	}
 
 	function audio_timeupdate_handler() {
 		audio_updating = true;
-		component.set({ played: timeRangesToArray(audio.played) });
+		component.set({ played: audio.played ? timeRangesToArray(audio.played) : [] });
 		audio_updating = false;
 	}
 
@@ -138,4 +138,4 @@ function SvelteComponent(options) {
 
 assign(SvelteComponent.prototype, proto );
 
-export default SvelteComponent;
+export default SvelteComponent;