refactor

src/components/dialogs/GroupDialog/__tests__/GroupDialogPhotosTab.test.js

@@ -0,0 +1,233 @@
+import { beforeEach, describe, expect, test, vi } from 'vitest';
+import { createTestingPinia } from '@pinia/testing';
+import { mount } from '@vue/test-utils';
+
+// ─── Mocks ───────────────────────────────────────────────────────────
+
+vi.mock('vue-i18n', () => ({
+    useI18n: () => ({
+        t: (key, params) => (params ? `${key}:${JSON.stringify(params)}` : key)
+    }),
+    createI18n: () => ({
+        global: { t: (key) => key },
+        install: vi.fn()
+    })
+}));
+
+vi.mock('../../../../plugin/router', () => {
+    const { ref } = require('vue');
+    return {
+        router: {
+            beforeEach: vi.fn(),
+            push: vi.fn(),
+            replace: vi.fn(),
+            currentRoute: ref({ path: '/', name: '', meta: {} }),
+            isReady: vi.fn().mockResolvedValue(true)
+        },
+        initRouter: vi.fn()
+    };
+});
+vi.mock('vue-router', async (importOriginal) => {
+    const actual = await importOriginal();
+    const { ref } = require('vue');
+    return {
+        ...actual,
+        useRouter: vi.fn(() => ({
+            push: vi.fn(),
+            replace: vi.fn(),
+            currentRoute: ref({ path: '/', name: '', meta: {} })
+        }))
+    };
+});
+vi.mock('../../../../plugin/interopApi', () => ({ initInteropApi: vi.fn() }));
+vi.mock('../../../../service/database', () => ({
+    database: new Proxy(
+        {},
+        {
+            get: (_target, prop) => {
+                if (prop === '__esModule') return false;
+                return vi.fn().mockResolvedValue(null);
+            }
+        }
+    )
+}));
+vi.mock('../../../../service/config', () => ({
+    default: {
+        init: vi.fn(),
+        getString: vi.fn().mockImplementation((_k, d) => d ?? '{}'),
+        setString: vi.fn(),
+        getBool: vi.fn().mockImplementation((_k, d) => d ?? false),
+        setBool: vi.fn(),
+        getInt: vi.fn().mockImplementation((_k, d) => d ?? 0),
+        setInt: vi.fn(),
+        getFloat: vi.fn().mockImplementation((_k, d) => d ?? 0),
+        setFloat: vi.fn(),
+        getObject: vi.fn().mockReturnValue(null),
+        setObject: vi.fn(),
+        getArray: vi.fn().mockReturnValue([]),
+        setArray: vi.fn(),
+        remove: vi.fn()
+    }
+}));
+vi.mock('../../../../service/jsonStorage', () => ({ default: vi.fn() }));
+vi.mock('../../../../service/watchState', () => ({
+    watchState: { isLoggedIn: false }
+}));
+vi.mock('../../../../service/request', () => ({
+    request: vi.fn().mockResolvedValue({ json: {} }),
+    processBulk: vi.fn(),
+    buildRequestInit: vi.fn(),
+    parseResponse: vi.fn(),
+    shouldIgnoreError: vi.fn(),
+    $throw: vi.fn(),
+    failedGetRequests: new Map()
+}));
+vi.mock('../../../../api', () => ({
+    groupRequest: {
+        getCachedGroupGallery: vi
+            .fn()
+            .mockResolvedValue({ json: [], params: {} })
+    },
+    userRequest: {}
+}));
+
+import GroupDialogPhotosTab from '../GroupDialogPhotosTab.vue';
+import { useGroupStore } from '../../../../stores';
+
+// ─── Helpers ─────────────────────────────────────────────────────────
+
+const MOCK_GALLERIES = [
+    {
+        id: 'g1',
+        name: 'Photos',
+        description: 'General photos',
+        membersOnly: false
+    },
+    {
+        id: 'g2',
+        name: 'Screenshots',
+        description: 'Game screenshots',
+        membersOnly: true,
+        roleIdsToView: null
+    }
+];
+
+const MOCK_GALLERY_IMAGES = {
+    g1: [
+        {
+            id: 'img1',
+            imageUrl: 'https://img/photo1.png',
+            groupId: 'grp_1',
+            galleryId: 'g1'
+        },
+        {
+            id: 'img2',
+            imageUrl: 'https://img/photo2.png',
+            groupId: 'grp_1',
+            galleryId: 'g1'
+        }
+    ],
+    g2: [
+        {
+            id: 'img3',
+            imageUrl: 'https://img/screen1.png',
+            groupId: 'grp_1',
+            galleryId: 'g2'
+        }
+    ]
+};
+
+/**
+ * @param {object} overrides
+ */
+function mountComponent(overrides = {}) {
+    const pinia = createTestingPinia({
+        stubActions: false
+    });
+
+    const groupStore = useGroupStore(pinia);
+    groupStore.groupDialog = {
+        id: 'grp_1',
+        visible: true,
+        ref: {
+            galleries: [...MOCK_GALLERIES]
+        },
+        galleries: { ...MOCK_GALLERY_IMAGES },
+        ...overrides
+    };
+
+    return mount(GroupDialogPhotosTab, {
+        global: {
+            plugins: [pinia],
+            stubs: {
+                RefreshCw: { template: '<svg class="refresh-icon" />' }
+            }
+        }
+    });
+}
+
+// ─── Tests ───────────────────────────────────────────────────────────
+
+describe('GroupDialogPhotosTab.vue', () => {
+    beforeEach(() => {
+        vi.clearAllMocks();
+    });
+
+    describe('rendering', () => {
+        test('renders gallery names', () => {
+            const wrapper = mountComponent();
+            expect(wrapper.text()).toContain('Photos');
+            expect(wrapper.text()).toContain('Screenshots');
+        });
+
+        test('renders gallery image counts', () => {
+            const wrapper = mountComponent();
+            expect(wrapper.text()).toContain('2');
+            expect(wrapper.text()).toContain('1');
+        });
+
+        test('renders gallery descriptions', () => {
+            const wrapper = mountComponent();
+            expect(wrapper.text()).toContain('General photos');
+        });
+
+        test('renders gallery images', () => {
+            const wrapper = mountComponent();
+            const images = wrapper.findAll('img');
+            expect(images.length).toBeGreaterThan(0);
+        });
+
+        test('renders refresh button', () => {
+            const wrapper = mountComponent();
+            const button = wrapper.find('button');
+            expect(button.exists()).toBe(true);
+        });
+
+        test('renders zero count for empty gallery', () => {
+            const wrapper = mountComponent({
+                galleries: { g1: [], g2: [] }
+            });
+            expect(wrapper.text()).toContain('0');
+        });
+    });
+
+    describe('loading state', () => {
+        test('refresh button is enabled initially', () => {
+            const wrapper = mountComponent();
+            const button = wrapper.find('button');
+            expect(button.attributes('disabled')).toBeUndefined();
+        });
+    });
+
+    describe('with no galleries', () => {
+        test('renders without gallery tabs when ref.galleries is empty', () => {
+            const wrapper = mountComponent({
+                ref: { galleries: [] },
+                galleries: {}
+            });
+            // No gallery tabs should be rendered
+            expect(wrapper.text()).not.toContain('Photos');
+            expect(wrapper.text()).not.toContain('Screenshots');
+        });
+    });
+});