🔍

lib.dom.d.tsがどのように更新されるか調べてみた

2022/02/15に公開

はじめに

先日 Chromium ベースのブラウザでも structuredClone がサポートされましたね🎉

https://chromestatus.com/feature/5630001077551104

既に Firefox でもサポートされているので、いよいよ使えそうかな?と思ったのですが、まだ型が追加されていませんでした。

structuredClone の型は lib.dom.d.ts に追加されるだろうという目星はつけたのですが、
ふと「lib.dom.d.ts はどのように更新されているんだろう」と疑問に思い、少し流れを追ってみました。

同じように気になった人の少しでも参考になれば...と思ったので、記事に残しておこうと思います。
間違っているところがあれば、優しくコメントいただけると助かります🙏

lib.dom.tsとは

TypeScript をインストールした時に付属している型定義ファイルです。

先日公開された、TypeScript 4.6 RC の lib.d.ts の中身は下記のようになっており、内部的に lib.dom.d.ts などを読み込んでいます。(lib.dom.d.ts はかなり大きめのファイルなので、気になる方は別途確認してみてください🙏)
https://github.com/microsoft/TypeScript/blob/v4.6-rc/lib/lib.d.ts

早速調査してみる

lib.dom.d.ts はどのように更新されるのか

TypeScript の CONTRIBUTING.md を眺めていると、lib.d.ts に修正を加える方法の記載を見つけました。

The files src/lib/dom.generated.d.ts and src/lib/webworker.generated.d.ts both represent type declarations for the DOM and are auto-generated.

どうやら、lib.dom.d.ts などは下記のリポジトリをもとに自動更新されているようです。
https://github.com/microsoft/TypeScript-DOM-lib-generator

TypeScript のリポジトリを眺めていると、実際にTypeScript-DOM-lib-generatorから作られた PR を見つけました。
https://github.com/microsoft/TypeScript/pull/47445

lib.dom.d.ts を更新するPRはどのように作られるのか

先ほどの PR が bot によって作られていたことから、GitHub Actions で作成してそうという目星をつけました。
早速、.github/workflows 配下を眺めていると、それらしきワークフローがありました。

https://github.com/microsoft/TypeScript-DOM-lib-generator/blob/main/.github/workflows/pr-to-typescript.yml

中を見ると、ワークフローのトリガーには workflow_dispatch が設定されていました。
GitHub Actions ではさまざまなトリガーを設定できますが、workflow_dispatch を設定すると手動でワークフローを実行できます。

https://docs.github.com/ja/actions/managing-workflow-runs/manually-running-a-workflow

特に制限がない場合、Actions タブで workflow_dispatch を指定したワークフローを選択すると、
Run workflow というボタンが表示され、それを押すことで手動実行できます。

一応、PR を作成するワークフローを見てみましたが、手動実行のボタンは表示されていませんでした。(誰でも実行できたらまずいのでそれはそう)

https://github.com/microsoft/TypeScript-DOM-lib-generator/actions/workflows/pr-to-typescript.yml

ここまでで、どのように PR を作っているかはなんとなく把握できました。

lib.dom.d.ts の型情報はどこを参照して生成しているのか

TypeScript-DOM-lib-generatorの README には次のようにあります。

Check if there is a document about that interface in MDN. If there is, see the browser compatibility section and check whether it's supported by two or more browser engines.

The type will be automatically added in a few weeks when MDN fixes their data.

つまり、MDN の Browser compatibility を基準にしていて、2 つ以上のブラウザエンジンがサポートすれば、自動的に型が追加されるみたいです。

structuredClone() であれば、下記を見れば良いということになります。
https://developer.mozilla.org/en-US/docs/Web/API/structuredClone#browser_compatibility

前述の通り、Chromium ベースのブラウザでも structuredClone() がサポートされましたが、
どうやら MDN にはまだ反映されていないようです。

ここまでで、型が追加されるには、MDN の Browser compatibility を更新すべきということが分かりました。

MDN の Browser compatibility はどこで管理されているか

MDN の Browser compatibility は下記のリポジトリで管理されています。

https://github.com/mdn/browser-compat-data

それでは、structuredClone() を管理しているファイルを見てみましょう。
JSON 形式になっており、各ブラウザのサポート状況が記載されています。

https://github.com/mdn/browser-compat-data/blob/main/api/_globals/structuredClone.json

よく見ると、Chromium ベースのブラウザもサポートされていますね。
2022/02/15 時点では、「既に変更はマージされているが、まだリリースはされていない」という状態になります。
なので、特に必要な対応はありません。もうしばらく待ちましょう。

自分が理解した範囲では lib.dom.d.ts が更新されるまでの流れは以上になります。

まとめ

かなり駆け足になってしまいましたが、lib.dom.d.ts が更新されるまでの流れをざっくりまとめました。
今後もし、「機能は追加されているはずなのに型がない!」という場面に遭遇した場合、まずは MDN の Browser compatibility を確認すると良さそうかなと思いました。

余談

Chrome 97 でサポートされた HTMLScriptElement.supports() がまだ反映されていなかったので、修正して PR を出してみました。
まだ承認されたわけではないので、間違っている可能性もありますが、良かった参考にしてください🙏
https://github.com/mdn/browser-compat-data/pull/14899

Discussion