Turn on additional search views frontend (#4043)

* Switch the additional_search_views on Signed-off-by: Olga Bulat <[email protected]> * Update tests Signed-off-by: Olga Bulat <[email protected]> --------- Signed-off-by: Olga Bulat <[email protected]>
WordPress · Apr 9, 2024 · d25fa3a · d25fa3a
1 parent d377c69
commit d25fa3a
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 13 deletions.
diff --git a/frontend/feat/feature-flags.json b/frontend/feat/feature-flags.json
@@ -12,10 +12,10 @@
     "additional_search_views": {
       "status": {
         "staging": "switchable",
-        "production": "disabled"
+        "production": "switchable"
       },
       "description": "Toggle additional search views for tag/creator/source.",
-      "defaultState": "off",
+      "defaultState": "on",
       "storage": "cookie"
     },
     "additional_search_types": {

diff --git a/frontend/src/components/VMediaInfo/VMediaTags.vue b/frontend/src/components/VMediaInfo/VMediaTags.vue
@@ -58,6 +58,7 @@ import type { Tag } from "~/types/media"
 import type { SupportedMediaType } from "~/constants/media"
 import { useFeatureFlagStore } from "~/stores/feature-flag"
 import { useSearchStore } from "~/stores/search"
+import { useI18n } from "~/composables/use-i18n"
 
 import { focusElement } from "~/utils/focus-management"
 
@@ -87,7 +88,8 @@ export default defineComponent({
 
     const searchStore = useSearchStore()
     const featureFlagStore = useFeatureFlagStore()
-    const { app, $sendCustomEvent } = useContext()
+    const { $sendCustomEvent } = useContext()
+    const i18n = useI18n()
 
     const additionalSearchViews = computed(() =>
       featureFlagStore.isOn("additional_search_views")
@@ -106,7 +108,7 @@ export default defineComponent({
 
     const collapsibleRowsStartAt = ref<number>()
     const dir = computed(() => {
-      return app.i18n.localeProperties.dir
+      return i18n.localeProperties.dir
     })
 
     function isFurtherInline(previous: HTMLElement, current: HTMLElement) {

diff --git a/frontend/test/unit/specs/components/AudioTrack/v-audio-track.spec.js b/frontend/test/unit/specs/components/AudioTrack/v-audio-track.spec.js
@@ -58,9 +58,9 @@ describe("AudioTrack", () => {
 
   it("should render the full audio track component even without duration", () => {
     options.propsData.layout = "full"
-    const { getByText } = render(VAudioTrack, options, configureVue)
-    const creator = getByText(props.audio.creator)
-    expect(creator).toBeInstanceOf(HTMLAnchorElement)
+    const { getByRole } = render(VAudioTrack, options, configureVue)
+    const creator = getByRole("link", { name: props.audio.creator })
+    expect(creator).toBeVisible()
   })
 
   it("should show audio title as main page title in full layout", () => {
@@ -73,10 +73,13 @@ describe("AudioTrack", () => {
 
   it("should show audio creator in a full layout with link", () => {
     options.propsData.layout = "full"
-    const { getByText } = render(VAudioTrack, options, configureVue)
-    const element = getByText(props.audio.creator)
-    expect(element).toBeInstanceOf(HTMLAnchorElement)
-    expect(element).toHaveAttribute("href", props.audio.creator_url)
+    const { getByRole } = render(VAudioTrack, options, configureVue)
+    const element = getByRole("link", { name: props.audio.creator })
+    expect(element).toBeVisible()
+    expect(element).toHaveAttribute(
+      "href",
+      `/audio/collection?source=jamendo&creator=${props.audio.creator}`
+    )
   })
 
   it("should render the row audio track component even without duration", () => {

diff --git a/frontend/test/unit/test-utils/i18n.js b/frontend/test/unit/test-utils/i18n.js
@@ -2,10 +2,12 @@ import VueI18n from "vue-i18n"
 
 const messages = require("~/locales/en.json")
 
-export const i18n = new VueI18n({
+const i18n = new VueI18n({
   locale: "en",
   fallbackLocale: "en",
   messages: {
     en: messages,
   },
 })
+i18n.localeProperties = { code: "en", dir: "ltr" }
+export { i18n }
diff --git a/frontend/test/unit/test-utils/pinia.js b/frontend/test/unit/test-utils/pinia.js
@@ -25,7 +25,12 @@ export const createPinia = () =>
         },
       },
       error: jest.fn(),
-      localePath: jest.fn(),
+      localePath: jest.fn((val) => {
+        const queryString = Object.keys(val?.query)
+          .map((key) => key + "=" + val?.query[key])
+          .join("&")
+        return `${val?.path ?? "/"}?${queryString}`
+      }),
     },
   }))