From bbae64771a464d5a95adca9f67a4f1b564e6293b Mon Sep 17 00:00:00 2001 From: Jakob Scheid Date: Thu, 23 Jul 2026 13:41:49 +0200 Subject: [PATCH] test(settings): add switch component tests --- .../components/__tests__/Switch.test.js | 97 +++++++++++++++++++ src/test-utils/mountComponent.js | 50 ++++++++++ 2 files changed, 147 insertions(+) create mode 100644 src/features/settings/components/__tests__/Switch.test.js create mode 100644 src/test-utils/mountComponent.js diff --git a/src/features/settings/components/__tests__/Switch.test.js b/src/features/settings/components/__tests__/Switch.test.js new file mode 100644 index 0000000..267929f --- /dev/null +++ b/src/features/settings/components/__tests__/Switch.test.js @@ -0,0 +1,97 @@ +/* +Copyright 2026 Seekra + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import Switch from '../Switch.vue'; +import { mountComponent } from '@/test-utils/mountComponent.js'; +import { useSettingsStore } from '../../stores/settingsStore.js'; +import { expect, describe, test } from 'vitest'; +import { nextTick } from 'vue'; + +describe('Switch', () => { + test('shows value from store', async () => { + const wrapper = mountComponent(Switch, { + attrs: { + setting: { + name: 'switch', + i18n: 'switch1', + type: 'bool' + }, + path: 'switch' + } + }); + + const store = useSettingsStore(); + store.set('switch', true); + await nextTick(); + + const switchElement = wrapper.find('.switch-wrapper'); + const switchElementClasses = switchElement.classes(); + + expect(switchElementClasses).toContain('enabled'); + + store.set('switch', false); + await nextTick(); + + const switchElementClasses2 = switchElement.classes(); + expect(switchElementClasses2).not.toContain('enabled'); + }); + + test('toggles value in store', async () => { + const wrapper = mountComponent(Switch, { + attrs: { + setting: { + name: 'switch', + i18n: 'switch1', + type: 'bool' + }, + path: 'switch' + } + }); + + const switchElement = wrapper.find('.switch-wrapper'); + + const store = useSettingsStore(); + expect(store.get('switch')).toBeUndefined(); + + switchElement.trigger('click'); + await nextTick(); + expect(store.get('switch')).toBe(true); + + switchElement.trigger('click'); + await nextTick(); + expect(store.get('switch')).toBe(false); + }); + + test('shows correct translation', () => { + const translation = 'Switch'; + + const wrapper = mountComponent(Switch, { + attrs: { + setting: { + name: 'switch', + i18n: 'switch1', + type: 'bool' + }, + path: 'switch' + } + }, { + switch1: translation + }); + + const label = wrapper.find('label'); + expect(label.text()).toBe(translation); + }); +}); \ No newline at end of file diff --git a/src/test-utils/mountComponent.js b/src/test-utils/mountComponent.js new file mode 100644 index 0000000..5f796cc --- /dev/null +++ b/src/test-utils/mountComponent.js @@ -0,0 +1,50 @@ +/* +Copyright 2026 Seekra + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { createTestingPinia } from '@pinia/testing'; +import { vi } from 'vitest'; +import { mount } from '@vue/test-utils'; +import { createI18n } from 'vue-i18n'; +import { createMemoryHistory, createRouter } from 'vue-router'; + +export const mountComponent = function mountComponent (component, options = {}, i18nMessages = {}, routes = []) { + const i18n = createI18n({ + legacy: false, + locale: 'en', + messages: { + en: i18nMessages + } + }); + + const router = createRouter({ + history: createMemoryHistory(), + routes + }); + + return mount(component, { + global: { + plugins: [ + i18n, + router, + createTestingPinia({ + stubActions: false, + createSpy: vi.fn + }) + ], + }, + ...options + }); +}; \ No newline at end of file