Feat/testing

components/__tests__/home/Controls/GameButtons.test.ts

@@ -0,0 +1,63 @@
+import {mount} from "@vue/test-utils";
+import { describe, it, expect } from 'vitest';
+import GameButtons from "@/components/home/Controls/GameButtons.vue";
+
+
+describe('GameButtons', () => {
+    // Test component mounting
+    it('renders properly', () => {
+        const wrapper = mount(GameButtons);
+
+        // Check if both buttons are rendered
+        expect(wrapper.findAll('button')).toHaveLength(2);
+
+        // Check button text content
+        const buttons = wrapper.findAll('button');
+        expect(buttons[0].text()).toBe('Start Game');
+        expect(buttons[1].text()).toBe('Quick Game');
+    });
+
+    // Test Start Game button emission
+    it('emits startGame event when Start Game button is clicked', async () => {
+        const wrapper = mount(GameButtons);
+
+        // Find and click the Start Game button
+        const startGameButton = wrapper.findAll('button')[0];
+        await startGameButton.trigger('click');
+
+        // Check if the event was emitted
+        expect(wrapper.emitted()).toHaveProperty('startGame');
+        expect(wrapper.emitted('startGame')).toHaveLength(1);
+    });
+
+    // Test Quick Game button emission
+    it('emits quickGame event when Quick Game button is clicked', async () => {
+        const wrapper = mount(GameButtons);
+
+        // Find and click the Quick Game button
+        const quickGameButton = wrapper.findAll('button')[1];
+        await quickGameButton.trigger('click');
+
+        // Check if the event was emitted
+        expect(wrapper.emitted()).toHaveProperty('quickGame');
+        expect(wrapper.emitted('quickGame')).toHaveLength(1);
+    });
+
+    // Test multiple clicks
+    it('emits multiple events on multiple clicks', async () => {
+        const wrapper = mount(GameButtons);
+        const [startButton, quickButton] = wrapper.findAll('button');
+
+        // Click start game button twice
+        await startButton.trigger('click');
+        await startButton.trigger('click');
+
+        // Click quick game button twice
+        await quickButton.trigger('click');
+        await quickButton.trigger('click');
+
+        // Check if events were emitted correct number of times
+        expect(wrapper.emitted('startGame')).toHaveLength(2);
+        expect(wrapper.emitted('quickGame')).toHaveLength(2);
+    });
+});

components/__tests__/login/ProviderButton.test.ts

@@ -11,5 +11,27 @@ describe('ProviderButton', () => {
         expect(wrapper.text()).toContain('Sign in with ' + provider.name);
     });
 
+    // Test default props
+    it('uses default props when none provided', async () => {
+        const wrapper = await mountSuspended(ProviderButton);
+        expect(wrapper.text()).toContain('Sign in with Spotify');
+    });
+
+    // Test image rendering
+    it('renders the correct provider icon', async () => {
+        const wrapper = await mountSuspended(ProviderButton, {
+            props: {provider: provider.id}
+        });
+        const img = wrapper.find('img');
+        expect(img.attributes('src')).toContain('icons/spotify.svg');
+        expect(img.attributes('alt')).toBe('spotify');
+    });
+
+    // Test button styling
+    it('has correct styling classes', async () => {
+        const wrapper = await mountSuspended(ProviderButton);
+        const buttonDiv = wrapper.find('.flex');
+        expect(buttonDiv.classes()).toContain('bg-[#1DB954]'); // Spotify color
+    });
 
 });

package.json

@@ -10,7 +10,7 @@
     "start": "nuxt build && nuxt start",
     "postinstall": "nuxt prepare",
     "docs": "typedoc",
-    "docs:serve": "typedoc && npx serve docs"
+    "docs:serve": "typedoc && npx serve docs",
     "test": "vitest"
   },
   "dependencies": {
@@ -31,7 +31,7 @@
     "@types/jsonpath": "^0.2.4",
     "@types/node": "^22.8.5",
     "eslint": "^9.11.1",
-    "typedoc": "^0.26.10"
+    "typedoc": "^0.26.10",
     "@nuxt/test-utils": "^3.14.4",
     "@vue/test-utils": "^2.4.6",
     "happy-dom": "^15.7.4",