From ae0f083c5c889672f571ef2721d59750e27f39ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jonatan=20K=C5=82osko?= <jonatanklosko@gmail.com>
Date: Wed, 19 Jan 2022 14:43:35 +0100
Subject: [PATCH] Fixes (#889)

* Fix title test

* Fix editable element check

* Fix duplicate output ids
---
 assets/js/lib/utils.js                        |  4 +++-
 .../live/output/frame_component.ex            | 20 +++++++++----------
 test/livebook_web/live/session_live_test.exs  |  3 +++
 3 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/assets/js/lib/utils.js b/assets/js/lib/utils.js
index 2506d2e06..da9648696 100644
--- a/assets/js/lib/utils.js
+++ b/assets/js/lib/utils.js
@@ -6,7 +6,9 @@ export function isMacOS() {
 }
 
 export function isEditableElement(element) {
-  return element.matches("input, textarea, [contenteditable]");
+  return (
+    element.matches && element.matches("input, textarea, [contenteditable]")
+  );
 }
 
 export function clamp(n, x, y) {
diff --git a/lib/livebook_web/live/output/frame_component.ex b/lib/livebook_web/live/output/frame_component.ex
index 06887db1c..a3244f910 100644
--- a/lib/livebook_web/live/output/frame_component.ex
+++ b/lib/livebook_web/live/output/frame_component.ex
@@ -3,7 +3,7 @@ defmodule LivebookWeb.Output.FrameComponent do
 
   @impl true
   def mount(socket) do
-    {:ok, assign(socket, counter: 0, output_count: 0, persistent_idx_map: %{})}
+    {:ok, assign(socket, counter: 0, output_count: 0, persistent_id_map: %{})}
   end
 
   @impl true
@@ -18,7 +18,7 @@ defmodule LivebookWeb.Output.FrameComponent do
         assign(socket,
           counter: 1,
           output_count: length(outputs),
-          persistent_idx_map: idx_map(outputs)
+          persistent_id_map: map_idx_to_persistent_id(outputs, socket.assigns.id)
         )
       else
         socket
@@ -31,23 +31,23 @@ defmodule LivebookWeb.Output.FrameComponent do
 
         :replace ->
           prev_output_count = socket.assigns.output_count
-          prev_persistent_idx_map = socket.assigns.persistent_idx_map
+          prev_persistent_id_map = socket.assigns.persistent_id_map
 
           output_count = length(outputs)
-          persistent_idx_map = idx_map(outputs)
+          persistent_id_map = map_idx_to_persistent_id(outputs, socket.assigns.id)
 
           socket =
             assign(socket,
               outputs: outputs,
               output_count: output_count,
-              persistent_idx_map: persistent_idx_map
+              persistent_id_map: persistent_id_map
             )
 
           less_outputs? = prev_output_count > output_count
-          appended_outputs? = prev_output_count > map_size(prev_persistent_idx_map)
+          appended_outputs? = prev_output_count > map_size(prev_persistent_id_map)
 
           # If there are outputs that we need to remove, increase the counter.
-          # Otherwise we reuse DOM element ids via persistent_idx_map
+          # Otherwise we reuse DOM element ids via persistent_id_map
           if less_outputs? or appended_outputs? do
             update(socket, :counter, &(&1 + 1))
           else
@@ -63,10 +63,10 @@ defmodule LivebookWeb.Output.FrameComponent do
     {:ok, socket}
   end
 
-  defp idx_map(outputs) do
+  defp map_idx_to_persistent_id(outputs, root_id) do
     outputs
     |> Enum.with_index()
-    |> Map.new(fn {{output_idx, _}, idx} -> {output_idx, idx} end)
+    |> Map.new(fn {{output_idx, _}, idx} -> {output_idx, "#{root_id}-#{idx}"} end)
   end
 
   @impl true
@@ -81,7 +81,7 @@ defmodule LivebookWeb.Output.FrameComponent do
         <div id={"frame-outputs-#{@id}-#{@counter}"} phx-update="append">
           <LivebookWeb.Output.outputs
             outputs={@outputs}
-            dom_id_map={@persistent_idx_map}
+            dom_id_map={@persistent_id_map}
             socket={@socket}
             session_id={@session_id}
             input_values={@input_values}
diff --git a/test/livebook_web/live/session_live_test.exs b/test/livebook_web/live/session_live_test.exs
index 4f3ace542..7ea8836ae 100644
--- a/test/livebook_web/live/session_live_test.exs
+++ b/test/livebook_web/live/session_live_test.exs
@@ -36,6 +36,9 @@ defmodule LivebookWeb.SessionLiveTest do
       Session.set_notebook_name(session.pid, "My notebook")
       wait_for_session_update(session.pid)
 
+      # Wait for LV to update
+      render(view)
+
       assert page_title(view) =~ "My notebook"
     end