【Javascript】オブジェクト更新のデバッグ方法

経緯

担当しているTypescript/Javascriptのシステムで、予期せずトップの.envファイルが読み込まれ、どこかの処理でprocess.envに値がセットされている事象が発生しました。

原因特定のため、デバッガーや二分探索を使って.envファイルを読んでいる処理を特定しようとしていたのですが、グローバルオブジェクトである故になかなか見当がつけられませんでした。

どうするか

より効率いい方法がないか考えた結果、Proxyオブジェクトを使えばいいことに気がつきました
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Proxy

// 一連処理のトップレベルで呼び出し
const envHandler = {
  set(target, key, value) {
    console.trace(`Environment variable ${key} was set with value: ${value}`)
    target[key] = value
    return true
  },
}

process.env = new Proxy(process.env, envHandler)

これで値がセットされた際に、traceログが出力されるようになり問題の特定につながりました。 process.envに限らず、特にグローバルオブジェクトや変数の謎更新のデバッグに使えそうなのでメモとして残しておきます

おまけ

本件はPrismaというライブラリがimportされると勝手に.envを読んでることが原因でした
https://www.prisma.io/docs/guides/development-environment/environment-variables#env-file-locations