HTMLパーサーが欲しい

GASでスクレイピングすると誰もが思うこと、「HTMLパーサーが…欲しい…!!」
正規表現でもなんとかなるといえばなるけど柔軟性に欠けるし保守性も低い。
よく紹介されるのはParserだけど個人的には「コレ使うなら正規表現でも変わらなくね？」と思ってしまうし、同一タグのネストを解決するのが大変。

ならnodejsから移植すれば良いじゃない。
というわけでライブラリを作りました。下記IDをライブラリ検索で利用できます。
スクリプトID: 1JTLPVXGW6Pq4zSAV5ED9XrWOPydVywumQZSOWN7l6KJ0UtWxtX3RbYO6
GitHub: https://github.com/kairi003/gas-html-parser

使い方

本ライブラリはほぼnode-html-parserそのままです。作ったとか言えないレベル。
細かい利用方法は本家のドキュメントを確認していただくとして、以下のように使えます。

const html = `<body>
  <ul id="fruits">
    <li class="apple">Apple</li>
    <li class="orange">Orange</li>
    <li class="pear">Pear</li>
  </ul>
</body>`;
const dom = HtmlParser.parse(html);
console.log(dom.querySelector('#id .pear').textContent);

ちなみになんでnode-html-parserなのかというとAPIがブラウザDOMに近い(同じではない)のと軽いからです。jqueryが好きならcheerioのほうがいいかも。jsdomは無理そうでした。

作り方

GitHub: https://github.com/kairi003/gas-html-parser

node-html-parserをimportするだけのindex.jsをwebpackでバンドルしてます。
またGASライブラリとして使う都合上、ライブラリのグローバルとnode-html-parserのグローバルを一致させたかったのでglobalThisにObject.assignしてます。

Object.assign(globalThis, require('node-html-parser'));

普通に使う分には以下のようにexportしてwebpackの設定でoutput.library: "HtmlParser"などを指定したほうが良いでしょう。

module.exports(require('node-html-parser'));

ちなみにwebpackでちょっと困ったこととして、developmentモードでは動くのにproductionでは動かないという自体に遭遇しました。
これはminimize時にオブジェクトキーに非ASCII文字がクォーテーション無しに生成されて一部がSyntaxErrorになっていたこと ({ℵ: "aleph",...}←こんなの) が原因で、次のようにterserのオプションを指定することで解決しました。

module.exports = {
    ...,
    optimization: {
        minimize: true,
        minimizer: [
          new TerserPlugin({
            terserOptions: { output: { ascii_only: true } }
          })
        ],
    }
}

感想

割と手軽にできて驚きでした。なんで普及してないんだろう。

GASでちゃんとしたHTMLパーサーが使いたかったのでライブラリにした

HTMLパーサーが欲しい

使い方

作り方

感想