HTMLをパースするW3C標準のAPIとしてDOMParser(仕様策定中)がある。Node.jsからこのようなブラウザでサポートされるAPIを使うためには、jsdom(グローバル変数を注入するのであればjsdom-global)がよく使われる。
Javascriptでjsdomを使う場合は以下のように読み込めばよい。
// JSDOMインスタンスからwindowオブジェクトを参照する。
const DOMParser = new (require('jsdom').JSDOM)().window.DOMParser;
// jsdom-globalを使う場合はwindowオブジェクトが注入される。
require('jsdom-global')();
const DOMParser = window.DOMParser;
@vue/cli-plugin-unit-mochaにもjsdom-globalが組み込まれているが、TypeScriptを使うとwindowの型がWindow型となり、DOMParserを参照できない。
ERROR in ... Property 'DOMParser' does not exist on type 'Window'.
おそらく型定義ファイルを整理すれば参照できるようになると推測するが、今回はHTMLのパースができればよかったため、Element.innerHTML
で代用した。
const html = "<p>test</p>";
const div = document.createElement('body');
div.innerHTML = html;
const doc = div.querySelector('body > *');