Nuxt•7mo ago

Unit Tests for Nuxt's /server Directory

Do you have knowledge about how to conduct unit tests for the /server part of Nuxt? Specifically, I'm interested in testing the defineEventHandler function. But I can't find any documentation on the subject...

9 Replies

Flo•7mo ago

// @vitest-environment nuxt

import { describe, expect, it } from 'vitest'
import { H3Event, type EventHandlerRequest } from 'h3'
import getHandler from '~/server/api/os/[resourceType]/index.get'

vitest.stubGlobal("defineEventHandler", (func: any) => func);
vitest.stubGlobal("defineNitroPlugin", (e: any) => e);
vitest.stubGlobal("getValidatedRouterParams", (e: any, f: any) => f(e.context.params));

describe('testing os handler', async () => {
  it('should return projects', async () => {
    const event = {
      context: {
        params: {
          resourceType: 'projects'
        }
      },
    } as unknown as H3Event<EventHandlerRequest>

    const response = await getHandler(event);

    expect(response).toBeDefined();
    expect(response).toBeInstanceOf(Array);
    console.log(response)
  })

  it('should return an error on invalid resource types', async () => {
    const event = {
      context: {
        params: {
          resourceType: 'invalid'
        }
      },
    } as unknown as H3Event<EventHandlerRequest>

    await expect(() => getHandler(event)).rejects.toThrowError('Invalid enum value')

  })
})

// @vitest-environment nuxt

import { describe, expect, it } from 'vitest'
import { H3Event, type EventHandlerRequest } from 'h3'
import getHandler from '~/server/api/os/[resourceType]/index.get'

vitest.stubGlobal("defineEventHandler", (func: any) => func);
vitest.stubGlobal("defineNitroPlugin", (e: any) => e);
vitest.stubGlobal("getValidatedRouterParams", (e: any, f: any) => f(e.context.params));

describe('testing os handler', async () => {
  it('should return projects', async () => {
    const event = {
      context: {
        params: {
          resourceType: 'projects'
        }
      },
    } as unknown as H3Event<EventHandlerRequest>

    const response = await getHandler(event);

    expect(response).toBeDefined();
    expect(response).toBeInstanceOf(Array);
    console.log(response)
  })

  it('should return an error on invalid resource types', async () => {
    const event = {
      context: {
        params: {
          resourceType: 'invalid'
        }
      },
    } as unknown as H3Event<EventHandlerRequest>

    await expect(() => getHandler(event)).rejects.toThrowError('Invalid enum value')

  })
})

Good luck 😄 Alright, throwing a bunch of code in here isn't very nice. I'll try to explain... This is an example for a unit test. It is running in the nuxt context, without a running dev environment. I import the handler I want to test as getHandler, I feed it with a partial event object (like h3 does), in this case with a route parameter, and check the outcome. First one is good, the second one triggers an error.

RobinOP•7mo ago

Thanks for your code, you help me a lot with this! On the other hand I have an error, did you already get it?

- Expected
+ Received

- Object {
-   "email": "[email protected]",
-   "firstName": "John",
-   "idUser": "f91acba9-8bf7-423c-a737-96fd6cd346a1",
-   "lastName": "Doe",
-   "platformRole": "ADMIN",
-   "title": "CEO",
- }
+ [TypeError: Cannot read properties of undefined (reading 'req')]

- Expected
+ Received

- Object {
-   "email": "[email protected]",
-   "firstName": "John",
-   "idUser": "f91acba9-8bf7-423c-a737-96fd6cd346a1",
-   "lastName": "Doe",
-   "platformRole": "ADMIN",
-   "title": "CEO",
- }
+ [TypeError: Cannot read properties of undefined (reading 'req')]

I think it's in event intialization, something miss no ?

    const event = {
      context: {
        body: {
          email: '[email protected]',
          password: 'wrongpassword',
        },
      },
    } as unknown as H3Event<EventHandlerRequest>;

    const event = {
      context: {
        body: {
          email: '[email protected]',
          password: 'wrongpassword',
        },
      },
    } as unknown as H3Event<EventHandlerRequest>;

Flo•7mo ago

You probably missed the stub that replaces the function handling the body

RobinOP•7mo ago

This const { email, password } = await readBody(event); ?

Flo•7mo ago

yup

RobinOP•7mo ago

With something like that ?

vi.stubGlobal('readBody', (e: any) => e.context.body);

vi.stubGlobal('readBody', (e: any) => e.context.body);

Flo•7mo ago

I'm just guessing here, but yeah, that kinda looks good! copilot said: vitest.stubGlobal("readBody", (e: any) => e.body); But I guess that depends on how you build the event

Titan•3mo ago

I get eventHandler is not defined

Titan•3mo ago

when using import getHandler from './signed-url.post' in my test

Gaming

Programming

Unit Tests for Nuxt's /server Directory