使用 JSDom 设置 location.hash 和 location.href

Question

我正在使用 JSDom 设置一些测试，我需要 window 和 document 全局变量，并且还需要为每个测试传递不同的 URL/href。如何设置 location.hash 和 location.href 属性？

global.document = jsdom({url: 'http://localhost?something=not#test', 'html': ''});
global.window = document.defaultView;
console.log(window.location.href); // returns 'about:blank'
console.log(window.location.hash); // returns no value

我试过直接给 window.location.hash 赋值，结果相同。

Answer 1

您可以通过在url中的#之后输入字符串来设置location.hash。参考下面我的代码。

var jsdom = require("jsdom");

jsdom.env({
    url: 'http://localhost?something=not#hash', 'html': '',
    onload: function( window ) {
        console.log(window.location.href); // http://localhost/?something=not#hash
        console.log(window.location.hash); // #hash
    }
});

Answer 2

我运行也遇到过这个问题，但是在使 jsdom.env(...) 解决方案起作用时遇到了问题。我最终遵循了建议 here，并使用了 jsdom 的 changeURL 函数。我的测试夹具设置看起来像这样：

beforeEach(function() {
  // snip...
  jsdom.changeURL(window, 'http://foo/bar')
  // snip...
})

Answer 3

这个对我有用。

Object.defineProperty(window.location, 'href', {
  writable: true,
  value: 'some url'
});

Answer 4

其中很多答案都是旧的。较新的 jsdom 版本不允许您像以前那样覆盖内容。您正在寻找的是可能 reconfigure 函数。

import { JSDOM } from 'jsdom';

const jsdom = new JSDOM();

// ...
jsdom.reconfigure({
  url: 'https://www.test.com/whatever/url/you/want',
});
// ...

可以找到 reconfigure() 的文档 here。

查看 2020 年的 article 了解更多信息。

使用 JSDom 设置 location.hash 和 location.href

Set location.hash and location.href with JSDom

javascript

jsdom