chore(layout-bridge): clean up RTL click-to-position code and add behavior tests

Follow-up to #2541:
- Replace IIFE in log payload with a reusable local variable
- Tighten RTL empty-element snap test assertion from loose (5 || 10) to exact (5)
- Fix test comment to reference LTR counterpart by name instead of line number
- Add Playwright behavior tests for RTL click-to-position mapping

Author: caio-pizzol

packages/layout-engine/layout-bridge/src/dom-mapping.ts

@@ -509,17 +509,15 @@ function resolveLinePosition(
 
   const spanStart = Number(targetEl.dataset.pmStart ?? 'NaN');
   const spanEnd = Number(targetEl.dataset.pmEnd ?? 'NaN');
+  const targetRect = targetEl.getBoundingClientRect();
 
   log('Target element:', {
     tag: targetEl.tagName,
     pmStart: spanStart,
     pmEnd: spanEnd,
     text: targetEl.textContent?.substring(0, 30),
     visibility: targetEl.style.visibility,
-    rect: (() => {
-      const r = targetEl.getBoundingClientRect();
-      return { left: r.left, right: r.right, width: r.width };
-    })(),
+    rect: { left: targetRect.left, right: targetRect.right, width: targetRect.width },
   });
 
   if (!Number.isFinite(spanStart) || !Number.isFinite(spanEnd)) {
@@ -529,8 +527,7 @@ function resolveLinePosition(
 
   const firstChild = targetEl.firstChild;
   if (!firstChild || firstChild.nodeType !== Node.TEXT_NODE || !firstChild.textContent) {
-    const elRect = targetEl.getBoundingClientRect();
-    const closerToLeft = Math.abs(viewX - elRect.left) <= Math.abs(viewX - elRect.right);
+    const closerToLeft = Math.abs(viewX - targetRect.left) <= Math.abs(viewX - targetRect.right);
     const snapPos = rtl ? (closerToLeft ? spanEnd : spanStart) : closerToLeft ? spanStart : spanEnd;
     log('Empty/non-text element, snapping to:', { closerToLeft, rtl, snapPos });
     return snapPos;

packages/layout-engine/layout-bridge/test/dom-mapping.test.ts

@@ -598,12 +598,12 @@ describe('DOM-based click-to-position mapping', () => {
         </div>
       `;
 
-      // LTR version of this test (line 279) expects 5 or 10.
-      // In RTL with a zero-sized rect the "closer to left" check resolves to
-      // spanEnd (10) instead of spanStart (5).
+      // In JSDOM all rects are zero-sized, so viewX (1) >= visualRight (0) triggers
+      // the right-boundary snap which returns lineStart (5) for RTL.
+      // The LTR counterpart ('handles empty text nodes gracefully') returns lineEnd (10).
       const spanRect = container.querySelector('span')!.getBoundingClientRect();
       const result = clickToPositionDom(container, spanRect.left + 1, spanRect.top + 1);
-      expect(result === 5 || result === 10).toBe(true);
+      expect(result).toBe(5);
     });
   });
 

tests/behavior/tests/selection/fixtures/rtl-mixed-bidi.docx

@@ -0,0 +1,127 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import { test, expect } from '../../fixtures/superdoc.js';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const DOC_PATH = path.resolve(__dirname, 'fixtures/rtl-mixed-bidi.docx');
+
+test.skip(!fs.existsSync(DOC_PATH), 'RTL fixture not available');
+
+test.use({ config: { toolbar: 'none', showCaret: true, showSelection: true } });
+
+test.describe('RTL click-to-position mapping', () => {
+  test('clicking left and right of RTL line places cursor at different positions', async ({ superdoc }) => {
+    await superdoc.loadDocument(DOC_PATH);
+    await superdoc.waitForStable();
+
+    // First line is RTL Arabic text: "هذه فقرة كاملة باللغة العربية"
+    const rtlLine = superdoc.page.locator('.superdoc-line').first();
+    const box = await rtlLine.boundingBox();
+    if (!box) throw new Error('RTL line not visible');
+
+    // Click near the right edge (logical start of RTL text)
+    await superdoc.page.mouse.click(box.x + box.width - 10, box.y + box.height / 2);
+    await superdoc.waitForStable();
+    const selRight = await superdoc.getSelection();
+
+    // Click near the left edge (logical end of RTL text)
+    await superdoc.page.mouse.click(box.x + 10, box.y + box.height / 2);
+    await superdoc.waitForStable();
+    const selLeft = await superdoc.getSelection();
+
+    expect(selRight.from).toBeGreaterThan(0);
+    expect(selLeft.from).toBeGreaterThan(0);
+
+    // In RTL, clicking right (text start) should give a lower PM position
+    // than clicking left (text end)
+    expect(selRight.from).toBeLessThan(selLeft.from);
+  });
+
+  test('clicking inside RTL text places cursor at valid position', async ({ superdoc }) => {
+    await superdoc.loadDocument(DOC_PATH);
+    await superdoc.waitForStable();
+
+    // First line is RTL: "هذه فقرة كاملة باللغة العربية"
+    // RTL text renders right-aligned, so we need to click within the text area
+    const rtlLine = superdoc.page.locator('.superdoc-line').first();
+    const box = await rtlLine.boundingBox();
+    if (!box) throw new Error('RTL line not visible');
+
+    // Find the first span to know where the visible text actually is
+    const span = superdoc.page.locator('.superdoc-line').first().locator('span[data-pm-start]').first();
+    const spanBox = await span.boundingBox();
+    if (!spanBox) throw new Error('RTL span not visible');
+
+    // Click inside the visible text area (middle of the span)
+    await superdoc.page.mouse.click(spanBox.x + spanBox.width / 2, spanBox.y + spanBox.height / 2);
+    await superdoc.waitForStable();
+
+    const sel = await superdoc.getSelection();
+    const lineStart = Number(await rtlLine.getAttribute('data-pm-start'));
+    const lineEnd = Number(await rtlLine.getAttribute('data-pm-end'));
+
+    // Cursor should be within the line's PM range
+    expect(sel.from).toBeGreaterThanOrEqual(lineStart);
+    expect(sel.from).toBeLessThanOrEqual(lineEnd);
+  });
+
+  test('clicking left edge of RTL and LTR lines gives opposite ends', async ({ superdoc }) => {
+    await superdoc.loadDocument(DOC_PATH);
+    await superdoc.waitForStable();
+
+    const lines = superdoc.page.locator('.superdoc-line');
+
+    // Line 0: RTL (pm 2-47), Line 1: LTR (pm 51-87)
+    const rtlLine = lines.nth(0);
+    const ltrLine = lines.nth(1);
+
+    const rtlBox = await rtlLine.boundingBox();
+    const ltrBox = await ltrLine.boundingBox();
+    if (!rtlBox || !ltrBox) throw new Error('Lines not visible');
+
+    // Click left edge of LTR line → should land near lineStart
+    await superdoc.page.mouse.click(ltrBox.x + 10, ltrBox.y + ltrBox.height / 2);
+    await superdoc.waitForStable();
+    const selLtr = await superdoc.getSelection();
+    const ltrStart = Number(await ltrLine.getAttribute('data-pm-start'));
+    const ltrEnd = Number(await ltrLine.getAttribute('data-pm-end'));
+
+    // Click left edge of RTL line → should land near lineEnd (inverted)
+    await superdoc.page.mouse.click(rtlBox.x + 10, rtlBox.y + rtlBox.height / 2);
+    await superdoc.waitForStable();
+    const selRtl = await superdoc.getSelection();
+    const rtlStart = Number(await rtlLine.getAttribute('data-pm-start'));
+    const rtlEnd = Number(await rtlLine.getAttribute('data-pm-end'));
+
+    // LTR: left click → near start of line
+    expect(selLtr.from).toBeLessThan(ltrStart + (ltrEnd - ltrStart) / 2);
+
+    // RTL: left click → near end of line (inverted direction)
+    expect(selRtl.from).toBeGreaterThan(rtlStart + (rtlEnd - rtlStart) / 2);
+  });
+
+  test('clicking on mixed bidi RTL line places cursor correctly', async ({ superdoc }) => {
+    await superdoc.loadDocument(DOC_PATH);
+    await superdoc.waitForStable();
+
+    // Line 3: RTL mixed bidi "نص عربي ثم English text ثم عربي مرة أخرى"
+    const mixedLine = superdoc.page.locator('.superdoc-line').nth(3);
+    const box = await mixedLine.boundingBox();
+    if (!box) throw new Error('Mixed bidi line not visible');
+
+    // Click left edge
+    await superdoc.page.mouse.click(box.x + 10, box.y + box.height / 2);
+    await superdoc.waitForStable();
+    const selLeft = await superdoc.getSelection();
+
+    // Click right edge
+    await superdoc.page.mouse.click(box.x + box.width - 10, box.y + box.height / 2);
+    await superdoc.waitForStable();
+    const selRight = await superdoc.getSelection();
+
+    expect(selLeft.from).toBeGreaterThan(0);
+    expect(selRight.from).toBeGreaterThan(0);
+    expect(selLeft.from).not.toBe(selRight.from);
+  });
+});