我正在使用HighStock在浏览器中生成一些图表.但现在我想将其中一些存储在服务器上.所以我知道HighCharts可以导出到服务器但是如果可能的话我宁愿使用其他方法.问题是在服务器上运行HighStock并将svg转换为某种图像格式,然后将其存储在那里.
快速谷歌搜索给了我这个页面.结合HighCharts和NodeJS似乎是正确的方法,但此解决方案不适用于较新版本的HighCharts.更准确地说,使用带有HighStock v1.0.2的NodeJS中的jsdom模块(v0.2.10 - 最新版本)(查看以下代码):
var jsdom = require('jsdom');
var fs = require('fs');
var jQuery = fs.readFileSync('./js/jquery-1.7.min.js').toString();
var Highstock = fs.readFileSync('./js/highstock.js').toString();
jsdom.env({
html: '<div id="container"></div>',
src: [ jQuery, Highstock ],
done: function(errors, window) {
if (errors) return console.log(errors);
var Highcharts = window.Highcharts;
var chart = new Highcharts.Chart(options);
}
});
抛出异常:
Error: Invalid character: Invalid character in tag name: <
不知何故,这两个库似乎没有一起工作.所以这可能适用于较旧版本的HighStock,但实际上我需要HighStock v1.0.2.
这个问题有什么解决方案吗？一些更好的图书馆jsdom？还是一些奇怪而又有效的技巧？任何想法都赞赏.:)
//编辑
感谢ReCoder,我设法让它运转起来.主要的是为forExport选项添加标志(防止例外).不幸的是,这产生了图表,但没有更新持有人.添加exporting模块(HighStock包的一部分)后,我设法让它工作.完整的工作代码如下所示:
var jsdom = require('jsdom'); …可能是nodejs/jsdom上的新手问题
我试图使用node.js刮一个网站.我正在使用jsdom和jquery来获取html并解析所需的东西.但是,不知何故,我得到的价值不是网站上显示的价值.基本上这些值是由javascript动态更改的,我想要这些值.我使用nodejs/jsdom进行抓取的全部原因是js将被执行并且我在该事件之后得到值.
有没有办法让jsdom等到javascript执行？或者我错了吗？我在这件事上搜索了很多东西.
我想让jsdom工作:)
这是代码:
var jsdom = require("jsdom");
var request = require("request");
var fs = require('fs');
var jquery = fs.readFileSync("./jquery-1.7.2.js", 'utf-8');
request({ uri:'http://nodejs.org/dist/' }, function (error, response, body) {
if (error && response.statusCode !== 200) {
console.log('HTTP request error... '+error);
}
jsdom.env({
html: body,
scripts: [
jquery
],
done: function(errors, window) {
console.log('done');
}
});
});
这是错误:
jsdom.js:171
features = JSON.parse(JSON.stringify(window.document.implementation._fea
^
TypeError: Cannot read property 'implementation' of undefined
我已经检查了是否提取了页面以及是否解析了jquery lib - 它们是.
我们可以看一下jsdom.js的实现:
[snip]
exports.env = exports.jsdom.env = function() {
[snip] …我想使用JSDom执行一些服务器方面的DOM操作.但是,尽管explcitly启用了querySelector,但在创建的文档中未定义:
var jsdom = require('jsdom');
// Yep, we've got QuerySelector turned on
jsdom.defaultDocumentFeatures = {
QuerySelector: true
};
var dom = jsdom.defaultLevel;
var document = jsdom.jsdom("<html><body><h1>Hello StackOverflow</h1></body></html>"),
window = document.createWindow();
然而:
console.log(document.querySelector)
返回
undefined
如何使用jsdom使document.querySelector正常工作？
应该是一个简单的问题.如何在jsDom对象中设置宽度？
jsdom.env({
url:'http://testdatalocation',
scripts: ['http://code.jquery.com/jquery.js'],
done: function(errors, tstWindow) {
console.log(tstWindow.innerWidth);
};
}
});
我无法弄清楚如何让"innerWidth"成为1024以外的任何东西
我遇到了这个问题在jest测试用例中需要systemjs时会抛出无效的URL
最后的评论之一表明
"通过在jsdom中设置referrer配置来操纵jsdom实例以获得有效的位置/ baseURI."
我想知道我有办法做到这一点吗？我可以jsdom从jest对象以某种方式访问实例吗？
我正在为包含Jquery的Typescript代码编写Mocha单元测试.我正在使用jsdom来获取文档对象.当我将我的TS代码编译为JS并运行测试时,它会抛出一个错误[ReferenceError:$未定义].
我的Typescript代码在这里
export function hello(element) : void {
$(element).toggleClass('abc');
};
我的单元测试代码如下:
import {hello} from '../src/dummy';
var expect = require('chai').expect;
var jsdom = require('jsdom');
var document = jsdom.jsdom();
var window = document.defaultView;
var $ = require('jquery')(window);
describe('TEST NAME', () => {
it('should run', (done) => {
hello($('div'));
done();
});
});
当我运行Mocha测试它显示
<failure message="$ is not defined"><![CDATA[ReferenceError: $ is not defined ...
]]></failure>
也尝试使用global.$ = require("jquery"); 但不起作用.
我有Frontend React + Webpack应用程序使用后端API.我的Webpack设置取决于window.location.origin属性,用于设置和部署过程.目前,我正在使用Karma testrunner并试图用AVA testrunner替换它.
我正在尝试将AVA 应用于webpack配方的这个单一条目设置我也将JSDOM应用为节点的dom模拟器.
一些测试捆绑在一起,使用该location.origin属性.在运行webpack && ava脚本期间会抛出错误:
var apiUrl = process.env.API_URL && process.env.NODE_ENV !== 'production' ? process.env.API_URL : location.origin;
ReferenceError: location is not defined
Karma在浏览器引擎上运行并window.location.origin动态再现值.与AVA不同.运行测试时它不会运行任何类型的浏览器.我只能(据我所知)"模仿"浏览器环境jsdom,这就是我想要做的.但是问题链接location.origin不支持特定属性jsdom
任何人都可以跟踪我的解决方案,window.location.origin为AVA动态(环保)重现吗？我知道我可以将它保持不变并将其存储在.env每个环境中.但这是我想要缓解的另一项维护任务.
我有一个ImageLoader类组件,我试图测试是否正在调用onloada上的函数HTMLImageElement.重要的是要注意ImageLoader按预期工作,我只是无法让测试运行.这是我的类组件的示例:
export default class ImageLoader extends React.Component {
// Omitted for brevity
setSrc = () => {
const { src } = this.props;
if (src) {
this.tmpImg = new Image();
// this.tmpImg.onload is never called
this.tmpImg.onload = () => console.log('???');
this.tmpImg.src = src;
}
}
// Omitted for brevity
}
对于我的测试,我遗漏了我实际测试的内容,因为我从未实际进入过该onload事件(console.log除非我手动调用,否则它不会在测试运行时this.tmpImg.onload()).
import { mount } from 'enzyme';
import ImageLoader from '../ImageLoader';
describe('ImageLoader', () => {
it('renders', …我正在使用command运行本机应用程序的测试套件jest。
测试将jest-runtime/build/index.js在该行的文件中失败
const wrapper = this._environment.runScript(transformedFile.script)[
(_script_transformer || _load_script_transformer()).default.EVAL_RESULT_VARIABLE];
与错误：
TypeError: Cannot read property 'Object.<anonymous>' of null
我的笑话版本是21.2.1。
无论如何，经过一番谷歌搜索后，我发现有人在跑步jest --env=jsdom。我尝试了一下，然后我的测试套件开始工作。
但是这个选项是什么意思呢？
我知道jsdom是DOM和HTML标准的实现。
但这对开玩笑有用吗？这如何改变玩笑的行为，以便现在测试通过？
jsdom ×10
javascript ×5
node.js ×5
jestjs ×3
jquery ×2
reactjs ×2
ava ×1
charts ×1
cloud9-ide ×1
contextify ×1
enzyme ×1
highcharts ×1
mocha.js ×1
react-native ×1
systemjs ×1
typescript ×1
unit-testing ×1
web-scraping ×1
webpack ×1