본문 바로가기
프론트엔드/단위 테스트

Movie 컴포넌트 테스트

by step 1 2022. 2. 1.
반응형

Movie.vue 테스트

영화정보 id를 제대로 가져오는지 확인

 

테스트 코드

import {shallowMount} from '@vue/test-utils'
import store from '~/store'
import router from '~/routes'
import loadImage from '~/plugins/loadImage'
import Movie from '~/routes/Movie'

describe('routes/Movie.vue', () => {
  let wrapper

  beforeEach(async () => {
    window.scrollTo = jest.fn()
    router.push('/movie/tt1234567')
    await router.isReady()
    wrapper = shallowMount(Movie, {
      global: {
        plugins: [
          store,
          router,
          loadImage
        ]
      }
    })
  })

  test('최초 접속한 URL의 파라미터를 확인합니다.', () => {
    expect(wrapper.vm.$route.params.id).toBe('tt1234567?')
  })
})

 

 

 이미지크기 변환 테스트

  test('지정한 이미지 크기로 URL을 변경합니다.', () => {
    const url = 'https://google.com/sample_image_SX300.jpg'
    expect(wrapper.vm.requestDiffSizeImage(url)).toContain('SX700?.jpg')
  })

 

데이터가 존재하지않거나, N/A일경우 빈문자열로 호출하는지 테스트

 test('정상적인 이미지 주소가 아닌 경우 빈 문자열을 반환합니다.', () => {
    expect(wrapper.vm.requestDiffSizeImage()).toBe('?')
    expect(wrapper.vm.requestDiffSizeImage('N/A')).toBe('?')
  })

반응형