最近 Electron のバージョンを上げて試行錯誤してますが 破壊的変更が多すぎて辛いです
単純に置き換えできる機能があるなら別にいいですが 複雑で面倒なことしないといけなかったり そもそも実現できなくなりそうなものもあったり
改善されていくならいいのですが セキュリティ等を理由に制限が増え改悪されていってるだけに感じています

webview 周りの扱いづらさがあって調べていたら出てきた記事
webview が推奨されなくなって BrowserView という新しいのに変わりそうな感じです

BrowserView がどういうのかを見るとレンダラープロセスではなくメインプロセスで制御されて DOM の要素ではなくなってるようです
これだけでもう求めてるものじゃないですし Electron ユーザーでも受け入れられないって人は多そうなものです
両方使えるなら webview を使い続けると思います

他には そろそろ ESModules を使いたいので調べてみると Electron の仕組み上無理そうで webpack を推奨してるような issue がありました
メインプロセスの方は回避策のような方法で可能らしいですが メインプロセスは Node.js みたいな扱いなので CJS でも個人的には構いません
ブラウザ内であるレンダラープロセスの方で ESModules を使いたいです
今でもページ内であれば type="module" で .js ファイルをロードすれば問題なく動きます
ですが推奨される preload.js では ESModules が動かないです
今のところレンダラープロセスで表示するページは自分で作るもので 信用できないファイルをロードしたりはしないので Node.js 統合を有効にして ページ内で ESModules を使えば問題はないのですが Electron 自体にそういう技術的問題があるというあたり 大きく作り変えでもしないと限界になってきてるのかなというところです

新しくなにか良さそうなのが出るならいっそそっちに移りたいかなーと言う気もしてきています
ちょうど最近は Rust ベースで Electron を置き換えようとしてる Tauri というのがありますし 安定してきたら考えてみようかなと言うところです
少し不安なのは OS の webview を使うらしいので 直接ファイル操作や内側に webview を持ってその制御を簡単にできるのかですね
webview 内でできないから Rust のコードを書かないといけないとかなるとハードル高いですし

求めてる機能はそんな複雑でも無いと思うのですが 簡単にできるのがないです

◯ Web 技術で画面を作れる
◯ ページ内の JavaScript 処理でブラウザの制限を受けずローカルファイル操作や外部サイトへのリクエストなどができる
◯ webview で任意の URL のページを閲覧できて webview 内はサンドボックス化されて安全
◯ webview 内にスクリプトを送信して自由に制御できる

レンダラープロセスでファイルをダウンロードしたいのにどこを見てもメインプロセスに通知してそっちで処理するものばかり
シンプルにレンダラープロセス内だけで完結したい

普通に fetch してファイル書き込みだけでできた
CORS の制限は受けないみたい

const fs = require("fs")

const download = async (path, url) => {
	const ab = fetch(url).then(res => res.arrayBuffer())
	fs.writeFileSync(path, Buffer.from(ab))
}

download("file1.jpg", "http://example.com/image1.jpg")

ファイル書き込みは Node.js の機能を使うので nodeIntegration が必要

アプリ内管理のローカル HTML のページを開いてるので セキュリティ制限をする必要はなくて有効にしてるけど外部のウェブページを開くなら nodeIntegration は危険なのでメインプロセスでしたほうが良さそう
ただ contextIsolation が有効になってたらウェブページ側のスクリプトから Node.js API にアクセスできないし 直接外部サイトを BrowserWindow で開く場合でも preload 内の処理でこれでもいい気はしてる

古い Electron のバージョンで作ってたもので JavaScript の新機能を使って機能追加したかったのでバージョンを上げてみた
最新が 18 なので 10 以上バージョンが上がってる
多少は変更いるかと思ってたけど 大したことしてるツールじゃないから大丈夫だろうと思ってたらかなり辛い

まずページ内で require が使えない
context isolation とかいうのが自動で有効になったらしい
new BrowserWindow() 時のオプションで contextIsolation を false に指定すれば require が使えるようになった

Webview 関係も変わっていて target="_blank" があるリンクを開いたときにこれまでは new-window イベントが起きていた
そのイベントで webview.src に新規ウィンドウの URL を設定したら webview で新しいページに移動できた
今だと new-window イベントが起きない
allowpopups 属性もつければ new-window イベントは起きるけど 実際に新規ウィンドウが作られてしまう
new-window イベントで preventDefault しても効果なし

さらにブラウザ拡張機能みたいに webview 内でも context isolation が行われてる
preload 内で webview ページのビルトイン関数を上書きして Electron のページ側に関数呼び出しされたことを通知してたのにそれが動かない
上書きされたのは preload のコンテキスト内だけなのでページ側の処理で呼び出される関数は上書きできてない

面倒が多いし 古い Electron のままでいいやってなった
JavaScript の新機能が使えないのは不便だけどそんなに更新するものじゃないし

Electron に脆弱性があったみたいだね

自分がその環境でコード書くわけではなくてもなんとなく devtools 開けたらバージョン確認してみてるけど Chrome バージョンがブラウザの最新に比べて 5 ～ 10 くらい古かったりする
毎回のようにバージョンアップの変更内容にセキュリティフィックスがあるしこんな古くていいのかな
なんて思ってたけどダメだったんだね

でも今回のだと プロトコルのハンドラがどうこうって書いてるし Chrome バージョンは関係なかったのかも
ローカルアクセスできる分ブラウザよりセキュリティ周りは大変そうですねー