如何使用 vue 测试工具模拟带有 vue-socket.io-extended 的 socket.io-client

Question

这就是我从 vue main.js 集成 socket io 客户端的方式

import socketIoExt from 'vue-socket.io-extended'
import socketIo from 'socket.io-client'

Vue.use(socketIoExt, socketIo('http://192.168.1.1:8000'));

下面的代码是我请求 API 的示例函数之一

getUserInfo(user_id){
   console.log("before request")
   this.$socket.emit('userInfo', user_id, (err,res) => {
      console.log("inside the request API")
      return err ? err : res
   })
}

这是软件包版本：

"socket.io-client": "^4.1.2"
"vue-socket.io-extended": "^3.2.1"

我使用 vue cli 2

问题：如何使用 vue 测试工具模拟这个 API？

Answer 1

你可以在挂载组件时模拟 $socket 对象，像这样

const createComponent = (propsData) => (mount<Component>(
    Component, {
        propsData,
        mocks: {
            $socket: {
                client: {
                    disconnected: false,
                    connected: false,
                },
            },
        },
    },
));