个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我正在使用 mocha 和 JsDom 来测试我的 React 组件。
首先我的组件工作得很好，所以这是测试环境的问题。
情况:
我有一个组件，可以呈现几个带有 id 的 select 标记。然后组件中的 componentDidMount 将使用 document.getElementById 获取这些选择标签并向其添加选项。但是当我运行测试时，这些 getElementById 显示为 null。
现在，如果我注释掉 componentDidMount，并断言如下所示的内容，它会完美地工作，因此组件确实渲染出了这些选择标签。
describe('test component', function(){
var renderedElement = ReactTestUtils.renderIntoDocument(<Component/>);
var renderedNode = ReactDom.findDOMNode(renderedElement);
it('should have the proper markup', function(){
assert.equal(renderedNode.childElementCount, 5);
[...]
})
})
是什么导致了这个问题？是否是因为我的测试环境中不存在 document.getElementById 文档对象，导致我使用了“假”文档对象，如果是这样，我应该如何测试它？
下面是我的 mocha jsdom 设置
(function () {
'use strict';
var jsdom = require('jsdom'),
baseHTML,
window;
if (!global.window) {
baseHTML = '<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><title>Tests</title></head><body></body></html>';
window = jsdom.jsdom(baseHTML).defaultView;
global.window = window;
global.document = window.document;
global.navigator = window.navigator;
}
}());
最佳答案
因此，在 React 中访问已安装 DOM 组件的规范方法是使用 ref。不要在 componentDidMount 中使用 document.getElementById() ，而是使用 ref={(element) => {/* 对像 this.element = element 这样的元素执行一些操作来保存它 */}}渲染时的元素。这将使用已安装的 DOM 元素获得正确的回调，而无需引用文档。
如果可能的话，应该在 React 代码中避免使用文档，因为它使得无法进行通用渲染。
关于reactjs - mocha JSDOM 在 React 上测试，getElementById 返回 null，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37106885/
26
4
0
我对如何使用 jsdom 仍然一头雾水。 jsdom.env() 和 jsdom.jsdom 有什么区别？ 最佳答案 The readme file解释说 jsdom.env is built for
我有一个使用 ES2015 模块语法的代码库，即。 从“bar”导入 foo。它也有这样的代码: // setup.js var foo = window.foo || ''; 我想使用 jsdom
有没有一种方法可以将 HTML 传递给 jest 内置 JSDOM 中的构造函数，例如 const dom = new JSDOM('Hello world'); - in orginal JSDOM
我正在使用 mocha 和 jsdom 对 JavaScript 库进行单元测试。库中的一个模块具有不同的行为，具体取决于文档是否准备好。为了测试这种行为，我需要模拟一个尚未完全准备好的文档(即它的
我想开始使用“jsdom”包jsdom:https://github.com/tmpvar/jsdom 我在文档中看到以下代码片段: var jsdom = require("jsdom"); jsd
Background 因此，我一直在遵循教程来了解 JS 测试框架，并了解到要测试 Web UI，最好使用 JSDOM 库，因为它不需要浏览器并带来 DOM，然后可以以 headless 方式执行。
我正在尝试使用 jsdom 来分析一些 html 内容。我看到的示例使用基于 html 内容的 jsdom.jsdom 文档的 .createWindow() 方法。 但是当我尝试按照这些示例进行操作
我正在尝试使用 Ember、Brunch 和 JSDom 进行 headless 测试。我正在使用 ember-brunch-skeleton 生成应用程序。 https://github.com/f
我已经安装了webppl-agents库(以及 webppl 和 webppl-dp )并尝试运行命令行测试，但我遇到了一些麻烦。 npm 文件模块 (1) 中的 jsdom 似乎存在依赖性问题(2)
在 express.js 中使用 jsdom.jsdom() 我创建了一个带有一些“基本”布局标记的文档，并将一些客户端库(例如 jQuery)附加到其窗口。 只需进行一次此设置就好了。 问题是窗口文
我创建了一个非常简单的页面，仅显示一条消息，因为我正在尝试测试 JSDOM 以使用 document。但是，我收到以下错误。 首先，我在网上看到了无数的例子，除了Stack Overflow上发布的问
这个问题已经有答案了: What do querySelectorAll and getElementsBy* methods return? (12 个回答) 已关闭 4 年前。 我正在尝试使用 T
根据JSDom README ，您可以传递一个 Javascript 字符串数组来执行，但似乎此功能对我不起作用。 这是我的 Node 应用程序: var fs = require('fs'); va
我正在使用 jsdom解析html const data = dom.window.document.querySelector('.row h1').textContent 在那种特殊情况下，我的数
所以我尝试用 jsdom 设置 mocha 测试，经过多次调试尝试，我将问题缩小到 jsdom 执行绝对 URL 脚本(例如 http://code.jquery.com/jquery- 2.1.3.
下面是使用 script 参数的 jsdom 代码的最小示例。尽管我尝试过寻找一种引用外部 JS 的方法，但我还是不断收到此消息 ReferenceError: exVar is not define
我似乎无法让 jsdom 执行外部脚本，而且我似乎找不到任何具体示例。当我调用我的测试函数时，我没有收到任何错误，但什么也没有发生。 这是我的代码: var window = jsdom.js
交叉发布自 https://github.com/tmpvar/jsdom/issues#issue/127 我将在第二天左右发布一个最小的测试用例 - 但我想看看是否有其他人遇到同样的问题 - 或者
我正在使用 jsdom 通过我的 Node.js 应用程序加载网页。有时，我没有获得完整的 DOM，因为一些网页使用脚本在 onload 事件被触发后动态加载它们的内容。 jsdom 默认情况下停用这
我正在尝试使用 jsdom 加载本地 HTML 文件，这是代码 var config = { file: "filename", scripts: ["node_modules
我是一名优秀的程序员,十分优秀！