From b20aacf5f1f8da9bd5ebcb198480617526ce5ed1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fernando=20Fern=C3=A1ndez?= <ferferga@hotmail.com>
Date: Wed, 19 Apr 2023 20:46:14 +0200
Subject: [PATCH] fix(useMediaControls): apply state when target ref changes
 (#2999)

---
 packages/core/useMediaControls/index.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/core/useMediaControls/index.ts b/packages/core/useMediaControls/index.ts
index 5b4cf6688ed..e6c469ca311 100644
--- a/packages/core/useMediaControls/index.ts
+++ b/packages/core/useMediaControls/index.ts
@@ -293,30 +293,30 @@ export function useMediaControls(target: MaybeRef<HTMLMediaElement | null | unde
   })
 
   /**
-   * Watch volume and change player volume when volume prop changes
+   * Apply composable state to the element, also when element is changed
    */
-  watch(volume, (vol) => {
+  watch([target, volume], () => {
     const el = toValue(target)
     if (!el)
       return
 
-    el.volume = vol
+    el.volume = volume.value
   })
 
-  watch(muted, (mute) => {
+  watch([target, muted], () => {
     const el = toValue(target)
     if (!el)
       return
 
-    el.muted = mute
+    el.muted = muted.value
   })
 
-  watch(rate, (rate) => {
+  watch([target, rate], () => {
     const el = toValue(target)
     if (!el)
       return
 
-    el.playbackRate = rate
+    el.playbackRate = rate.value
   })
 
   /**