Merge pull request #1720 from NatLibFi/issue1692-remove-search-language-cookie

Remove the search language cookie

Author: joelit

resource/js/vocab-search.js

@@ -69,7 +69,7 @@ const vocabSearch = Vue.createApp({
       return false
     },
     parseSearchLang () {
-      // if content language can be found from uri params, use that and update it to SKOSMOS object and to search lang cookie
+      // if content language can be found from uri params, use that and update it to SKOSMOS object
       const urlParams = new URLSearchParams(window.location.search)
       const paramLang = urlParams.get('clang')
       const anyLang = urlParams.get('anylang')
@@ -81,19 +81,11 @@ const vocabSearch = Vue.createApp({
         this.changeLang(paramLang)
         return paramLang
       }
-      // use searchLangCookie if it can be found, otherwise pick content lang from SKOSMOS object
-      const cookies = document.cookie.split('; ')
-      const searchLangCookie = cookies.find(cookie =>
-        cookie.startsWith('SKOSMOS_SEARCH_LANG='))
-      if (searchLangCookie) {
-        const selectedLanguage = searchLangCookie.split('=')[1]
-        if (selectedLanguage !== 'all') {
-          window.SKOSMOS.content_lang = selectedLanguage
-        }
-        return selectedLanguage
-      } else {
+      // otherwise pick content lang from SKOSMOS object (it should always exist)
+      if (window.SKOSMOS.content_lang) {
         return window.SKOSMOS.content_lang
       }
+      return null
     },
     renderMatchingPart (searchTerm, label, lang = null) {
       if (label) {
@@ -151,6 +143,9 @@ const vocabSearch = Vue.createApp({
         if ('uri' in result) { // create relative Skosmos page URL from the search result URI
           result.pageUrl = window.SKOSMOS.vocab + '/' + window.SKOSMOS.lang + '/page?'
           const urlParams = new URLSearchParams({ uri: result.uri })
+          if (this.selectedLanguage !== window.SKOSMOS.lang) { // add content language parameter
+            urlParams.append('clang', this.selectedLanguage)
+          }
           result.pageUrl += urlParams.toString()
         }
         // render search result renderedTypes
@@ -184,19 +179,19 @@ const vocabSearch = Vue.createApp({
       const searchUrl = vocabHref + 'search?' + searchUrlParams.toString()
       window.location.href = searchUrl
     },
-    changeLang (lang) {
-      this.selectedLanguage = lang
-      this.setSearchLangCookie(lang)
+    changeLang (clang) {
+      this.selectedLanguage = clang
+      window.SKOSMOS.content_lang = clang
       this.resetSearchTermAndHideDropdown()
     },
-    changeContentLangAndReload (lang) {
-      this.changeLang(lang)
+    changeContentLangAndReload (clang) {
+      this.changeLang(clang)
       const params = new URLSearchParams(window.location.search)
-      if (lang === 'all') {
+      if (clang === 'all') {
         params.set('anylang', 'true')
       } else {
         params.delete('anylang')
-        params.set('clang', lang)
+        params.set('clang', clang)
       }
       this.$forceUpdate()
       window.location.search = params.toString()
@@ -212,14 +207,6 @@ const vocabSearch = Vue.createApp({
     showAutoComplete () {
       this.showDropdown = true
       this.$forceUpdate()
-    },
-    setSearchLangCookie (lang) {
-      // The cookie path should be relative if the baseHref is known
-      let cookiePath = '/'
-      if (window.SKOSMOS.baseHref && window.SKOSMOS.baseHref.replace(window.origin, '')) {
-        cookiePath = window.SKOSMOS.baseHref.replace(window.origin, '')
-      }
-      document.cookie = `SKOSMOS_SEARCH_LANG=${this.selectedLanguage};path=${cookiePath}`
     }
   },
   template: `

tests/cypress/template/vocab-search-bar.cy.js

@@ -156,6 +156,24 @@ describe('Vocab search bar', () => {
       cy.get('#main-container').click({ force: true }); // using force true to click on elements not considered actionable
       cy.get('#search-autocomplete-results').should('not.be.visible'); // the autocomplete should disappear
     })
+    it('Search language parameter is passed to the autocomplete result links', () => {
+      cy.visit('/yso/sv/')
+
+      // Choose 'fi' for search & content language
+      cy.get('#language-selector .dropdown-toggle').click();
+      cy.get('#language-list .dropdown-item').contains('finska').click();
+
+      // Searchg for 'kissa'
+      cy.get('#search-field').type('aarre');
+      cy.get('#search-autocomplete-results', { timeout: 20000 }).should('be.visible'); // the autocomplete should appear
+
+      // Click the first search result
+      cy.get('#search-autocomplete-results li:first-child a').click();
+
+      // The language parameters should persist on the concept page
+      cy.url().should('include', '/sv/');
+      cy.url().should('include', 'clang=fi');
+    })
   });
 
   describe('Search Result Rendering', () => {
@@ -195,27 +213,4 @@ describe('Vocab search bar', () => {
       })
     })
   });
-
-  describe('Cookie Management', () => {
-    it('The search language cookie is set', () => {
-      cy.visit('/yso/fi/');
-
-      // Select a language option from the dropdown
-      cy.get('#language-selector .dropdown-toggle').click();
-      cy.get('#language-list .dropdown-item').contains('ruotsi').click();
-
-      // Test that the cookie has been set correctly
-      cy.getCookie('SKOSMOS_SEARCH_LANG').should('have.property', 'value', 'sv');
-    });
-
-    it('The search language cookie is read', () => {
-      cy.visit('/'); // setting the cookie at the front page to make sure the cookies are set globally
-      cy.setCookie('SKOSMOS_SEARCH_LANG', 'en');
-      cy.visit('/yso/fi/');
-
-      // Test that the cookie value has been read and used to initialize the language selector
-      cy.get('.dropdown .dropdown-toggle').should('contain', 'englanti');
-
-    });
-  });
 })