span和strong标记在jsdom中不起作用



我是jsdom的新手,我只想在节点服务中使用draft js将html标记转换为json。我得到了用于转换的jsdom,所以我处理了它,所以正常的标签工作得很好,但有些标签不工作。这是我的密码。

const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM(`<!DOCTYPE html>`)).window;
global.document = document;
global.navigator = window.navigator
global.HTMLElement = window.HTMLElement
const djs = require('draft-js')
const html = '<p>Hey this <span>editor</span> rocks 😀</p>';
const json=djs.convertToRaw(djs.ContentState.createFromBlockArray(djs.convertFromHTML(html)))
console.log("Hello",json);
var jQuery = require('jquery')(window);

它给我错误

node:22923) UnhandledPromiseRejectionWarning: ReferenceError: Node is not defined
at isElement (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/isElement.js:18:28)
at isHTMLImageElement (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/isHTMLImageElement.js:20:10)
at isValidImage (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/convertFromHTMLToContentBlocks.js:184:8)
at ContentBlocksBuilder._toBlockConfigs (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/convertFromHTMLToContentBlocks.js:490:11)
at ContentBlocksBuilder._toBlockConfigs (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/convertFromHTMLToContentBlocks.js:432:52)
at ContentBlocksBuilder.addDOMNode (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/convertFromHTMLToContentBlocks.js:333:82)
at Object.convertFromHTMLToContentBlocks [as convertFromHTML] (/home/ec2-user/environment/info-data-migration/node_modules/draft-js/lib/convertFromHTMLToContentBlocks.js:791:63)
at Object.rawFromHTML (/home/ec2-user/environment/info-data-migration/controller/jsontoHTMLConverter.js:170:24)
at Object.getCandidateTableData (/home/ec2-user/environment/info-data-migration/controller/candidate_fullfile.js:31:119)
at process._tickCallback (internal/process/next_tick.js:68:7)
(node:22923) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:22923) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

有趣的事实代码在没有span标记的情况下工作。

const { JSDOM } = jsdom;
const { window } = new JSDOM();
const { document } = (new JSDOM(`<!DOCTYPE html>`)).window;
global.document = document;
global.navigator = window.navigator
global.HTMLElement = window.HTMLElement
const djs = require('draft-js')
const html = '<p>Hey this rocks 😀</p>';
const json=djs.convertToRaw(djs.ContentState.createFromBlockArray(djs.convertFromHTML(html)))
console.log("Hello",json);
var jQuery = require('jquery')(window);

我需要将html数据转换为json。

由于要将浏览器对象添加到节点的global,因此还需要添加Node对象,如下所示:

// [...]
global.HTMLElement = window.HTMLElement
global.Node = window.Node // <== Add this
// [...]

这是因为嵌套的<span>标记在<p>标记内创建文本节点,Draft.js正在解析这些节点。

我不知道你的代码的上下文,但如果你只想把一个HTML字符串转换成JSON/JS对象,那么使用xml2js这样的东西可能会更容易:

const util = require('util');
const parseString = util.promisify(require('xml2js').parseString); // `promisify` makes it possible to use `async/await`
(async function(){
const obj = await parseString('<p>Hey this <span>editor</span> rocks 😀</p>');
console.log(obj); // { p: { _: 'Hey this  rocks 😀', span: [ 'editor' ] } }
}());

最新更新