From e264572597f6e8a988354e3eb0d82d01f03796fc Mon Sep 17 00:00:00 2001 From: Keegan George Date: Mon, 26 May 2025 10:24:06 -0700 Subject: [PATCH] FIX: Closing AI menu stops post audio from playing (#1369) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## :mag: Overview When you have a post with audio being played and you open and close the AI post helper menu, it re-renders the entire post DOM, causing the audio to be interrupted and stop playing. The reason for this is because we highlight the selected text when opening the AI post helper menu and we replace the entire post back with the original post HTML when closing the menu. This fix ensures that we do not re-render the entire post DOM and instead only remove the highlighted section that was added. ## 🔗 Context https://meta.discourse.org/t/ai-helper-interrupting-uploaded-mp3-audio-stream/366817?u=keegan --- .../post-text-buttons/ai-post-helper-trigger.gjs | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/assets/javascripts/discourse/connectors/post-text-buttons/ai-post-helper-trigger.gjs b/assets/javascripts/discourse/connectors/post-text-buttons/ai-post-helper-trigger.gjs index a211ada9..d429fbe3 100644 --- a/assets/javascripts/discourse/connectors/post-text-buttons/ai-post-helper-trigger.gjs +++ b/assets/javascripts/discourse/connectors/post-text-buttons/ai-post-helper-trigger.gjs @@ -19,7 +19,6 @@ export default class AiPostHelperTrigger extends Component { @tracked menuState = this.MENU_STATES.triggers; @tracked showMainButtons = true; @tracked showAiButtons = true; - @tracked originalPostHTML = null; @tracked postHighlighted = false; @tracked currentMenu = this.menu.getByIdentifier( "post-text-selection-toolbar" @@ -45,7 +44,6 @@ export default class AiPostHelperTrigger extends Component { return; } - this.originalPostHTML = postElement.innerHTML; this.selectedText = this.args.outletArgs.data.quoteState.buffer; const selection = window.getSelection(); @@ -121,7 +119,15 @@ export default class AiPostHelperTrigger extends Component { return; } - postElement.innerHTML = this.originalPostHTML; + const highlightedSpans = postElement.querySelectorAll( + "span.ai-helper-highlighted-selection" + ); + + highlightedSpans.forEach((span) => { + const textNode = document.createTextNode(span.textContent); + span.parentNode.replaceChild(textNode, span); + }); + this.postHighlighted = false; }