linter: improve typing in test

Author: NiloCK

packages/platform-ui/src/server/index.spec.ts

@@ -1,19 +1,15 @@
 import { vi, describe, test, expect, beforeEach } from 'vitest';
 import serverRequest from './index';
-import { ServerRequest, Status } from '@vue-skuilder/common';
-
-// Create a minimal type that matches ServerRequest for testing
-type TestRequest = ServerRequest & {
-  type: 'TEST_REQUEST';
-  timeout?: number;
-};
+import { ServerRequestType, Status, CreateClassroom } from '@vue-skuilder/common';
 
+// Instead of extending ServerRequest, directly use the CreateClassroom type
 describe('serverRequest', () => {
   let mockXHR: {
     open: ReturnType<typeof vi.fn>;
     send: ReturnType<typeof vi.fn>;
     setRequestHeader: ReturnType<typeof vi.fn>;
     withCredentials: boolean;
+    timeout: number;
     onload?: () => void;
     ontimeout?: () => void;
     onerror?: () => void;
@@ -22,71 +18,104 @@ describe('serverRequest', () => {
     responseText?: string;
   };
 
+  // Create a base test request that matches CreateClassroom exactly
+  const baseTestRequest: CreateClassroom = {
+    type: ServerRequestType.CREATE_CLASSROOM,
+    user: 'testuser',
+    data: {
+      students: [],
+      teachers: ['testuser'],
+      name: 'Test Classroom',
+      classMeetingSchedule: 'Never',
+      peerAssist: false,
+      joinCode: 'TEST123',
+    },
+    response: null,
+  };
+
   beforeEach(() => {
     mockXHR = {
       open: vi.fn(),
       send: vi.fn(),
       setRequestHeader: vi.fn(),
       withCredentials: false,
+      timeout: 0,
     };
 
+    // eslint-disable-next-line
     global.XMLHttpRequest = vi.fn(() => mockXHR) as any;
   });
 
   test('configures XMLHttpRequest correctly', async () => {
-    // Set up the mock to do nothing on send
-    mockXHR.send = vi.fn();
-
-    // Create a promise that resolves when onload is called
-    const responsePromise = new Promise<void>((resolve) => {
-      mockXHR.onload = () => resolve();
-    });
+    // Create a valid request with a timeout
+    const testRequest: CreateClassroom = {
+      ...baseTestRequest,
+      timeout: 7000,
+    };
 
-    // Start the request but don't wait for it
-    const requestPromise = serverRequest<TestRequest>({ type: 'TEST_REQUEST' });
+    // Start the request
+    const requestPromise = serverRequest(testRequest);
 
     // Check that XMLHttpRequest was configured correctly
     expect(mockXHR.open).toHaveBeenCalledWith('POST', expect.any(String), true);
     expect(mockXHR.withCredentials).toBe(true);
     expect(mockXHR.setRequestHeader).toHaveBeenCalledWith('Content-Type', 'application/json');
     expect(mockXHR.timeout).toBe(7000);
-    expect(mockXHR.send).toHaveBeenCalledWith(JSON.stringify({ type: 'TEST_REQUEST' }));
-
-    // Simulate successful response after validation
-    mockXHR.responseText = JSON.stringify({ data: 'test', ok: true });
-    mockXHR.onload && mockXHR.onload();
+    expect(mockXHR.send).toHaveBeenCalledWith(JSON.stringify(testRequest));
+
+    // Simulate successful response with the expected format for CreateClassroom
+    mockXHR.responseText = JSON.stringify({
+      status: Status.ok,
+      ok: true,
+      joincode: 'ABC123',
+      uuid: '123-456-789',
+    });
+    if (mockXHR.onload) mockXHR.onload();
 
     // Wait for the request to complete
     const result = await requestPromise;
 
-    // Verify the result
-    expect(result.response).toEqual({ data: 'test', ok: true });
+    // Verify the result matches the expected format
+    expect(result.response).toEqual({
+      status: Status.ok,
+      ok: true,
+      joincode: 'ABC123',
+      uuid: '123-456-789',
+    });
   });
 
   test('handles successful response', async () => {
-    const responseData = { status: Status.success, ok: true, data: { id: '123' } };
-
     // Create a promise that will complete when onload is triggered
-    const requestPromise = serverRequest<TestRequest>({ type: 'TEST_REQUEST' });
-
-    // Simulate a successful response
-    mockXHR.responseText = JSON.stringify(responseData);
-    mockXHR.onload && mockXHR.onload();
+    const requestPromise = serverRequest(baseTestRequest);
+
+    // Simulate a successful response that matches the expected structure
+    mockXHR.responseText = JSON.stringify({
+      status: Status.ok,
+      ok: true,
+      joincode: 'TEST123',
+      uuid: '123-456',
+    });
+    if (mockXHR.onload) mockXHR.onload();
 
     // Wait for the request to complete
     const result = await requestPromise;
 
     // Verify the response was processed correctly
-    expect(result.response).toEqual(responseData);
+    expect(result.response).toEqual({
+      status: Status.ok,
+      ok: true,
+      joincode: 'TEST123',
+      uuid: '123-456',
+    });
   });
 
   test('handles JSON parse error in response', async () => {
     // Create a promise that will complete when onload is triggered
-    const requestPromise = serverRequest<TestRequest>({ type: 'TEST_REQUEST' });
+    const requestPromise = serverRequest(baseTestRequest);
 
     // Simulate an invalid JSON response
     mockXHR.responseText = 'Not valid JSON';
-    mockXHR.onload && mockXHR.onload();
+    if (mockXHR.onload) mockXHR.onload();
 
     // Wait for the request to complete
     const result = await requestPromise;
@@ -101,16 +130,19 @@ describe('serverRequest', () => {
 
   test('handles request timeout', async () => {
     // Create a request with custom timeout
-    const requestPromise = serverRequest<TestRequest>({
-      type: 'TEST_REQUEST',
+    const testRequest: CreateClassroom = {
+      ...baseTestRequest,
       timeout: 5000,
-    });
+    };
+
+    // Create a promise
+    const requestPromise = serverRequest(testRequest);
 
     // Verify timeout is set correctly
     expect(mockXHR.timeout).toBe(5000);
 
     // Simulate timeout
-    mockXHR.ontimeout && mockXHR.ontimeout();
+    if (mockXHR.ontimeout) mockXHR.ontimeout();
 
     // Wait for the request to complete
     const result = await requestPromise;
@@ -125,10 +157,10 @@ describe('serverRequest', () => {
 
   test('handles network error', async () => {
     // Create a request
-    const requestPromise = serverRequest<TestRequest>({ type: 'TEST_REQUEST' });
+    const requestPromise = serverRequest(baseTestRequest);
 
     // Simulate network error
-    mockXHR.onerror && mockXHR.onerror();
+    if (mockXHR.onerror) mockXHR.onerror();
 
     // Wait for the request to complete
     const result = await requestPromise;
@@ -148,7 +180,7 @@ describe('serverRequest', () => {
     });
 
     // Make the request which should catch the error
-    const result = await serverRequest<TestRequest>({ type: 'TEST_REQUEST' });
+    const result = await serverRequest(baseTestRequest);
 
     // Verify error is caught and handled
     expect(result.response).toEqual({