标签: jsdom
如何从简单的jsdom函数返回值？
我正在使用带有jquery的jsdom,它工作得很好.但是,我正在尝试模块化我的代码,所以我不重复自己,所以我用一些jsdom代码创建了一个基本函数,它接受了一些html(DOM),用jquery调整它,然后将它吐出来.但是,我无法返回结果,因此将其分配给调用var.我可能没有回到正确的地方,但我只是没有看到明显的情况.可以使用一点帮助.
这是代码:
function tweakIt(html_in){
var jsdom = require('jsdom');
jsdom.env({
html: html_in,
scripts: [
'../public/javascripts/jquery-1.7.1.min.js',
],
done: function(errors, window) {
var $ = window.$;
// do some jquery magic and manipulate the dom
$('body').append('<div>foo</div>');
console.log('Freshly Manipulated HTML: '+ $('body').html()); // it logs perfectly
return $('body').html(); // this isn't returned to where I called tweakIt() from, why not?
}
});
}
var oldhtml = '<html><body><div>some text</div></body></html>';
var newhtml = tweakIt(oldhtml); // never gets set because nothing gets returned, why?
编辑:
这确实是一个异步问题,所以这里是如何使用回调而不是返回来完成的:
function …推荐指数
解决办法
查看次数
替换 Node.js 中的 jsdom
更新
Node.js 4 现已发布，jsdom 完全支持它。下面的原始问题是关于 Node.js 0.12 的。
如果您不断收到诸如“jsdom 4.x 以上仅适用于 io.js，而不适用于 Node.js”之类的奇怪消息，我建议您将 Node.js 和 jsdom 都升级到最新版本。
jsdom 4 已停止支持 Node.js。
从文档：
请注意，从我们的 4.0.0 版本开始，jsdom 不再与 Node.js™ 一起工作，而是需要 io.js。如果您坚持使用 Node.js™ 等遗留技术，仍然欢迎您安装 3.x 系列的版本。
（我听说过关于 Joyent 管理 Node.js 的批评，但这里的“遗留技术”听起来有点贬义。）
虽然 jsdom 3.1.2 仍然可以正常工作，但我想在接收定期更新并支持 Node.js 的库上构建新项目。有人知道仍然由其作者维护的替代项目吗？
推荐指数
解决办法
查看次数
D3js：查找路径的边界框（没有getBBox（））？
以下代码适用于Chromium：
var node = window.d3.selectAll('#L1 > *:nth-child(2)');
var bbox = node.node().getBBox();
console.log(bbox) // {height: 44, width: 44, y: -13, x: 144}
但不适用于nodejs + jsdom：
"TypeError: Object [ PATH ] has no method 'getBBox' "
M. Bostock指出JSDOM 不支持 getBBox()
用什么D3js替代品来获得的边界框#L1 > *:nth-child(2)？
过去的努力使我到了这里：getBBox()基于小提琴
推荐指数
解决办法
查看次数
jsdom 9.1+ 在聚焦节点时不设置 document.activeElement
我正在使用 jsdom 和酶 + 摩卡 + 柴来测试 React 组件的行为。该组件具有聚焦 DOM 节点的方法（使用通常的node.focus()），我想测试该节点在调用时是否实际聚焦。
要知道哪个节点是重点，我将document.activeElement与我期望重点的节点进行比较。
但是，升级到 jsdom 9.1+ 后，document.activeElement似乎总是HTMLBodyElement，即使在调用节点的focus()方法之后也是如此。
使用 jsdom 9.0 测试运行良好。
我读到 jsdom 9.1+包含一些与焦点事件相关的更改，但我无法理解 make 的document.activeElement行为如何按预期进行。有什么帮助吗？
推荐指数
解决办法
查看次数
React-native/Enzyme:mount在本机元素上抛出"未知道具"
我正在使用React Native中的Jest和Enzyme编写测试来完全测试我的组件行为和内部函数.浅测试似乎没问题但是当使用mount时它只是抛出
这是我的package.json.
{
"name": "Despirithium",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"buildandroid": "react-native bundle --platform=android --entry-file=index.android.js --bundle-output='android/app/src/main/assets/index.android.bundle?dev=false",
"test": "jest --watch"
},
"dependencies": {
"axios": "^0.15.*",
"dpath": "^2.0.2",
"evosphere-router": "0.1.9",
"immutable": "^3.8.1",
"intl": "^1.2.5",
"lodash": "^4.16.4",
"node-uuid": "^1.4.7",
"normalizr": "^2.2.1",
"react": "15.3.2",
"react-native": "0.36.0",
"react-native-drawer": "^2.3.0",
"react-native-i18n": "^0.1.1",
"react-native-image-picker": "^0.22.12",
"react-native-router-flux": "^3.35.0",
"react-native-tabs": "^1.0.9",
"react-redux": "^4.4.5",
"redux": "^3.6.0",
"redux-immutable": "^3.0.8",
"redux-logger": "^2.7.0",
"redux-thunk": "^2.1.0",
"string-template": "^1.0.0",
"tcomb-form-native": "^0.6.1"
},
"devDependencies": {
"babel-core": "^6.14.0",
"babel-jest": "^17.0.2",
"babel-plugin-transform-object-rest-spread": …推荐指数
解决办法
查看次数
Jest/Enzyme/JSDOM document.body.createTextRange 不是函数
我正在尝试测试 React 组件，但似乎遇到了 JSDOM 问题。
当我安装我的组件时；
const component = mount(
<PipelineActions pipelineActions={value} {...actions} />
);
我收到一个错误；
document.body.createTextRange 不是函数
我尝试直接通过设置dom；
(global as any).document = jsdom.jsdom('');
(global as any).window = document.defaultView;
这没有效果。当我尝试时，console.log(document.body)我也会得到一些奇怪的东西；
HTMLBodyElement {}
似乎 DOM 没有正确构建，但我不确定为什么。有没有人见过这个？
推荐指数
解决办法
查看次数
使用jsdom或Canvas为node.js获取Vibrant.js样本
我有一个使用jsdom或Canvas在node.js中获取图像的过程.在下载过程中,我想在后端使用Vibrant.js提取样本.我的下面的代码都不起作用.
使用jsdom
const Vibrant = require('node-vibrant');
const request = require('request');
var jsdom = require("jsdom").jsdom;
var window = jsdom().defaultView;
var document = jsdom('<html><body></body></html>', {
features: {
FetchExternalResources : ['img']
}
});
var imgDom = document.createElement("img");
imgDom.onload = function() {
console.log('onload triggered');
// var imgData = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAAGElEQVQIW2P4DwcMDAxAfBvMAhEQMYgcACEHG8ELxtbPAAAAAElFTkSuQmCC';
// var imgData = imgDom.replace(/^data:image\/gif;base64,/, "")
// var binaryData = new Buffer(imageData, 'base64').toString('binary');
request.get(imgDom.src, function(err, res, body) {
console.log(body.length);
// Spit out a bunch of base64 code
let v = new Vibrant(new Buffer(body, 'binary').toString('base64')); …推荐指数
解决办法
查看次数
开玩笑不能处理insertAdjacentElement吗？
我想测试一个非常简单的JS函数
export function displaySpinner() {
const loadingOverlayDOM = document.createElement('DIV');
const spinner = document.createElement('IMG');
loadingOverlayDOM.id = 'overlay-spinner';
loadingOverlayDOM.className = 'content-overlay';
spinner.className = 'is-spinning';
spinner.setAttribute('src', '/assets/img/svg/icons/spinner.svg');
l loadingOverlayDOM.insertAdjacentElement('beforeend', spinner);
document.body.insertAdjacentElement('beforeend', loadingOverlayDOM);
}
与此（出于简化此问题的目的）Jest测试代码：
test('displaySpinner displays the spinner overlay in the current page', () => {
utils.displaySpinner();
});
但是测试对我大叫：
FAIL app/helper/utils.test.js
? utils › displaySpinner displays the spinner overlay in the current page
TypeError: loadingOverlayDOM.insertAdjacentElement is not a function
at Object.displaySpinner (app/helper/utils.js:185:439)
at Object.<anonymous> (app/helper/utils.test.js:87:15)
at Promise.resolve.then.el (node_modules/p-map/index.js:42:16)
at process._tickCallback (internal/process/next_tick.js:109:7)
这是Jest的错误，还是我在这里错过了一些东西？
推荐指数
解决办法
查看次数
React + 酶单元测试，无法访问window.addEventListener
我设置了一些单元测试，使用带有 jsdom 配置的酶的浅层方法进行测试。这一直运行良好，直到我遇到我正在使用的组件window.addEventListener。单元测试现在返回错误
TypeError: window.addEventListener is not a function
我的测试助手像这样为 JSdom 设置
import jsdom from 'jsdom';
...
global.document = jsdom.jsdom('<!doctype html><html><body></body></html>');
global.window = document.defaultView;
global.navigator = {userAgent: 'node.js'};
这工作正常，然后我升级到酶 3.x，现在我收到此错误。
我想知道我现在是否需要手动模拟 addEventListener ，或者我在访问它时做错了什么。
推荐指数
解决办法
查看次数
在JSDOM中进行测试：jQuery在连续运行中未找到Enzyme Mocha中的元素
我运行我的测试案例npm run test -- --watch，其中test被mocha --require babel-polyfill --require babel-core/register --require ./test/withDom.js --require ./test/test_helper.js --recursive ./test命令来运行测试用例使用mocha。
我的组件Jquery积极地用于操纵DOM和处理事件。
在我的第一次运行中，所有测试用例都运行良好。但是，一旦我修改了一些测试用例，观察者就会自动重新运行这些测试用例。在jquery无法找到使用选择以下的DOM元素。这很明显，因为DOM在我控制台登录wrapper.html()或时未修改页面body.innerHTML。
如果您能解决这个问题，我将不胜感激。
这是代码
withDom.js
import { JSDOM } from 'jsdom';
const jsdom = new JSDOM('<!doctype html><html><body><div id="root"></div></body></html>');
const { window } = jsdom;
function copyProps(src, target) {
Object.defineProperties(target, {
...Object.getOwnPropertyDescriptors(src),
...Object.getOwnPropertyDescriptors(target),
});
}
global.window = window;
global.document = window.document;
global.navigator = {
userAgent: 'node.js',
};
global.requestAnimationFrame …推荐指数
解决办法
查看次数
标签 统计
jsdom ×10
enzyme ×5
javascript ×4
node.js ×4
reactjs ×4
jestjs ×3
mocha.js ×2
unit-testing ×2
canvas ×1
d3.js ×1
express ×1
gulp-jest ×1
image ×1
react-native ×1
typescript ×1