How can i test custom hooks like this?

[liujiapeng]

I read some tutorials for testing the composition api, but it looks like they all use the html output to test correctness. Sometimes I use custom hooks to write some logic, but I don't know how to test it, is there a demo for it?

import { ref } from 'vue'
const useService = () => {
   const count = ref(0)
   const addCount = () => count.value++
   
   return {
     count,
     addCount
   }
}

[cexbrayat]

Hi @liujiapeng

You don't need Vue Test Utils to test this: it's a simple function test.

I would write something like this (I did not test it):

test('addCount should increment count', () => {
  const service = useService();
  expect(service.count.value).toBe(0);
  service.addCoun();
  expect(service.count.value).toBe(1);
});

[liujiapeng]

it really works, thank u so much!!

[whitespacecode]

@cexbrayat
So you don't need to mount the component to test the useService ?

[cexbrayat]

@whitespacecode In most cases, you don't need to mount a component to test a composable.