CopilotにTidewaveを与えたら、デバックが楽ちんだった経験談 #Elixir – Qiita

この記事を参考にして、Tidewave Phoenixを使ってみました。

先ずは、@RyoWakabayashi さんの記事にもある、「users テーブルに登録されているデータを表示して」
を試してみました。ちゃんと想定したような応答がえられました。

次に試して見たのは、

「usersに100人のダミーデータを作成して登録して。名前は、日本人の典型的な名前でランダム、ユニークなものにして。年齢も適当に生成。」

一件追加するごとに実行してよいかの確認が表示されて、実行できました。面倒だったので途中からは、全部実行許可しましたけど。

これは便利。
MCPつないだだけで、使い方も理解してるんですね。

「年齢順にソートするボタンを追加」

結構いい感じのコード修正が行われました。しかし、ボタンを押してもソートされませんでした。

「ボタンを押しても何もかわりません」と伝えてみました。

このプロンプトに対してしばらく考えた後、修正されて、ソートが動作するようになりました。
おお。すごい。

“reset: true”の記述が無くて、表示が更新されないのが原因でした。

一体どうやって解決したのか、
「この調査を行う為にMCPサーバにどのような問い合わせをしたのか教えてください。」
聞いてみた

順を追って動作を確認している！

 
     {:noreply, stream_delete(socket, :users, user)}
   end
+
+  @impl true
+  def handle_event("sort_by_age", _params, socket) do
+    sorted_users = Accounts.list_users() |> Enum.sort_by(& &1.age)
+    {:noreply, stream(socket, :users, sorted_users, reset: true)}
+  end
 end

     <.>link patch={~p"/users/new"}>
       <.>button>New Userbutton>
     link>
+    <.>button phx-click="sort_by_age">Sort by Agebutton>
   :actions>
 header>

• Tiedwaveがあると、CopilotがMCPを通じて、問題点の切り分けを行う事ができる。
• ソートできない原因を、どの段階で問題が起きているのかMCPを使って切り分けをしている事を確認した。
• 適切に修正されていた。人が行うのと同じような手順をおこなってる。