From 8121ef144fad6ba42322cf98cefe78ef4f484ac7 Mon Sep 17 00:00:00 2001
From: alex-SOLTIA <alex@soltia.ai>
Date: Fri, 6 Mar 2026 23:53:33 +0100
Subject: [PATCH] fix: use browser.getLocator() for ref support in all commands

Multiple commands (innerText, innerHTML, highlight, clear, selectText,
setvalue, dispatch, count, boundingBox, nth, scroll hover, multiselect,
screenshot) were using page.locator() directly instead of
browser.getLocator(), which meant @ref arguments (like @e1) would fail
with "Unsupported token" CSS parsing errors.

Now all commands consistently use browser.getLocator() which handles
both ref resolution and regular CSS selectors.

Fixes #128

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/actions.ts | 37 ++++++++++++++-----------------------
 1 file changed, 14 insertions(+), 23 deletions(-)

diff --git a/src/actions.ts b/src/actions.ts
index 681a33e9..c96549bf 100644
--- a/src/actions.ts
+++ b/src/actions.ts
@@ -1051,7 +1051,7 @@ async function handleContent(
 
   let html: string;
   if (command.selector) {
-    html = await page.locator(command.selector).innerHTML();
+    html = await browser.getLocator(command.selector).innerHTML();
   } else {
     html = await page.content();
   }
@@ -1609,8 +1609,7 @@ async function handleIsChecked(
 }
 
 async function handleCount(command: CountCommand, browser: BrowserManager): Promise<Response> {
-  const page = browser.getPage();
-  const count = await page.locator(command.selector).count();
+  const count = await browser.getLocator(command.selector).count();
   return successResponse(command.id, { count });
 }
 
@@ -1618,8 +1617,7 @@ async function handleBoundingBox(
   command: BoundingBoxCommand,
   browser: BrowserManager
 ): Promise<Response> {
-  const page = browser.getPage();
-  const box = await page.locator(command.selector).boundingBox();
+  const box = await browser.getLocator(command.selector).boundingBox();
   return successResponse(command.id, { box });
 }
 
@@ -2014,8 +2012,7 @@ async function handleWheel(command: WheelCommand, browser: BrowserManager): Prom
   const page = browser.getPage();
 
   if (command.selector) {
-    const element = page.locator(command.selector);
-    await element.hover();
+    await browser.getLocator(command.selector).hover();
   }
 
   await page.mouse.wheel(command.deltaX ?? 0, command.deltaY ?? 0);
@@ -2054,13 +2051,12 @@ async function handleHighlight(
   browser: BrowserManager
 ): Promise<Response> {
   const page = browser.getPage();
-  await page.locator(command.selector).highlight();
+  await browser.getLocator(command.selector).highlight();
   return successResponse(command.id, { highlighted: true });
 }
 
 async function handleClear(command: ClearCommand, browser: BrowserManager): Promise<Response> {
-  const page = browser.getPage();
-  await page.locator(command.selector).clear();
+  await browser.getLocator(command.selector).clear();
   return successResponse(command.id, { cleared: true });
 }
 
@@ -2068,8 +2064,7 @@ async function handleSelectAll(
   command: SelectAllCommand,
   browser: BrowserManager
 ): Promise<Response> {
-  const page = browser.getPage();
-  await page.locator(command.selector).selectText();
+  await browser.getLocator(command.selector).selectText();
   return successResponse(command.id, { selected: true });
 }
 
@@ -2078,7 +2073,7 @@ async function handleInnerText(
   browser: BrowserManager
 ): Promise<Response> {
   const page = browser.getPage();
-  const text = await page.locator(command.selector).innerText();
+  const text = await browser.getLocator(command.selector).innerText();
   return successResponse(command.id, { text });
 }
 
@@ -2087,7 +2082,7 @@ async function handleInnerHtml(
   browser: BrowserManager
 ): Promise<Response> {
   const page = browser.getPage();
-  const html = await page.locator(command.selector).innerHTML();
+  const html = await browser.getLocator(command.selector).innerHTML();
   return successResponse(command.id, { html, origin: page.url() });
 }
 
@@ -2105,8 +2100,7 @@ async function handleSetValue(
   command: SetValueCommand,
   browser: BrowserManager
 ): Promise<Response> {
-  const page = browser.getPage();
-  await page.locator(command.selector).fill(command.value);
+  await browser.getLocator(command.selector).fill(command.value);
   return successResponse(command.id, { set: true });
 }
 
@@ -2114,8 +2108,7 @@ async function handleDispatch(
   command: DispatchEventCommand,
   browser: BrowserManager
 ): Promise<Response> {
-  const page = browser.getPage();
-  await page.locator(command.selector).dispatchEvent(command.event, command.eventInit);
+  await browser.getLocator(command.selector).dispatchEvent(command.event, command.eventInit);
   return successResponse(command.id, { dispatched: command.event });
 }
 
@@ -2265,8 +2258,7 @@ async function handleGetByTestId(
 }
 
 async function handleNth(command: NthCommand, browser: BrowserManager): Promise<Response> {
-  const page = browser.getPage();
-  const base = page.locator(command.selector);
+  const base = browser.getLocator(command.selector);
   const locator = command.index === -1 ? base.last() : base.nth(command.index);
 
   switch (command.subaction) {
@@ -2433,8 +2425,7 @@ async function handleMultiSelect(
   command: MultiSelectCommand,
   browser: BrowserManager
 ): Promise<Response> {
-  const page = browser.getPage();
-  const selected = await page.locator(command.selector).selectOption(command.values);
+  const selected = await browser.getLocator(command.selector).selectOption(command.values);
   return successResponse(command.id, { selected });
 }
 
@@ -2643,7 +2634,7 @@ async function handleDiffScreenshot(
   const page = browser.getPage();
   let screenshotBuffer: Buffer;
   if (command.selector) {
-    const locator = browser.getLocatorFromRef(command.selector) || page.locator(command.selector);
+    const locator = browser.getLocator(command.selector);
     screenshotBuffer = await locator.screenshot({ type: 'png' });
   } else {
     screenshotBuffer = await page.screenshot({ fullPage: command.fullPage, type: 'png' });