IT이야기

key.charAt는 createLocalVue()의 함수 오류가 아닙니다.

cyworld 2022. 6. 15. 20:57
반응형

key.charAt는 createLocalVue()의 함수 오류가 아닙니다.

createLocalVue 함수를 사용하면 TypeError: key.charAt는 함수가 아닙니다.흥미로운 점은 모든 컴포넌트 테스트에서 localVue를 사용하는 동안 일부 컴포넌트의 경우만 입력된다는 것입니다.테스트 코드 예를 다음에 나타냅니다.

import assign from 'lodash/assign'
import { mount, createLocalVue } from '@vue/test-utils'
import filters from '@/filters'
import { DateUtils } from '@/filters/date-utils'
import TaskCard from '@/components/molecules/TaskCard'
import Icon from '@/components/atoms/Icon'

const localVue = createLocalVue()

describe('TaskCard.vue', () => {
  let wrapper
  const task = {
    Status: 3,
    Name: 'Sample task',
    Deadline: Date.now(),
    Owner: {
      DisplayName: 'Admin'
    },
    Title: 'Sample title'
  }
  const position = 2

  beforeEach(() => {
    wrapper = mount(TaskCard, {
      localVue,
      propsData: {
        task,
        position
      }
    })
  })

  it('TaskCard should be a Vue instance and should have a div root element with the class "ca-task-card"', () => {
    expect(wrapper.isVueInstance()).toBe(true)
    expect(wrapper.is('div')).toBe(true)
    expect(wrapper.classes()).toContain('ca-task-card')
  })

  it('TaskCard\'s ca-task-order element should have the mocked status prop', () => {
    expect(wrapper.find('.ca-task-order').find('span').text()).toBe(position.toString())
  })

  it('TaskCard\'s first "p" element should contain the modified task name as text', () => {
    const newTask = assign(task, { Name: 'Sample task name' })
    wrapper.setProps({task: newTask})
    expect(wrapper.findAll('p').at(0).text()).toBe('Sample task name')
  })

  it('TaskCard should have 4 Icon component children', () => {
    expect(wrapper.findAll(Icon).length).toBe(4)
  })

  it('TaskCard should have the formatted deadline of the task in the element with the class "ca-task-card__deadline"', () => {
    expect(wrapper.find('.ca-task-card__deadline').text()).toBe(DateUtils.formatDate(wrapper.vm.task.Deadline))
  })

  it('TaskCard with completed status should have completed icon and not any others', () => {
    expect(wrapper.find('.ca-task-card__icon--completed').exists()).toBe(true)
    expect(wrapper.find('.ca-task-card__icon--delegated').exists()).toBe(false)
  })

  it('TaskCard with delegated status should have delegated icon and not any others', () => {
    const newTask = assign(task, {
      Status: 2,
      Name: 'Sample delegated task'
    })
    const newWrapper = mount(TaskCard, {
      localVue,
      propsData: {
        task: newTask,
        position
      }
    })

    expect(newWrapper.find('.ca-task-card__icon--completed').exists()).toBe(false)
    expect(newWrapper.find('.ca-task-card__icon--delegated').exists()).toBe(true)
  })
})

전체 스택 트레이스를 다음에 나타냅니다.

불합격 테스트\유닛\분자\TaskCard.spec.js ● 테스트 스위트를 실행하지 못했습니다.

TypeError: key.charAt is not a function

   6 | import Icon from '@/components/atoms/Icon'
   7 |
>  8 | const localVue = createLocalVue()
   9 |
  10 | describe('TaskCard.vue', () => {
  11 |   let wrapper

  at Object.has (node_modules/vue/dist/vue.common.js:1932:50)
  at baseGetTag (node_modules/@vue/test-utils/dist/vue-test-utils.js:448:48)
  at baseClone (node_modules/@vue/test-utils/dist/vue-test-utils.js:5047:15)
  at node_modules/@vue/test-utils/dist/vue-test-utils.js:5086:31
  at arrayEach (node_modules/@vue/test-utils/dist/vue-test-utils.js:4304:9)
  at baseClone (node_modules/@vue/test-utils/dist/vue-test-utils.js:5080:3)
  at node_modules/@vue/test-utils/dist/vue-test-utils.js:5086:31
  at arrayEach (node_modules/@vue/test-utils/dist/vue-test-utils.js:4304:9)
  at baseClone (node_modules/@vue/test-utils/dist/vue-test-utils.js:5080:3)
  at node_modules/@vue/test-utils/dist/vue-test-utils.js:5086:31
  at arrayEach (node_modules/@vue/test-utils/dist/vue-test-utils.js:4304:9)
  at baseClone (node_modules/@vue/test-utils/dist/vue-test-utils.js:5080:3)
  at cloneDeep (node_modules/@vue/test-utils/dist/vue-test-utils.js:5116:10)
  at node_modules/@vue/test-utils/dist/vue-test-utils.js:5141:11
      at Array.forEach (<anonymous>)
  at createLocalVue (node_modules/@vue/test-utils/dist/vue-test-utils.js:5137:20)
  at Object.<anonymous> (test/unit/specs/molecules/TaskCard.spec.js:8:46)

언급URL : https://stackoverflow.com/questions/50911151/key-charat-is-not-a-function-error-in-createlocalvue

반응형