From c3f8ac7aebf465440937bc488180b3f9bb42a7d0 Mon Sep 17 00:00:00 2001
From: Ferit <frtcm11@gmail.com>
Date: Sun, 18 Oct 2026 00:29:37 +0300
Subject: [PATCH] Respect textarea editability before applying formatting

---
 src/index.ts |  2 +-
 test/test.js | 29 +++++++++++++++++++++++++++++
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/index.ts b/src/index.ts
index 73e088a..88b5883 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -837,7 +837,7 @@ function applyStyle(button: Element, stylesToApply: Style) {
   const style = {...defaults, ...stylesToApply}
 
   const field = toolbar.field
-  if (field) {
+  if (field && !field.readOnly && !field.matches(':disabled')) {
     field.focus()
     styleSelectedText(field, style)
   }
diff --git a/test/test.js b/test/test.js
index 944e174..84ba29e 100644
--- a/test/test.js
+++ b/test/test.js
@@ -131,6 +131,35 @@ describe('markdown-toolbar-element', function () {
       document.body.innerHTML = ''
     })
 
+    for (const restriction of ['readOnly', 'disabled', 'fieldset']) {
+      it(`does not format a ${restriction} field until it is editable again`, function () {
+        const field = document.querySelector('textarea')
+        field.value = 'Hubot'
+        field.setSelectionRange(0, field.value.length)
+        let inputs = 0
+        field.addEventListener('input', () => inputs++)
+        let fieldset
+        if (restriction === 'fieldset') {
+          fieldset = document.createElement('fieldset')
+          field.before(fieldset)
+          fieldset.append(field)
+          fieldset.disabled = true
+        } else {
+          field[restriction] = true
+        }
+
+        clickToolbar('md-bold')
+        assert.equal(field.value, 'Hubot')
+        assert.equal(inputs, 0)
+
+        if (fieldset) fieldset.disabled = false
+        else field[restriction] = false
+        clickToolbar('md-bold')
+        assert.equal(field.value, '**Hubot**')
+        assert.equal(inputs, 1)
+      })
+    }
+
     describe('focus management', function () {
       function focusFirstButton() {
         document.querySelector('markdown-toolbar').focus()