Merge pull request #11 from mohamedatef24/extention

extension/background.js

@@ -196,6 +196,7 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
         text: message.text,
         mode: message.mode || 'replaceAll',
         source: message.source,
+        find: message.find || '',
       }, (resp) => sendResponse(resp || { ok: false }));
     });
     return true; // async

extension/content-inline.js

@@ -748,12 +748,75 @@
     try { captureSelection(e.target); } catch { pendingSelection = null; }
   }, true);
 
-  function writeTextToField(field, text, mode, source) {
+  function writeTextToField(field, text, mode, source, find) {
     if (!field || typeof text !== 'string') return;
 
     const tag = field.tagName.toLowerCase();
     const suppress = NON_CORRECTION_SOURCES.includes(source);
 
+    // ── find anchor: if the caller passed the original selected text, try to
+    // locate it inside the field and replace ONLY that occurrence. This is the
+    // most reliable way to scope a context-menu correction to the user's
+    // selection — it survives focus loss and timing gaps.
+    if (find && typeof find === 'string' && find.length > 0) {
+      if (tag === 'textarea' || tag === 'input') {
+        const idx = field.value.indexOf(find);
+        if (idx !== -1) {
+          const before = field.value.slice(0, idx);
+          const after = field.value.slice(idx + find.length);
+          field.value = before + text + after;
+          const caret = idx + text.length;
+          try { field.setSelectionRange(caret, caret); } catch {}
+          if (suppress) analysisSuppressed = true;
+          field.dispatchEvent(new Event('input', { bubbles: true }));
+          pendingSelection = null;
+          try { delete field.dataset.bayanSource; } catch {}
+          return;
+        }
+      } else if (field.isContentEditable) {
+        const content = field.innerText || field.textContent || '';
+        const idx = content.indexOf(find);
+        if (idx !== -1) {
+          field.focus();
+          const treeWalker = document.createTreeWalker(field, NodeFilter.SHOW_TEXT);
+          let charCount = 0;
+          let startNode = null, startOffset = 0, endNode = null, endOffset = 0;
+          while (treeWalker.nextNode()) {
+            const node = treeWalker.currentNode;
+            const nodeLen = node.textContent.length;
+            if (!startNode && charCount + nodeLen > idx) {
+              startNode = node;
+              startOffset = idx - charCount;
+            }
+            if (startNode && charCount + nodeLen >= idx + find.length) {
+              endNode = node;
+              endOffset = idx + find.length - charCount;
+              break;
+            }
+            charCount += nodeLen;
+          }
+          if (startNode && endNode) {
+            try {
+              const range = document.createRange();
+              range.setStart(startNode, startOffset);
+              range.setEnd(endNode, endOffset);
+              const winSel = window.getSelection();
+              winSel.removeAllRanges();
+              winSel.addRange(range);
+              range.deleteContents();
+              range.insertNode(document.createTextNode(text));
+              winSel.collapseToEnd();
+              if (suppress) analysisSuppressed = true;
+              field.dispatchEvent(new Event('input', { bubbles: true }));
+              pendingSelection = null;
+              try { delete field.dataset.bayanSource; } catch {}
+              return;
+            } catch {}
+          }
+        }
+      }
+    }
+
     // Resolve the effective mode. 'auto' = replace the captured selection if we
     // have one for THIS field, otherwise replace the whole field.
     const sel = (pendingSelection && pendingSelection.field === field) ? pendingSelection : null;
@@ -834,7 +897,7 @@
       // so it can't win the response race against the frame that does.
       if (!field) return false;
       try {
-        writeTextToField(field, msg.text, msg.mode, msg.source);
+        writeTextToField(field, msg.text, msg.mode, msg.source, msg.find);
         sendResponse({ ok: true });
       } catch (err) {
         console.warn('[Bayan] Write-back error:', err.message);

extension/sidepanel/sidepanel.js

@@ -65,6 +65,10 @@ document.addEventListener('DOMContentLoaded', () => {
   let isAnalyzing = false;
   let contextConsumed = false;
   let debounceTimer = null;
+  // The exact text the user had selected on the page when this action started
+  // (from the right-click context menu). Used as a precise find/replace anchor
+  // so write-back replaces ONLY that selection, never the whole field.
+  let sourceSelectionText = '';
 
   const SCORE_CIRCUMFERENCE = 440;
   const DEBOUNCE_MS = 500;
@@ -155,14 +159,20 @@ document.addEventListener('DOMContentLoaded', () => {
   // The side panel is a separate document and cannot touch page DOM
   // directly; it relays through background.js. `source` lets the content
   // script decide whether to re-analyze (correct) or suppress (Change 3).
+  //
+  // `find` (optional) is the exact original selected text. When present, the
+  // content script replaces ONLY that occurrence in the field — the most
+  // reliable way to scope the replacement to the user's selection.
   // ══════════════════════════════════════════════════════════
-  function writeBackToPage(text, mode = 'auto', source = 'correct') {
+  function writeBackToPage(text, mode = 'auto', source = 'correct', find = '') {
     try {
       chrome.runtime.sendMessage(
-        { type: 'WRITE_BACK_TO_PAGE', text, mode, source },
+        { type: 'WRITE_BACK_TO_PAGE', text, mode, source, find },
         (resp) => {
-          if (resp && resp.ok) showToast('✓ تم تطبيق التغييرات في الصفحة');
-          else showToast('تعذّر الكتابة في الصفحة — انسخ النص يدوياً');
+          if (resp && resp.ok) {
+            sourceSelectionText = text;
+            showToast('✓ تم تطبيق التغييرات في الصفحة');
+          } else showToast('تعذّر الكتابة في الصفحة — انسخ النص يدوياً');
         }
       );
     } catch {
@@ -353,6 +363,7 @@ document.addEventListener('DOMContentLoaded', () => {
   btnClear.addEventListener('click', () => {
     inputText.value = '';
     analyzedText = '';
+    sourceSelectionText = '';
     updateCounts(inputText, charCount, wordCount);
     scoreSection.classList.add('is-hidden');
     resultSection.classList.add('is-hidden');
@@ -379,7 +390,7 @@ document.addEventListener('DOMContentLoaded', () => {
     updateScore(0, 0, 0);
     renderSuggestions([]);
     saveState();
-    writeBackToPage(analyzedText, 'auto', 'correct');
+    writeBackToPage(analyzedText, 'auto', 'correct', sourceSelectionText);
     showToast('✓ تم تطبيق جميع التصحيحات');
   });
 
@@ -393,7 +404,7 @@ document.addEventListener('DOMContentLoaded', () => {
       const finalText = currentSuggestions.length > 0
         ? applyAllPatches(analyzedText, currentSuggestions)
         : analyzedText;
-      writeBackToPage(finalText, 'auto', 'correct');
+      writeBackToPage(finalText, 'auto', 'correct', sourceSelectionText);
     });
   }
 
@@ -588,7 +599,7 @@ document.addEventListener('DOMContentLoaded', () => {
       btnApplyQuranTranslation.addEventListener('click', () => {
         const text = (quranTranslationText.textContent || '').trim();
         if (!text) { showToast('لا توجد ترجمة للتطبيق'); return; }
-        writeBackToPage(text, 'auto', 'quran');
+        writeBackToPage(text, 'auto', 'quran', sourceSelectionText);
       });
     }
 
@@ -706,7 +717,7 @@ document.addEventListener('DOMContentLoaded', () => {
     btn.addEventListener('click', () => {
       const text = (getText() || '').trim();
       if (!text) { showToast('لا يوجد نص للتطبيق'); return; }
-      writeBackToPage(text, 'auto', source);
+      writeBackToPage(text, 'auto', source, sourceSelectionText);
     });
     anchorBtn.parentElement.appendChild(btn);
   }
@@ -744,6 +755,7 @@ document.addEventListener('DOMContentLoaded', () => {
   // the matching tab's input, switching to it, and auto-running its model.
   // Declared after all element refs so dialect/quran handles are in scope.
   function runContextAction(action, text) {
+    sourceSelectionText = text;
     if (action === TAB.CORRECT) {
       inputText.value = text;
       updateCounts(inputText, charCount, wordCount);