Unit Test

Jest

Vue Test Utils

import { shallowMount } from '@vue/test-utils'
 
import ResourceName from 'resourcePath'
 
describe('ResourceName', () => {
  const wrapper = shallowMount(ResourceName)
 
  it('renders the correct message', () => {
    expect(wrapper.text()).toBe("Hello, I'm a resource auto generated by Clingon CLI!")
  })
})

Testing Library

import { render, screen, type RenderOptions } from '@testing-library/vue'
 
import ResourceName from 'resourcePath'
 
type RenderComponent = {
  props: InstanceType<typeof ResourceName>['$props']
  slots: InstanceType<typeof ResourceName>['$slots']
} & RenderOptions
 
describe('ResourceName', () => {
  const componentData: RenderComponent = {
    props: {},
    slots: {}
  }
 
  it('renders the correct message', () => {
    render(ResourceName, componentData)
 
    expect(
      screen.getByText("Hello, I'm a resource auto generated by Clingon CLI!")
    ).toBeInTheDocument()
  })
})

Vitest

Vue Test Utils

import { shallowMount } from '@vue/test-utils'
 
import { describe, it, expect } from 'vitest'
 
import ResourceName from 'resourcePath'
 
describe('ResourceName', () => {
  const wrapper = shallowMount(ResourceName)
 
  it('renders the correct message', () => {
    expect(wrapper.text()).toBe("Hello, I'm a resource auto generated by Clingon CLI!")
  })
})

Testing Library

import { render, screen, type RenderOptions } from '@testing-library/vue'
 
import { describe, it, expect } from 'vitest'
 
import ResourceName from 'resourcePath'
 
type RenderComponent = {
  props: InstanceType<typeof ResourceName>['$props']
  slots: InstanceType<typeof ResourceName>['$slots']
} & RenderOptions
 
describe('ResourceName', () => {
  const componentData: RenderComponent = {
    props: {},
    slots: {}
  }
 
  it('renders the correct message', () => {
    render(ResourceName, componentData)
 
    expect(
      screen.getByText("Hello, I'm a resource auto generated by Clingon CLI!")
    ).toBeInTheDocument()
  })
})

Style Function