组件的单元测试怎么写，求助？

Question

大佬们帮忙指导一下，不太熟悉单元测试，正在学习！

下面是ui组件tree相关的单元测试，其中一个方法setChecked的描述，及单元测试的代码，如下

    test('setChecked', async () => {
      const { treeRef } = createTree({
        data() {
          return {
            showCheckbox: true,
            data: [
              {
                id: '1',
                label: 'node-1',
                children: [
                  {
                    id: '1-1',
                    label: 'node-1-1',
                    children: [
                      {
                        id: '1-1-1',
                        label: 'node-1-1-1',
                      },
                      {
                        id: '1-1-2',
                        label: 'node-1-1-2',
                      },
                    ],
                  },
                  {
                    id: '1-2',
                    label: 'node-1-2',
                    children: [
                      {
                        id: '1-2-1',
                        label: 'node-1-2-1',
                      },
                    ],
                  },
                  {
                    id: '1-3',
                    label: 'node-1-3',
                  },
                ],
              },
              {
                id: '2',
                label: 'node-2',
              },
            ],
          }
        },
      })
      await nextTick()
      treeRef.setChecked('1-1', true)
      const checkedKeys = treeRef.getCheckedKeys()
      const halfCheckedKeys = treeRef.getHalfCheckedKeys()
      expect(checkedKeys.toString()).toBe(['1-1', '1-1-1', '1-1-2'].toString())
      expect(halfCheckedKeys.toString()).toBe(['1'].toString())
    })

想写一下下面这个setCurrentKey方法的单元测试，方法描述，如下，希望测试情况里面包含 id 有0的案例，测试 treeRef.setCurrentKey('0')时，节点被选中

节点被选中时，会加上 is-current 这个类名

测试代码

 test('setCurrentKey', async () => {
      const { treeRef } = createTree({
        data() {
          return {
            data: [
              {
                id: '0',
                label: 'node-0',
              },
              {
                id: '1',
                label: 'node-1',
                children: [
                  {
                    id: '1-1',
                    label: 'node-1-1',
                    children: [
                      {
                        id: '1-1-1',
                        label: 'node-1-1-1',
                      },
                      {
                        id: '1-1-2',
                        label: 'node-1-1-2',
                      },
                    ],
                  },
                  {
                    id: '1-2',
                    label: 'node-1-2',
                    children: [
                      {
                        id: '1-2-1',
                        label: 'node-1-2-1',
                      },
                    ],
                  },
                  {
                    id: '1-3',
                    label: 'node-1-3',
                  },
                ],
              },
              {
                id: '2',
                label: 'node-2',
              },
            ],
          }
        },
      })
      // 怎么写？？我这样写的，测试不通过呢？不通过的提示如下图
      await nextTick()
      treeRef.setCurrentKey('0')
      const currentKeys = treeRef.getCurrentKey()
      const nodes = wrapper.findAll(TREE_NODE_CLASS_NAME)
      expect(currentKeys.toString()).toBe(['0'].toString())
      expect(nodes[0].classes()).toContain('is-current')
    })

为什么要

AssertionError: expected [ 'el-tree-node', 'is-focusable' ] to include 'is-current'

nodes如下，直接expect(nodes[0].classes()).toContain('is-current')为什么不行？

Answer 1

test('setCurrentKey', async () => {
  const { treeRef, wrapper } = createTree({
    // ... 数据
  })
  await nextTick()
  treeRef.setCurrentKey('0')
  await nextTick() 
  const currentKeys = treeRef.getCurrentKey()
  const nodes = wrapper.findAll('.el-tree-node') 
  expect(currentKeys.toString()).toBe(['0'].toString())
  expect(nodes[0].classes()).toContain('is-current') 
})