FIX: prevent redirect when image scale btn is inside a link.

FIX: prevent redirect when image scale btn is inside a link.

Currently in composer preview, if the image scale buttons are inside a <a> link then it redirects to the href location after the image scaling task.

diff --git a/app/assets/javascripts/discourse/app/components/composer-editor.js b/app/assets/javascripts/discourse/app/components/composer-editor.js
index f1520eb..3fde471 100644
--- a/app/assets/javascripts/discourse/app/components/composer-editor.js
+++ b/app/assets/javascripts/discourse/app/components/composer-editor.js
@@ -799,22 +799,24 @@ export default Component.extend({
 
       if (matchingPlaceholder) {
         const match = matchingPlaceholder[index];
-        if (!match) {
-          return;
-        }
 
-        const replacement = match.replace(
-          imageScaleRegex,
-          `![$1|$2, ${scale}%$4]($5)`
-        );
+        if (match) {
+          const replacement = match.replace(
+            imageScaleRegex,
+            `![$1|$2, ${scale}%$4]($5)`
+          );
 
-        this.appEvents.trigger(
-          "composer:replace-text",
-          matchingPlaceholder[index],
-          replacement,
-          { regex: imageScaleRegex, index }
-        );
+          this.appEvents.trigger(
+            "composer:replace-text",
+            matchingPlaceholder[index],
+            replacement,
+            { regex: imageScaleRegex, index }
+          );
+        }
       }
+
+      e.preventDefault();
+      return;
     });
   },
 
diff --git a/test/javascripts/acceptance/composer-test.js b/test/javascripts/acceptance/composer-test.js
index 5a30d17..9d246cd 100644
--- a/test/javascripts/acceptance/composer-test.js
+++ b/test/javascripts/acceptance/composer-test.js
@@ -750,7 +750,7 @@ QUnit.test("Image resizing buttons", async assert => {
 
   let uploads = [
     // 0 Default markdown with dimensions- should work
-    "![test|690x313](upload://test.png)",
+    "<a href='https://example.com'>![test|690x313](upload://test.png)</a>",
     // 1 Image with scaling percentage, should work
     "![test|690x313,50%](upload://test.png)",
     // 2 image with scaling percentage and a proceeding whitespace, should work
@@ -784,7 +784,8 @@ QUnit.test("Image resizing buttons", async assert => {
   );
 
   // Default
-  uploads[0] = "![test|690x313, 50%](upload://test.png)";
+  uploads[0] =
+    "<a href='https://example.com'>![test|690x313, 50%](upload://test.png)</a>";
   await click(
     find(".button-wrapper[data-image-index='0'] .scale-btn[data-scale='50']")
   );

GitHub sha: 0058a152

This commit has been mentioned on Discourse Meta. There might be relevant details there:

https://meta.discourse.org/t/image-resize-links-in-preview-dont-work-when-the-image-itself-is-a-hotlink/157711/4