macOSが使うWebビューをInspectする

• Macのターミナルで以下のコマンドを入力すると、システムが使っているWebビューで "Inspect Element" メニューが有効になり、システムのダイアログウィンドウ内にあるあらゆるWebビューを通常のWebサイトのように開発者ツールで調べられるようになる
  defaults write NSGlobalDomain WebKitDeveloperExtras -bool true
  defaults write -g WebKitDeveloperExtras -bool YES
• AppleのエンジニアがWebKitの非標準CSSキーワードを使って、システムAPIで開発されたmacOS UIをそのままWeb上で実装した方法を見られるようになる
  → 例) Apple Musicのファミリー共有タブではReactを使っていることも分かり、Webコンポーネントのようなものも見える
• これによって、WebKit/Safariの特定機能がなぜ提供されているのかを確認できる
  → 例) CSS4フォントモジュールがシステムフォントをサポートしていること。 font-family : -apple-system

[spilist2]

わあ、面白いですね。ですが、こういうことをどうやって突き止めるのかも気になっていたので、その話がなかったのは少し残念です。

[spilist2]

回答スレッド: https://twitter.com/samhenrigold/status/1503179818879401987

i was interested in figuring out how the itunes store app works. running a proxy and inspecting the HTML by hand was a pain in the ass so i started looking online for any pref values i could write to enable dev tools.

I couldn’t find anything, so I juiced the strings (https://macworld.com/article/192447/findhidden.html) out of the itunes binary and webkit frameworks explicitly looking for keys that could be helpful. Couldn’t find anything for iTunes but the entries I found enabled the inspector elsewhere!

[xguru]

調べてみると、WebkitDeveloperExtras 項目を有効にすること自体は、かなり前から知られていたようです。Stackoverflow に12年前の質問がありますね。
https://stackoverflow.com/questions/695038/…
最近になってようやく、Apple がシステムで WebView を使い始めたのではないかと思います。

[spilist2]

macOSの標準アプリをどうやってインスペクトしようと思ったのか、そしてどうやってその方法（あのコマンドの存在など）を知ったのか、その思考過程が気になってTwitterで聞いてみたのですが……既知の方法だったのですね。
返事をもらえるかわかりませんが、返信があればここでも共有します。