From 2c9159288fb284a9d3d54310daffdfa65a4e5c59 Mon Sep 17 00:00:00 2001
From: Aitor Moreno <asakon28@gmail.com>
Date: Wed, 7 Jan 2026 12:18:05 +0100
Subject: [PATCH] :bug: Fix previous styles lost when changing selected text

---
 CHANGES.md                                    |  2 +-
 .../editor/controllers/SelectionController.js | 38 +++++++++++--------
 2 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/CHANGES.md b/CHANGES.md
index f6d861db12..c391f09d0d 100644
--- a/CHANGES.md
+++ b/CHANGES.md
@@ -29,7 +29,7 @@
 - Fix missing text color token from selected shapes in selected colors list [Taiga #12956](https://tree.taiga.io/project/penpot/issue/12956)
 - Fix dropdown option width in Guides columns dropdown [Taiga #12959](https://tree.taiga.io/project/penpot/issue/12959)
 - Fix typos on download modal [Taiga #12865](https://tree.taiga.io/project/penpot/issue/12865)
-
+- Fix problem with text editor maintaining previous styles [Taiga #12835](https://tree.taiga.io/project/penpot/issue/12835)
 
 ## 2.12.1
 
diff --git a/frontend/text-editor/src/editor/controllers/SelectionController.js b/frontend/text-editor/src/editor/controllers/SelectionController.js
index 2586aab148..add28d65d7 100644
--- a/frontend/text-editor/src/editor/controllers/SelectionController.js
+++ b/frontend/text-editor/src/editor/controllers/SelectionController.js
@@ -242,7 +242,6 @@ export class SelectionController extends EventTarget {
         continue;
       }
       let styleValue = element.style.getPropertyValue(styleName);
-
       if (styleName === "font-family") {
         styleValue = sanitizeFontFamily(styleValue);
       }
@@ -277,22 +276,29 @@ export class SelectionController extends EventTarget {
     this.#applyDefaultStylesToCurrentStyle();
     const root = startNode.parentElement.parentElement.parentElement;
     this.#applyStylesFromElementToCurrentStyle(root);
-    // FIXME: I don't like this approximation. Having to iterate nodes twice
-    // is bad for performance. I think we need another way of "computing"
-    // the cascade.
-    for (const textNode of this.#textNodeIterator.iterateFrom(
-      startNode,
-      endNode,
-    )) {
-      const paragraph = textNode.parentElement.parentElement;
+    if (startNode === endNode) {
+      const paragraph = startNode.parentElement.parentElement;
       this.#applyStylesFromElementToCurrentStyle(paragraph);
-    }
-    for (const textNode of this.#textNodeIterator.iterateFrom(
-      startNode,
-      endNode,
-    )) {
-      const textSpan = textNode.parentElement;
-      this.#mergeStylesFromElementToCurrentStyle(textSpan);
+      const textSpan = startNode.parentElement;
+      this.#applyStylesFromElementToCurrentStyle(textSpan);
+    } else {
+      // FIXME: I don't like this approximation. Having to iterate nodes twice
+      // is bad for performance. I think we need another way of "computing"
+      // the cascade.
+      for (const textNode of this.#textNodeIterator.iterateFrom(
+        startNode,
+        endNode,
+      )) {
+        const paragraph = textNode.parentElement.parentElement;
+        this.#applyStylesFromElementToCurrentStyle(paragraph);
+      }
+      for (const textNode of this.#textNodeIterator.iterateFrom(
+        startNode,
+        endNode,
+      )) {
+        const textSpan = textNode.parentElement;
+        this.#mergeStylesFromElementToCurrentStyle(textSpan);
+      }
     }
     return this;
   }