以开玩笑的方式返回“[Getter/Setter]”的模拟函数答案

【问题标题】：Mocked function returning "[Getter/Setter]" in jest以开玩笑的方式返回“[Getter/Setter]”的模拟函数
【发布时间】：2021-10-16 01:18:29
【问题描述】：

我想测试一个使用这个 mixin 方法的组件：

methods: {
    getActiveTab() {
      return new Promise((resolve) => chrome.tabs.query({ active: true }, tabs => resolve(tabs[0])));
    },
...

我正在嘲笑这种方法（我正在使用jest-chrome）：

chrome.tabs.query.mockImplementation((opts, cb) => cb([{ 'title': 'Hello World' }]));

但是在我的组件中，当我这样做时：

async mounted() {
   this.activeTab = await this.getCurrentTab();
},

this.activeTab 将包含{ title: [Getter/Setter] }。如何强制它返回实际值？

如果我这样做：

jest.spyOn(chrome.tabs.query, 'get').mockImplementation((opts, cb) => cb([{ 'title': 'Hello World' }]));

我收到此错误：

无法窥探 get 属性，因为它不是函数；取而代之的是未定义

【问题讨论】：

this.activeTab 将包含 { title: [Getter/Setter] }。如何强制它返回实际值？ - 你断言实际值了吗？它看起来像是不应考虑的控制台输出。

【解决方案1】：

尝试以这种方式模拟getActiveTab：

  const wrapper = shallowMount(YourComponent, {
    mocks: {
      getActiveTab: jest.fn(() => { someData: 'someValue' })
    }
  })

OR 只是模拟 activeTab 属性，我假设它是您要进一步断言的目标属性：

  const wrapper = shallowMount(YourComponent, {
    mocks: {
      activeTab: {
        // desired data
      }
    }
  })

【讨论】：