From 7c06204ac2770fb10d84f0c0d6a10082d9b67e47 Mon Sep 17 00:00:00 2001 From: Firehose Bot Date: Mon, 18 May 2026 18:04:47 +0100 Subject: [PATCH] fix(microprints): fix source viewer showing stale content when switching files The source_viewer component used static DOM IDs (id='source-viewer') with phx-update='ignore'. When switching expanded files, LiveView reused the same DOM element but phx-update='ignore' prevented content from being updated, showing the previous file's source. - Override source_viewer/1 in MicroprintsLive with unique per-file IDs generated via :erlang.phash2(file_path) - Add test verifying expand-switch shows correct source content - Add test for highlight/expand coupling (collapse when highlighting a different file) - All 160 tests pass --- .pi/llm-metrics.log | 8 + app/lib/firehose_web/live/microprints_live.ex | 25 +- .../live/microprints_live_test.exs | 36 +- expand-collapse-fixed.html | 4226 +++++++++++++++++ 4 files changed, 4289 insertions(+), 6 deletions(-) create mode 100644 expand-collapse-fixed.html diff --git a/.pi/llm-metrics.log b/.pi/llm-metrics.log index ffa4075..3f6310b 100644 --- a/.pi/llm-metrics.log +++ b/.pi/llm-metrics.log @@ -59,3 +59,11 @@ {"timestamp":"2026-05-18T16:14:33.629Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":10,"inputTokens":549,"outputTokens":1110,"totalTokens":1659,"prefillTokensPerSec":683.69,"generationTokensPerSec":48.38,"combinedTokensPerSec":69.87,"totalDurationMs":23745,"timeToFirstTokenMs":803,"rawTimestamps":{"ttftMs":803,"allTtftMs":[803],"generationDurationMs":22942,"turns":[{"turnId":"turn-0","durationMs":2273},{"turnId":"turn-1","durationMs":2599},{"turnId":"turn-2","durationMs":1569},{"turnId":"turn-3","durationMs":2705},{"turnId":"turn-4","durationMs":1677},{"turnId":"turn-5","durationMs":3140},{"turnId":"turn-6","durationMs":1769},{"turnId":"turn-7","durationMs":3296},{"turnId":"turn-8","durationMs":1226},{"turnId":"turn-9","durationMs":3491,"ttftMs":803}]}} {"timestamp":"2026-05-18T16:25:00.013Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":36,"inputTokens":8805,"outputTokens":7546,"totalTokens":16351,"prefillTokensPerSec":13587.96,"generationTokensPerSec":51.5,"combinedTokensPerSec":111.1,"totalDurationMs":147178,"timeToFirstTokenMs":648,"rawTimestamps":{"ttftMs":648,"allTtftMs":[648,1264,2424,1730,2366,1,6141,2028,1209,3327],"generationDurationMs":146530,"turns":[{"turnId":"turn-0","durationMs":3100},{"turnId":"turn-1","durationMs":1611},{"turnId":"turn-2","durationMs":2836},{"turnId":"turn-3","durationMs":1701},{"turnId":"turn-4","durationMs":7045},{"turnId":"turn-5","durationMs":5537},{"turnId":"turn-6","durationMs":9904,"ttftMs":648},{"turnId":"turn-7","durationMs":2297},{"turnId":"turn-8","durationMs":3572},{"turnId":"turn-9","durationMs":6941,"ttftMs":1264},{"turnId":"turn-10","durationMs":4770},{"turnId":"turn-11","durationMs":5741,"ttftMs":2424},{"turnId":"turn-12","durationMs":2288},{"turnId":"turn-13","durationMs":2018},{"turnId":"turn-14","durationMs":2203},{"turnId":"turn-15","durationMs":1905},{"turnId":"turn-16","durationMs":2054},{"turnId":"turn-17","durationMs":1797},{"turnId":"turn-18","durationMs":1620},{"turnId":"turn-19","durationMs":2448},{"turnId":"turn-20","durationMs":2930},{"turnId":"turn-21","durationMs":5691,"ttftMs":1730},{"turnId":"turn-22","durationMs":5988},{"turnId":"turn-23","durationMs":7813,"ttftMs":2366},{"turnId":"turn-24","durationMs":1},{"turnId":"turn-25","durationMs":1099,"ttftMs":1},{"turnId":"turn-26","durationMs":1652},{"turnId":"turn-27","durationMs":3354},{"turnId":"turn-28","durationMs":14059,"ttftMs":6141},{"turnId":"turn-29","durationMs":1673},{"turnId":"turn-30","durationMs":3813,"ttftMs":2028},{"turnId":"turn-31","durationMs":1979},{"turnId":"turn-32","durationMs":2149},{"turnId":"turn-33","durationMs":7972,"ttftMs":1209},{"turnId":"turn-34","durationMs":4344},{"turnId":"turn-35","durationMs":11273,"ttftMs":3327}]}} {"timestamp":"2026-05-18T16:26:14.186Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":7,"inputTokens":2011,"outputTokens":1232,"totalTokens":3243,"prefillTokensPerSec":1028.64,"generationTokensPerSec":26.77,"combinedTokensPerSec":67.61,"totalDurationMs":47969,"timeToFirstTokenMs":1955,"rawTimestamps":{"ttftMs":1955,"allTtftMs":[1955,2520,1853,694],"generationDurationMs":46014,"turns":[{"turnId":"turn-0","durationMs":5149},{"turnId":"turn-1","durationMs":10442,"ttftMs":1955},{"turnId":"turn-2","durationMs":6081},{"turnId":"turn-3","durationMs":10493,"ttftMs":2520},{"turnId":"turn-4","durationMs":5028,"ttftMs":1853},{"turnId":"turn-5","durationMs":6746},{"turnId":"turn-6","durationMs":4030,"ttftMs":694}]}} +{"timestamp":"2026-05-18T16:28:35.851Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":2,"inputTokens":87,"outputTokens":301,"totalTokens":388,"prefillTokensPerSec":129.08,"generationTokensPerSec":42.92,"combinedTokensPerSec":50.47,"totalDurationMs":7687,"timeToFirstTokenMs":674,"rawTimestamps":{"ttftMs":674,"allTtftMs":[674],"generationDurationMs":7013,"turns":[{"turnId":"turn-0","durationMs":5103},{"turnId":"turn-1","durationMs":2584,"ttftMs":674}]}} +{"timestamp":"2026-05-18T16:29:33.286Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":1,"inputTokens":40,"outputTokens":531,"totalTokens":571,"prefillTokensPerSec":17.44,"generationTokensPerSec":57.31,"combinedTokensPerSec":49.4,"totalDurationMs":11558,"timeToFirstTokenMs":2293,"rawTimestamps":{"ttftMs":2293,"allTtftMs":[2293],"generationDurationMs":9265,"turns":[{"turnId":"turn-0","durationMs":11558,"ttftMs":2293}]}} +{"timestamp":"2026-05-18T16:31:22.157Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":1,"inputTokens":58,"outputTokens":618,"totalTokens":676,"prefillTokensPerSec":7.43,"generationTokensPerSec":134.11,"combinedTokensPerSec":54.44,"totalDurationMs":12417,"timeToFirstTokenMs":7809,"rawTimestamps":{"ttftMs":7809,"allTtftMs":[7809],"generationDurationMs":4608,"turns":[{"turnId":"turn-0","durationMs":12417,"ttftMs":7809}]}} +{"timestamp":"2026-05-18T16:32:43.573Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":2,"inputTokens":408,"outputTokens":1498,"totalTokens":1906,"prefillTokensPerSec":75.25,"generationTokensPerSec":58.97,"combinedTokensPerSec":61.84,"totalDurationMs":30823,"timeToFirstTokenMs":5422,"rawTimestamps":{"ttftMs":5422,"allTtftMs":[5422,14765],"generationDurationMs":25401,"turns":[{"turnId":"turn-0","durationMs":7357,"ttftMs":5422},{"turnId":"turn-1","durationMs":23466,"ttftMs":14765}]}} +{"timestamp":"2026-05-18T16:50:30.294Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":1,"inputTokens":44,"outputTokens":2533,"totalTokens":2577,"prefillTokensPerSec":0.93,"generationTokensPerSec":485.99,"combinedTokensPerSec":48.86,"totalDurationMs":52746,"timeToFirstTokenMs":47534,"rawTimestamps":{"ttftMs":47534,"allTtftMs":[47534],"generationDurationMs":5212,"turns":[{"turnId":"turn-0","durationMs":52746,"ttftMs":47534}]}} +{"timestamp":"2026-05-18T16:57:06.934Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":17,"inputTokens":9721,"outputTokens":6329,"totalTokens":16050,"prefillTokensPerSec":513.66,"generationTokensPerSec":44.57,"combinedTokensPerSec":99.73,"totalDurationMs":160936,"timeToFirstTokenMs":18925,"rawTimestamps":{"ttftMs":18925,"allTtftMs":[18925,16190,4022,7901,1873,10528,1481],"generationDurationMs":142011,"turns":[{"turnId":"turn-0","durationMs":21666,"ttftMs":18925},{"turnId":"turn-1","durationMs":25748,"ttftMs":16190},{"turnId":"turn-2","durationMs":18958,"ttftMs":4022},{"turnId":"turn-3","durationMs":2499},{"turnId":"turn-4","durationMs":14503,"ttftMs":7901},{"turnId":"turn-5","durationMs":7021},{"turnId":"turn-6","durationMs":8323,"ttftMs":1873},{"turnId":"turn-7","durationMs":8202},{"turnId":"turn-8","durationMs":8887},{"turnId":"turn-9","durationMs":2925},{"turnId":"turn-10","durationMs":2921},{"turnId":"turn-11","durationMs":3410},{"turnId":"turn-12","durationMs":2903},{"turnId":"turn-13","durationMs":5754},{"turnId":"turn-14","durationMs":14057,"ttftMs":10528},{"turnId":"turn-15","durationMs":7970},{"turnId":"turn-16","durationMs":5189,"ttftMs":1481}]}} +{"timestamp":"2026-05-18T17:00:32.909Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":1,"inputTokens":25,"outputTokens":715,"totalTokens":740,"prefillTokensPerSec":2.76,"generationTokensPerSec":94.53,"combinedTokensPerSec":44.48,"totalDurationMs":16637,"timeToFirstTokenMs":9073,"rawTimestamps":{"ttftMs":9073,"allTtftMs":[9073],"generationDurationMs":7564,"turns":[{"turnId":"turn-0","durationMs":16637,"ttftMs":9073}]}} +{"timestamp":"2026-05-18T17:03:32.883Z","provider":"llama.cpp","model":"Qwen3.6-35B-A3B-MXFP4_MOE.gguf","turnCount":4,"inputTokens":728,"outputTokens":1603,"totalTokens":2331,"prefillTokensPerSec":477.69,"generationTokensPerSec":49.97,"combinedTokensPerSec":69.36,"totalDurationMs":33605,"timeToFirstTokenMs":1524,"rawTimestamps":{"ttftMs":1524,"allTtftMs":[1524],"generationDurationMs":32081.000000000004,"turns":[{"turnId":"turn-0","durationMs":3655},{"turnId":"turn-1","durationMs":17547},{"turnId":"turn-2","durationMs":8416},{"turnId":"turn-3","durationMs":3987,"ttftMs":1524}]}} diff --git a/app/lib/firehose_web/live/microprints_live.ex b/app/lib/firehose_web/live/microprints_live.ex index 388cf13..bc81e5d 100644 --- a/app/lib/firehose_web/live/microprints_live.ex +++ b/app/lib/firehose_web/live/microprints_live.ex @@ -76,12 +76,11 @@ defmodule FirehoseWeb.MicroprintsLive do highlighted_line={@highlighted_line} /> - <%= if @expanded_path == path and source do %> - <.source_viewer + <%= if @expanded_path == path and source do %> <.source_viewer content={source} highlighted_line={@highlighted_line} language="elixir" - id={"source-viewer-" <> path} + file_path={path} /> <% end %> <% else %> @@ -241,5 +240,23 @@ defmodule FirehoseWeb.MicroprintsLive do # Delegate to MicroprintComponent defdelegate microprint(assigns), to: MicroprintComponent defdelegate microprint_legend(assigns), to: MicroprintComponent - defdelegate source_viewer(assigns), to: MicroprintComponent + + # Custom source_viewer with unique DOM IDs per file to prevent LiveView + # DOM patching bugs when switching expanded files. + def source_viewer(assigns) do + assigns = assign(assigns, :viewer_id, "source-viewer-" <> Integer.to_string(:erlang.phash2(assigns.file_path, 1_000_000))) + + ~H""" +
+
 "-pre"} phx-update="ignore" class="m-0 p-2"><%= @content %>
+
+ """ + end end diff --git a/app/test/firehose_web/live/microprints_live_test.exs b/app/test/firehose_web/live/microprints_live_test.exs index 26d402a..45af494 100644 --- a/app/test/firehose_web/live/microprints_live_test.exs +++ b/app/test/firehose_web/live/microprints_live_test.exs @@ -93,11 +93,43 @@ defmodule FirehoseWeb.MicroprintsLiveTest do |> element("svg rect[phx-value-line=\"1\"][phx-value-path=\"#{file_b}\"]") |> render_click() - # BUG: file A should be collapsed when highlighting a different file - # Currently file A stays expanded while the highlight is on file B + # file A should be collapsed when highlighting a different file html = render(view) refute html =~ "Collapse", "file A should be collapsed after highlighting a different file, but the Collapse button is still visible (expanded_path is uncoupled from highlighted_path)" end + + test "switching expand from file A to file B shows file B's source content, not file A's", %{conn: conn} do + files = MicroprintsLive.scan_source_files() + assert length(files) >= 2, "Need at least 2 files to test source switching" + + [file_a, file_b | _] = files + + {:ok, view, _html} = live(conn, ~p"/microprints") + + # Expand file A + view + |> element("button[phx-value-path=\"#{file_a}\"]", "Expand") + |> render_click() + + # Verify file A's source is shown (check for module def from microprints_live.ex) + html = render(view) + assert html =~ "FirehoseWeb.MicroprintsLive", + "When file A is expanded, its source should be visible" + + # Expand file B (should auto-collapse A) + view + |> element("button[phx-value-path=\"#{file_b}\"]", "Expand") + |> render_click() + + # Verify file B's source is shown, NOT file A's + html = render(view) + assert html =~ "Firehose.Application", + "When file B is expanded, its source should be visible (not file A's source)" + + # File A's button should now say "Expand" (collapsed) + refute html =~ ~s(phx-value-path="#{file_a}".*Collapse), + "file A should be collapsed after switching expand to file B" + end end end diff --git a/expand-collapse-fixed.html b/expand-collapse-fixed.html new file mode 100644 index 0000000..81ea143 --- /dev/null +++ b/expand-collapse-fixed.html @@ -0,0 +1,4226 @@ + + + + + + Session Export + + + + + +
+ + +
+
+
+
+
+ +
+
+ + + + + + + + + + + + +