奇っ怪

Web

変更が参照になってて、変更場所を特定するのに苦労した話

北海道の事件というアプリをNuxt3で作っていて、引っ張ってきたデータが一部おかしくなっていたので、その場所を探すのに苦労しました。なので、メモ。

データが変更されている!

jsonからデータを引っ張ってくるために、compoasblesuseData.tsを作成し、ここで取得したデータをtransformで整形したり、ソートしたり、使い易いようにして、配列を出荷。この配列を起点にあちこちでこのデータを使って、グラフや数字を表示していました。で、ある時、グラフを見ると、日付以外のものが混じっています。おかしいなと思い、最終的な全データを見てみると、日付の部分で一部変更されているではありませんか。意図した変更ではなかったため、原因を探ることに。

もっとも怪しいのが前述のuseDataで、console.logをあちこちに埋め込んで、値の変化を探りました。すると、一箇所でおかしな表示を確認。ブラウザのconsoleに表示される値が、三角を押して展開される値と違うんです。これは奇っ怪な現象だと思い、copilotに尋ねると、どこかで改変したのが遡って表示されている可能性があるというのです。それを調べるため、その時点の値を調べるのが良いようで、これを使いなさいと教えてくれたのが以下。valの部分に変数を入れる感じです。

console.log(JSON.parse(JSON.stringify(val)))

確かに、これで見ると奇っ怪な変化は出てこない。では、おかしいのは後工程だなとあたりをつけ探してみると、怪しい改変コードがありました。一つのグラフで使う修正が参照されて、前工程にも影響を及ぼしていた模様です。くわばらくわばら。つるかめつるかめ。今後気をつけねば。

コメント