From b863c11e67cc3c6bc75509d05e74593c95a38fa6 Mon Sep 17 00:00:00 2001
From: Chenlei Hu <chenlei.hu@mail.utoronto.ca>
Date: Sun, 25 Aug 2024 10:01:42 -0400
Subject: [PATCH] Fix node library bookmark preview (#626)

---
 browser_tests/menu.spec.ts                               | 6 ++++++
 src/components/sidebar/tabs/NodeLibrarySidebarTab.vue    | 5 +----
 src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue | 2 +-
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/browser_tests/menu.spec.ts b/browser_tests/menu.spec.ts
index 2b3ebbc3f7..a3eba0ae60 100644
--- a/browser_tests/menu.spec.ts
+++ b/browser_tests/menu.spec.ts
@@ -105,6 +105,12 @@ test.describe('Menu', () => {
       )
       // Verify the bookmark node with the same name is added to the tree.
       expect(await tab.getNode('KSampler (Advanced)').count()).toBe(2)
+
+      // Hover on the bookmark node to display the preview
+      await comfyPage.page.hover('.node-tree-leaf.bookmark')
+      expect(await comfyPage.page.isVisible('.node-lib-node-preview')).toBe(
+        true
+      )
     })
 
     test('Ignores unrecognized node', async ({ comfyPage }) => {
diff --git a/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue b/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue
index 009564f051..ed85fb2396 100644
--- a/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue
+++ b/src/components/sidebar/tabs/NodeLibrarySidebarTab.vue
@@ -24,10 +24,7 @@
         :pt="{
           nodeLabel: 'node-lib-tree-node-label',
           nodeContent: ({ props }) => ({
-            onClick: (e: MouseEvent) => onNodeContentClick(e, props.node)
-          }),
-          nodeChildren: ({ props }) => ({
-            'data-comfy-node-name': props.node?.data?.name,
+            onClick: (e: MouseEvent) => onNodeContentClick(e, props.node),
             onMouseenter: (event: MouseEvent) =>
               handleNodeHover(event, props.node?.data?.name),
             onMouseleave: () => {
diff --git a/src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue b/src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue
index c33b9ff156..08c747814c 100644
--- a/src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue
+++ b/src/components/sidebar/tabs/nodeLibrary/NodeTreeLeaf.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="node-tree-leaf" ref="container">
+  <div :class="['node-tree-leaf', { bookmark: isBookmarked }]" ref="container">
     <div class="node-content">
       <Tag
         v-if="node.experimental"