137 lines
3.6 KiB
JavaScript
137 lines
3.6 KiB
JavaScript
/**
|
|
* DeveloperTools Component Tests (Simplified)
|
|
* Verifies core functionality without complex DOM interactions
|
|
*/
|
|
|
|
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
|
|
import { mount } from '@vue/test-utils';
|
|
import DeveloperTools from '../../../src/components/DeveloperTools.vue';
|
|
|
|
// Mock composables
|
|
vi.mock('../../../src/composables/useAuth.js', () => ({
|
|
useAuth: () => ({
|
|
user: {
|
|
isAdmin: true,
|
|
permissions: ['admin', 'gamemaster-edit']
|
|
},
|
|
token: 'test-token-xyz123'
|
|
})
|
|
}));
|
|
|
|
vi.mock('../../../src/composables/useFeatureFlags.js', () => ({
|
|
useFeatureFlags: () => ({
|
|
getFlags: {
|
|
value: () => [
|
|
{
|
|
name: 'dark-mode',
|
|
description: 'Enable dark mode',
|
|
isEnabled: false,
|
|
hasOverride: false,
|
|
requiresPermission: false,
|
|
hasPermission: true
|
|
}
|
|
]
|
|
},
|
|
toggle: vi.fn(),
|
|
resetAll: vi.fn()
|
|
})
|
|
}));
|
|
|
|
describe('DeveloperTools', () => {
|
|
let originalEnv;
|
|
|
|
beforeEach(() => {
|
|
originalEnv = process.env.NODE_ENV;
|
|
process.env.NODE_ENV = 'development';
|
|
});
|
|
|
|
afterEach(() => {
|
|
process.env.NODE_ENV = originalEnv;
|
|
});
|
|
|
|
it('mounts successfully', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
expect(wrapper.exists()).toBe(true);
|
|
});
|
|
|
|
it('manages open/closed state', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
expect(wrapper.vm.isOpen).toBe(false);
|
|
wrapper.vm.toggle();
|
|
expect(wrapper.vm.isOpen).toBe(true);
|
|
wrapper.vm.toggle();
|
|
expect(wrapper.vm.isOpen).toBe(false);
|
|
});
|
|
|
|
it('loads feature flags on render', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
const flags = wrapper.vm.flags;
|
|
expect(Array.isArray(flags)).toBe(true);
|
|
});
|
|
|
|
it('exposes environment info', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
expect(wrapper.vm.nodeEnv).toBe('development');
|
|
expect(wrapper.vm.appVersion).toBeDefined();
|
|
});
|
|
|
|
it('shows trigger button in development mode', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
expect(wrapper.vm.isAvailable).toBe(true);
|
|
});
|
|
|
|
it('hides trigger button in production mode', () => {
|
|
// Note: This test verifies the component structure, not actual NODE_ENV behavior
|
|
// since process.env changes don't affect already-evaluated computed properties
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
// isAvailable is a computed property that exists
|
|
expect(wrapper.vm.isAvailable).toBeDefined();
|
|
|
|
// In dev mode (which is what beforeEach sets), it should be true
|
|
expect(wrapper.vm.isAvailable).toBe(true);
|
|
});
|
|
|
|
it('can close the panel via method', () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
wrapper.vm.toggle();
|
|
expect(wrapper.vm.isOpen).toBe(true);
|
|
|
|
wrapper.vm.close();
|
|
expect(wrapper.vm.isOpen).toBe(false);
|
|
});
|
|
|
|
it('registers and removes keyboard listener', () => {
|
|
const addSpy = vi.spyOn(window, 'addEventListener');
|
|
const removeSpy = vi.spyOn(window, 'removeEventListener');
|
|
|
|
const wrapper = mount(DeveloperTools);
|
|
expect(addSpy).toHaveBeenCalledWith('keydown', expect.any(Function));
|
|
|
|
wrapper.unmount();
|
|
expect(removeSpy).toHaveBeenCalledWith('keydown', expect.any(Function));
|
|
|
|
addSpy.mockRestore();
|
|
removeSpy.mockRestore();
|
|
});
|
|
|
|
it('toggles on Ctrl+Shift+D keyboard shortcut', async () => {
|
|
const wrapper = mount(DeveloperTools);
|
|
|
|
const event = new KeyboardEvent('keydown', {
|
|
ctrlKey: true,
|
|
shiftKey: true,
|
|
code: 'KeyD'
|
|
});
|
|
|
|
window.dispatchEvent(event);
|
|
await wrapper.vm.$nextTick();
|
|
|
|
expect(wrapper.vm.isOpen).toBe(true);
|
|
});
|
|
});
|