Allow printing non-active chats

linting
i-dot-ai · Jan 10, 2025 · 21938f4 · 21938f4
1 parent 45fa46f
commit 21938f4
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 18 deletions.
diff --git a/django_app/frontend/src/js/web-components/chats/chat-history-item.js b/django_app/frontend/src/js/web-components/chats/chat-history-item.js
@@ -40,13 +40,7 @@ class ChatHistoryItem extends HTMLElement {
       this.toggleButton?.setAttribute("aria-expanded", "false");
       this.#toggleChatTitleEdit(true);
     });
-    if (this.dataset.iscurrentchat === "true") {
-      this.querySelector('[data-action="print"]')?.addEventListener("click", () => {
-        window.print();
-      });
-    } else {
-      this.querySelector('[data-action="print"]').style.display = "none";
-    }
+    this.querySelector('[data-action="print"]')?.addEventListener("click", this.#printChat);
 
     let deleteButton = /** @type {HTMLButtonElement} */ (this.querySelector('[data-action="delete-confirm"]'));
     deleteButton.addEventListener("click", async () => {
@@ -186,6 +180,22 @@ class ChatHistoryItem extends HTMLElement {
     }
   };
 
+  #printChat = () => {
+    const url = this.querySelector(".rb-chat-history__link").href;
+    const printFrame = document.createElement("iframe");
+    printFrame.addEventListener("load", () => {
+      const closePrint = () => {
+        document.body.removeChild(printFrame);
+      };
+      printFrame.contentWindow.addEventListener("beforeunload", closePrint);
+      printFrame.contentWindow.addEventListener("afterprint", closePrint);
+      printFrame.contentWindow?.print();
+      printFrame.style.display = "none";
+    });
+    printFrame.src = url;
+    document.body.appendChild(printFrame);
+  };
+
 }
 
 customElements.define("chat-history-item", ChatHistoryItem);
diff --git a/django_app/frontend/tests-web-components/chat-history.spec.js b/django_app/frontend/tests-web-components/chat-history.spec.js
@@ -36,16 +36,6 @@ test(`Chat history functionality works as expected`, async ({ page }) => {
   await textInput.press("Enter");
   await expect(chatHistoryItem).toContainText("Renamed chat");
 
-  // The print button only displays for the active chat
-  await page.locator(".rb-chat-history__actions-button").first().click();
-  await page.waitForTimeout(500);
-  await expect(page.locator('button[data-action="print"]').first()).toBeVisible();
-  await page.locator(".rb-chat-history__actions-button").first().click();
-  await page.locator(".rb-chat-history__actions-button").nth(1).click();
-  await page.waitForTimeout(500);
-  await expect(page.locator('button[data-action="print"]').nth(1)).not.toBeVisible();
-  await page.locator(".rb-chat-history__actions-button").nth(1).click();
-
   // A chat can be deleted
   await page.locator(".rb-chat-history__actions-button").first().click();
   await page.locator('button[data-action="delete"]').first().click();

diff --git a/django_app/redbox_app/settings.py b/django_app/redbox_app/settings.py
@@ -197,7 +197,7 @@
     "s3.amazonaws.com",
 )
 CSP_STYLE_SRC = ("'self'",)
-CSP_FRAME_ANCESTORS = ("'none'",)
+CSP_FRAME_ANCESTORS = ("'self'",)  # 'self' needed for printing chats
 
 
 CSP_CONNECT_SRC = [