0

我正在我的前端 Vue JS 项目中使用 Jest 对我的代码进行单元测试，我想要编写的测试之一是：

it('should show the advanced filters if user_id exists', () => {
  })

这是 Javascript 代码中创建的属性的一部分：

this.user_id = localStorage.getItem("user_id");
      if (this.user_id) {
        this.renderAdvancedFilters = true;
      }

此外，以下是正在导出的部分数据：

export default {
  data: () => ({
    renderAdvancedFilters: false,
    user_id: localStorage.getItem("user_id"),

因此，renderAdvancedFilters 最初设置为 false，但如果用户 id 存在，则将其设置为 true，然后显示高级过滤器。我如何编写一个单元测试来显示如果用户 id 存在，那么高级过滤器会显示在应用程序上？由于这是一个创建的属性，因此没有与要测试的应用程序交互，所以我认为我应该只是测试数据，但我不知道该怎么做。

我应该嘲笑 this.user_id 的数据吗？如果是这样，我该怎么做？

谢谢

4

1 回答 1

1

我想你只需要嘲笑这个localStorage.getItem();。

模拟它以返回一个虚拟用户 ID，然后您只需运行测试并检查结果是否符合您的预期。

似乎这是您需要模拟的唯一依赖项。

就像是：

global.localStorage = {
    getItem: jest.fn(() => 'some user id')
};
于 2020-01-07T20:58:45.770 回答