fix media bindings

src/compile/render-dom/wrappers/Element/Binding.ts

@@ -75,10 +75,7 @@ export default class BindingWrapper {
 			(parent.node.name === 'input' && type === 'file') // TODO others?
 		);
 
-		this.needsLock = !this.isReadOnly && (
-			// TODO others?
-			parent.node.name !== 'input'
-		);
+		this.needsLock = this.node.name === 'currentTime'; // TODO others?
 	}
 
 	get_dependencies() {
@@ -107,6 +104,16 @@ export default class BindingWrapper {
 
 		let updateConditions: string[] = this.needsLock ? [`!${lock}`] : [];
 
+		const dependencyArray = [...this.node.expression.dynamic_dependencies]
+
+		if (dependencyArray.length === 1) {
+			updateConditions.push(`changed.${dependencyArray[0]}`)
+		} else if (dependencyArray.length > 1) {
+			updateConditions.push(
+				`(${dependencyArray.map(prop => `changed.${prop}`).join(' || ')})`
+			)
+		}
+
 		// model to view
 		let updateDom = getDomUpdater(parent, this);
 
@@ -144,16 +151,6 @@ export default class BindingWrapper {
 				}
 		}
 
-		const dependencyArray = [...this.node.expression.dynamic_dependencies]
-
-		if (dependencyArray.length === 1) {
-			updateConditions.push(`changed.${dependencyArray[0]}`)
-		} else if (dependencyArray.length > 1) {
-			updateConditions.push(
-				`(${dependencyArray.map(prop => `changed.${prop}`).join(' || ')})`
-			)
-		}
-
 		if (updateDom) {
 			block.builders.update.addLine(
 				updateConditions.length ? `if (${updateConditions.join(' && ')}) ${updateDom}` : updateDom

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

@@ -11,16 +11,6 @@ function create_fragment(component, ctx) {
 		ctx.audio_timeupdate_handler.call(audio);
 	}
 
-	function audio_play_pause_handler() {
-		audio_updating = true;
-		ctx.audio_play_pause_handler.call(audio);
-	}
-
-	function audio_volumechange_handler() {
-		audio_updating = true;
-		ctx.audio_volumechange_handler.call(audio);
-	}
-
 	return {
 		c() {
 			audio = createElement("audio");
@@ -32,11 +22,11 @@ function create_fragment(component, ctx) {
 			dispose = [
 				addListener(audio, "timeupdate", audio_timeupdate_handler),
 				addListener(audio, "durationchange", ctx.audio_durationchange_handler),
-				addListener(audio, "play", audio_play_pause_handler),
-				addListener(audio, "pause", audio_play_pause_handler),
+				addListener(audio, "play", ctx.audio_play_pause_handler),
+				addListener(audio, "pause", ctx.audio_play_pause_handler),
 				addListener(audio, "progress", ctx.audio_progress_handler),
 				addListener(audio, "loadedmetadata", ctx.audio_loadedmetadata_handler),
-				addListener(audio, "volumechange", audio_volumechange_handler)
+				addListener(audio, "volumechange", ctx.audio_volumechange_handler)
 			];
 		},
 
@@ -49,9 +39,9 @@ function create_fragment(component, ctx) {
 		},
 
 		p(changed, ctx) {
-			if (!audio_updating && !isNaN(ctx.currentTime) && changed.currentTime) audio.currentTime = ctx.currentTime;
-			if (!audio_updating && audio_is_paused !== (audio_is_paused = ctx.paused) && changed.paused) audio[audio_is_paused ? "pause" : "play"]();
-			if (!audio_updating && !isNaN(ctx.volume) && changed.volume) audio.volume = ctx.volume;
+			if (!audio_updating && changed.currentTime && !isNaN(ctx.currentTime)) audio.currentTime = ctx.currentTime;
+			if (changed.paused && audio_is_paused !== (audio_is_paused = ctx.paused)) audio[audio_is_paused ? "pause" : "play"]();
+			if (changed.volume && !isNaN(ctx.volume)) audio.volume = ctx.volume;
 			audio_updating = false;
 		},