From 695247ce3e8ef6a2703b3a9ac4e4e9855320041b Mon Sep 17 00:00:00 2001
From: Dhruv Bhanushali <dhruv_b@live.com>
Date: Thu, 9 Feb 2023 03:11:53 +0400
Subject: [PATCH] Tighten the condition for audio playback to continue across
 pages (#2147)

---
 src/components/VAudioTrack/VAudioTrack.vue           | 12 ++++++++++--
 .../components/AudioTrack/v-audio-track.spec.js      |  6 ++++++
 2 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/VAudioTrack/VAudioTrack.vue b/src/components/VAudioTrack/VAudioTrack.vue
index 5954807858..569a76391d 100644
--- a/src/components/VAudioTrack/VAudioTrack.vue
+++ b/src/components/VAudioTrack/VAudioTrack.vue
@@ -73,6 +73,10 @@ import {
   layoutMappings,
 } from "~/constants/audio"
 import { useSeekable } from "~/composables/use-seekable"
+import {
+  useMatchSearchRoutes,
+  useMatchSingleResultRoutes,
+} from "~/composables/use-match-routes"
 
 import { defineEvent } from "~/types/emits"
 
@@ -304,9 +308,13 @@ export default defineComponent({
         localAudio?.removeEventListener(name, fn)
       )
 
+      const { matches: isSearchRoute } = useMatchSearchRoutes()
+      const { matches: isSingleResultRoute } = useMatchSingleResultRoutes()
+
       if (
-        route.value?.params?.id === props.audio.id ||
-        mediaStore.getItemById(AUDIO, props.audio.id)
+        (isSingleResultRoute.value &&
+          route.value?.params?.id === props.audio.id) ||
+        (isSearchRoute.value && mediaStore.getItemById(AUDIO, props.audio.id))
       ) {
         /**
          * If switching to any route other than the single result
diff --git a/test/unit/specs/components/AudioTrack/v-audio-track.spec.js b/test/unit/specs/components/AudioTrack/v-audio-track.spec.js
index 69c4ab10f2..2b7cccfa6b 100644
--- a/test/unit/specs/components/AudioTrack/v-audio-track.spec.js
+++ b/test/unit/specs/components/AudioTrack/v-audio-track.spec.js
@@ -25,6 +25,12 @@ const mockI18n = new Vuei18n({
   messages: { en: enMessages },
 })
 
+jest.mock("~/composables/use-match-routes", () => ({
+  // mocking `Ref<boolean>` as `{ value: boolean }`
+  useMatchSearchRoutes: jest.fn(() => ({ matches: { value: false } })),
+  useMatchSingleResultRoutes: jest.fn(() => ({ matches: { value: false } })),
+}))
+
 jest.mock("~/composables/use-browser-detection", () => ({
   useBrowserIsBlink: jest.fn(() => false),
 }))