Add vuex store tests for language filter

webapp/components/FilterPosts/FilterPosts.spec.js

@@ -73,7 +73,7 @@ describe('FilterPosts.vue', () => {
       'posts/filteredCategoryIds': jest.fn(() => []),
       'posts/filteredByUsersFollowed': jest.fn(),
       'posts/filteredByEmotions': jest.fn(() => []),
-      'posts/filteredLanguagesCodes': jest.fn(() => []),
+      'posts/filteredLanguageCodes': jest.fn(() => []),
     }
     const openFilterPosts = () => {
       const store = new Vuex.Store({ mutations, getters })
@@ -124,7 +124,7 @@ describe('FilterPosts.vue', () => {
     })
 
     it('sets language button attribute `primary` when corresponding language is filtered', () => {
-      getters['posts/filteredLanguagesCodes'] = jest.fn(() => ['es'])
+      getters['posts/filteredLanguageCodes'] = jest.fn(() => ['es'])
       const wrapper = openFilterPosts()
       spanishButton = wrapper
         .findAll('button.language-buttons')

webapp/components/FilterPosts/LanguageFilterMenuItems.vue

@@ -15,7 +15,7 @@
             <ds-button
               icon="check"
               @click.stop.prevent="resetLanguages"
-              :primary="!filteredLanguagesCodes.length"
+              :primary="!filteredLanguageCodes.length"
             />
             <ds-flex-item>
               <label class="language-labels">{{ $t('filter-posts.language.all') }}</label>
@@ -34,7 +34,7 @@
           <ds-flex-item width="100%" class="language-menu-item">
             <ds-button
               class="language-buttons"
-              :primary="filteredLanguagesCodes.includes(language.code)"
+              :primary="filteredLanguageCodes.includes(language.code)"
               @click.stop.prevent="toggleLanguage(language.code)"
             >
               {{ language.code.toUpperCase() }}
@@ -65,7 +65,7 @@ export default {
   },
   computed: {
     ...mapGetters({
-      filteredLanguagesCodes: 'posts/filteredLanguagesCodes',
+      filteredLanguageCodes: 'posts/filteredLanguageCodes',
     }),
   },
   methods: {

webapp/store/posts.js

@@ -86,7 +86,7 @@ export const getters = {
   filteredCategoryIds(state) {
     return get(state.filter, 'categories_some.id_in') || []
   },
-  filteredLanguagesCodes(state) {
+  filteredLanguageCodes(state) {
     return get(state.filter, 'language_in') || []
   },
   filteredByUsersFollowed(state) {

webapp/store/posts.spec.js

@@ -19,12 +19,24 @@ describe('getters', () => {
       expect(getters.filteredCategoryIds(state)).toEqual([24])
     })
 
-    it('returns empty array if filter is not set', () => {
+    it('returns empty array if category filter is not set', () => {
       state = { filter: { author: { followedBy_some: { id: 7 } } } }
       expect(getters.filteredCategoryIds(state)).toEqual([])
     })
   })
 
+  describe('filteredLanguageCodes', () => {
+    it('returns category ids if filter is set', () => {
+      state = { filter: { language_in: ['en', 'de', 'pt'] } }
+      expect(getters.filteredLanguageCodes(state)).toEqual(['en', 'de', 'pt'])
+    })
+
+    it('returns empty array if language filter is not set', () => {
+      state = { filter: { author: { followedBy_some: { id: 7 } } } }
+      expect(getters.filteredLanguageCodes(state)).toEqual([])
+    })
+  })
+
   describe('filter', () => {
     it('returns filter', () => {
       state = { filter: { author: { followedBy_some: { id: 7 } } } }
@@ -104,6 +116,19 @@ describe('getters', () => {
 })
 
 describe('mutations', () => {
+  describe('RESET_LANGUAGES', () => {
+    it('resets the languages filter', () => {
+      state = {
+        filter: {
+          author: { followedBy_some: { id: 7 } },
+          language_in: ['nl'],
+        },
+      }
+      mutations.RESET_LANGUAGES(state)
+      expect(getters.filter(state)).toEqual({ author: { followedBy_some: { id: 7 } } })
+    })
+  })
+
   describe('RESET_CATEGORIES', () => {
     beforeEach(() => {
       testMutation = categoryId => {
@@ -122,6 +147,45 @@ describe('mutations', () => {
     })
   })
 
+  describe('TOGGLE_LANGUAGE', () => {
+    beforeEach(() => {
+      testMutation = languageCode => {
+        mutations.TOGGLE_LANGUAGE(state, languageCode)
+        return getters.filter(state)
+      }
+    })
+
+    it('creates category filter if empty', () => {
+      state = { filter: {} }
+      expect(testMutation('de')).toEqual({ language_in: ['de'] })
+    })
+
+    it('adds language code to existing filter', () => {
+      state = { filter: { language_in: ['de'] } }
+      expect(testMutation('en')).toEqual({ language_in: ['de', 'en'] })
+    })
+
+    it('removes category id if present', () => {
+      state = { filter: { language_in: ['de', 'en'] } }
+      expect(testMutation('de')).toEqual({ language_in: ['en'] })
+    })
+
+    it('removes language filter if empty', () => {
+      state = { filter: { language_in: ['de'] } }
+      expect(testMutation('de')).toEqual({})
+    })
+
+    it('does not get in the way of other filters', () => {
+      state = {
+        filter: {
+          author: { followedBy_some: { id: 7 } },
+          language_in: ['de'],
+        },
+      }
+      expect(testMutation('de')).toEqual({ author: { followedBy_some: { id: 7 } } })
+    })
+  })
+
   describe('TOGGLE_CATEGORY', () => {
     beforeEach(() => {
       testMutation = categoryId => {