代码之家 › 专栏 › 技术社区 › Hoang Subin

如何修复“typeerror:window.location不是函数”?

jestjs vuejs2 vue.js unit-testing

Hoang Subin · 技术社区 · 6 年前

当我运行包含window.location逻辑的单元测试时。我将在终端上得到这个错误。

类型错误:window.location[(中间值)(中间值)(中间值)]不是函数

      35 |   localVue.use(VueRouter);
    > 36 |   const router = new VueRouter(...routerOptions);
      37 | 
      38 |   Object.keys(filters).forEach(key => {
      39 |     localVue.filter(key, filters[key]);

我的示例单元测试代码,只包含与window.location有关的逻辑

   beforeEach(() => {
      global.window = Object.create(window);
      const url = "http://localhost.com";
      Object.defineProperty(window, "location", {
        value: {
          href: url
        },
        writable: true
      });
    });

有人遇到这种情况吗?在这种情况下我真的需要帮助。

1 回复 | 直到 6 年前

Sergeon 6 年前

在你 jest.config.js 您可以添加 setup files 指向具有某些自定义配置的文件的条目。在这里,您可以声明 window 对象。例如,您的 jest.config.file 可以像:

module.exports = {
  ...
  'setupFiles': ['./tests/unit/config.main.js'],
  ...
}

然后,在 /tests/unit/config.main.js (或任何路径),您只需添加:

window.location = { value: { href: "http://localhost/" }};

在我自己的设置文件中,我也有这个 窗口 帮助者,例如:

window.alert = (msg) => { console.log(msg); };
window.matchMedia = () => ({});
window.scrollTo = () => { };

所以在你的应用程序中调用这些 窗口 方法不会破坏测试。

(实际上我从未尝试过设置 window.location 在安装文件中,但这应该是直接工作的)。

推荐文章

StuP · 响应式Vue组件在数据更改时不更新

2 年前

dbzx10299 · 对从Api端点返回的数据使用Vue转换组

2 年前

mrDandaleonx · Vue3获取div内容并将其发布到表单

2 年前

ateymour · Vue3在异步调用后将道具传递给子组件

2 年前

Artur Müller Romanov · 是否可以有条件地渲染布局?

2 年前

Ilijanovic · 对象可能未定义

2 年前

devAR · 单击其他组件时,单选按钮未保持选中状态

2 年前

Coderama · 在v-for指令中使用:key属性时,TS应出现类型错误

2 年前

Suffii · Vue表单输入绑定的条件绑定存在问题

2 年前

akkonrad · 函数的作用是:返回数据属性为空的实例

2 年前