From 0424eb8db279febc1edef3787b64f979c259ab53 Mon Sep 17 00:00:00 2001
From: Selase Krakani <849886+s3lase@users.noreply.github.com>
Date: Thu, 4 May 2023 10:09:37 +0000
Subject: [PATCH] FIX: Ensure expand table works regardless of click event
 target (#21373)

In the expand table event handler, we currently rely on `event.target`
to select the table being expanded. Sometimes, the target is the svg icon
wrapped inside the button instead of the button itself. This throws
things off.

This change uses `currentTarget` which refers to the button
element even if the event originated from svg icon.
---
 .../discourse/app/initializers/post-decorations.js    |  2 +-
 .../tests/acceptance/post-table-wrapper-test.js       | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/discourse/app/initializers/post-decorations.js b/app/assets/javascripts/discourse/app/initializers/post-decorations.js
index c62ef5b4588..162eec7de61 100644
--- a/app/assets/javascripts/discourse/app/initializers/post-decorations.js
+++ b/app/assets/javascripts/discourse/app/initializers/post-decorations.js
@@ -158,7 +158,7 @@ export default {
       }
 
       function generateModal(event) {
-        const table = event.target.parentElement.nextElementSibling;
+        const table = event.currentTarget.parentElement.nextElementSibling;
         const tempTable = table.cloneNode(true);
 
         showModal("fullscreen-table").set("tableHtml", tempTable);
diff --git a/app/assets/javascripts/discourse/tests/acceptance/post-table-wrapper-test.js b/app/assets/javascripts/discourse/tests/acceptance/post-table-wrapper-test.js
index 217303d2fcd..909a90bc6e6 100644
--- a/app/assets/javascripts/discourse/tests/acceptance/post-table-wrapper-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/post-table-wrapper-test.js
@@ -37,6 +37,7 @@ acceptance("Post Table Wrapper Test", function () {
     await click(
       `${postWithLargeTable} .fullscreen-table-wrapper .btn-expand-table`
     );
+
     assert.ok(
       exists(".fullscreen-table-modal"),
       "The fullscreen table modal appears"
@@ -45,5 +46,15 @@ acceptance("Post Table Wrapper Test", function () {
       exists(".fullscreen-table-modal table"),
       "The table is present inside the modal"
     );
+
+    await click(".fullscreen-table-modal .modal-close.close");
+    await click(
+      `${postWithLargeTable} .fullscreen-table-wrapper .btn-expand-table svg`
+    );
+
+    assert.ok(
+      exists(".fullscreen-table-modal"),
+      "Fullscreen table modal appears on clicking svg icon"
+    );
   });
 });