From 3b679f11949f0b40be06afac0d71761dbad24b0d Mon Sep 17 00:00:00 2001
From: Austin Mroz <AustinMroz@utexas.edu>
Date: Thu, 3 Oct 2024 17:33:18 -0500
Subject: [PATCH] Return styling to body, streamline tests

Styling was moved to the sidebar element for better organization, but
this caused errors when the new menu was not in use.
---
 browser_tests/documentationSidebar.spec.ts  | 39 +++++++++++----------
 src/extensions/core/documentationSidebar.ts |  2 +-
 2 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/browser_tests/documentationSidebar.spec.ts b/browser_tests/documentationSidebar.spec.ts
index b2c51865f..e3f6b9048 100644
--- a/browser_tests/documentationSidebar.spec.ts
+++ b/browser_tests/documentationSidebar.spec.ts
@@ -2,13 +2,25 @@ import { expect } from '@playwright/test'
 import { comfyPageFixture as test } from './ComfyPage'
 
 test.describe('Documentation Sidebar', () => {
+  test.beforeEach(async ({ comfyPage }) => {
+    await comfyPage.setSetting('Comfy.UseNewMenu', 'Floating')
+    await comfyPage.loadWorkflow('default')
+  })
+
+  test.afterEach(async ({ comfyPage }) => {
+    const currentThemeId = await comfyPage.menu.getThemeId()
+    if (currentThemeId !== 'dark') {
+      await comfyPage.menu.toggleTheme()
+    }
+    await comfyPage.setSetting('Comfy.UseNewMenu', 'Disabled')
+  })
+
   test('Sidebar registered', async ({ comfyPage }) => {
     await expect(
       comfyPage.page.locator('.documentationSidebar-tab-button')
     ).toBeVisible()
   })
   test('Parses help for basic node', async ({ comfyPage }) => {
-    await comfyPage.loadWorkflow('default')
     await comfyPage.page.locator('.documentationSidebar-tab-button').click()
     const docPane = comfyPage.page.locator('.sidebar-content-container')
     //Check that each independently parsed element exists
@@ -18,7 +30,6 @@ test.describe('Documentation Sidebar', () => {
     await expect(docPane).toContainText('The VAE model used')
   })
   test('Responds to hovering over node', async ({ comfyPage }) => {
-    await comfyPage.loadWorkflow('default')
     await comfyPage.page.locator('.documentationSidebar-tab-button').click()
     const docPane = comfyPage.page.locator('.sidebar-content-container')
     await comfyPage.page.mouse.move(321, 593)
@@ -32,7 +43,6 @@ test.describe('Documentation Sidebar', () => {
     ).toBeFocused()
   })
   test('Updates when a new node is selected', async ({ comfyPage }) => {
-    await comfyPage.loadWorkflow('default')
     await comfyPage.page.locator('.documentationSidebar-tab-button').click()
     const docPane = comfyPage.page.locator('.sidebar-content-container')
     await comfyPage.page.mouse.click(557, 440)
@@ -43,21 +53,12 @@ test.describe('Documentation Sidebar', () => {
       'A conditioning containing the embedded text'
     )
   })
-  test.describe('Theming', () => {
-    test.beforeEach(async ({ comfyPage }) => {
-      await comfyPage.setSetting('Comfy.ColorPalette', 'dark')
-    })
-    test.afterEach(async ({ comfyPage }) => {
-      await comfyPage.setSetting('Comfy.ColorPalette', 'dark')
-    })
-    test('Responds to a change in theme', async ({ comfyPage }) => {
-      await comfyPage.loadWorkflow('default')
-      await comfyPage.page.locator('.documentationSidebar-tab-button').click()
-      const docPane = comfyPage.page.locator('.sidebar-content-container')
-      await comfyPage.setSetting('Comfy.ColorPalette', 'light')
-      await expect(docPane).toHaveScreenshot(
-        'documentation-sidebar-light-theme.png'
-      )
-    })
+  test('Responds to a change in theme', async ({ comfyPage }) => {
+    await comfyPage.page.locator('.documentationSidebar-tab-button').click()
+    const docPane = comfyPage.page.locator('.sidebar-content-container')
+    comfyPage.menu.toggleTheme()
+    await expect(docPane).toHaveScreenshot(
+      'documentation-sidebar-light-theme.png'
+    )
   })
 })
diff --git a/src/extensions/core/documentationSidebar.ts b/src/extensions/core/documentationSidebar.ts
index 420c2a084..2fb13aa59 100644
--- a/src/extensions/core/documentationSidebar.ts
+++ b/src/extensions/core/documentationSidebar.ts
@@ -181,7 +181,7 @@ docStyleElement.innerHTML = `
   font-size: 1.5em; content: '?';
 }
 `
-document.querySelector('.side-tool-bar-container').append(docStyleElement)
+document.body.append(docStyleElement)
 
 var bringToFront
 class DocumentationSidebar implements CustomSidebarTabExtension {