cbrowser 18.73.4 → 18.74.0

package/dist/browser.js

@@ -3421,14 +3421,29 @@ For more help: https://playwright.dev/docs/browsers
     async analyzePage() {
         const page = await this.getPage();
         const analysis = await page.evaluate(() => {
+            // Values are escaped before they enter a selector. Raw interpolation broke
+            // on ids a framework generated rather than a human wrote: `#:r0:` (React 18
+            // useId) and `#2fa-code` throw DOMException, and `#a.b` silently matches
+            // nothing at all. Priority is ARIA-first to match find_element_by_intent
+            // and the documented behaviour; an explicit test hook outranks a generated
+            // id, and aria-label outranks both. (2026-07-29)
+            const q = (v) => v.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
             const getSelector = (el) => {
+                const ariaLabel = el.getAttribute("aria-label");
+                if (ariaLabel)
+                    return `[aria-label="${q(ariaLabel)}"]`;
+                const testId = el.getAttribute("data-testid");
+                if (testId)
+                    return `[data-testid="${q(testId)}"]`;
                 if (el.id)
-                    return `#${el.id}`;
-                if (el.getAttribute("data-testid"))
-                    return `[data-testid="${el.getAttribute("data-testid")}"]`;
+                    return `#${CSS.escape(el.id)}`;
                 if (el.getAttribute("name"))
-                    return `[name="${el.getAttribute("name")}"]`;
-                const text = el.textContent?.trim().substring(0, 30);
+                    return `[name="${q(el.getAttribute("name"))}"]`;
+                // Was substring(0, 30) — the same truncation removed from aria-label and
+                // visible text elsewhere, still cutting the SELECTOR here, so a generated
+                // step said text="Sign up for Pro and get 500 bo" and matched nothing.
+                // A selector has to be the whole string to resolve. (2026-07-29)
+                const text = el.textContent?.trim().substring(0, 200);
                 if (text)
                     return `text="${text}"`;
                 return el.tagName.toLowerCase();
@@ -3678,27 +3693,40 @@ For more help: https://playwright.dev/docs/browsers
         for (const test of tests) {
             script += `# ${test.name}\n`;
             script += `# ${test.description}\n`;
+            // This must be the dialect src/testing/nl-test-suite.ts PARSES, because the
+            // MCP tool tells callers to paste it straight into nl_test_inline. It used
+            // to emit a `verb "quoted-arg"` form of its own invention, and every line
+            // came back action:"unknown" — `navigate "url"` is not a rule (the rule is
+            // `go to <url>`), and wrapping a selector in quotes leaves literal quote
+            // characters inside the target, which then nests against selectors like
+            // [data-testid="x"]. (2026-07-29)
             for (const step of test.steps) {
                 switch (step.action) {
                     case "navigate":
-                        script += `navigate "${step.target}"\n`;
+                        script += `go to ${step.target}\n`;
                         break;
                     case "click":
-                        script += `click "${step.target}"\n`;
+                        // Unquoted: the parser takes the rest of the line as the target.
+                        script += `click ${step.target}\n`;
                         break;
                     case "fill":
-                        script += `fill "${step.target}" "${step.value}"\n`;
+                        // The parser wants the VALUE quoted and the field bare.
+                        script += `fill ${step.target} with "${step.value}"\n`;
                         break;
                     case "assert":
-                        script += `assert "${step.target}"\n`;
+                        // step.target is already a predicate, e.g. url contains '/docs/'.
+                        script += `assert ${step.target}\n`;
                         break;
                     case "wait":
-                        script += `# wait ${step.value}ms\n`;
+                        script += `wait ${Math.max(1, Math.round(Number(step.value ?? 1000) / 1000))} seconds\n`;
                         break;
                 }
             }
+            // test.assertions are intentions, not executable steps — "no console
+            // errors" has no rule, and the grammar has no OR. Emitting them as steps
+            // produced unparseable lines, so they ship as comments.
             for (const assertion of test.assertions) {
-                script += `assert "${assertion}"\n`;
+                script += `# expected: ${assertion}\n`;
             }
             script += "\n";
         }
@@ -3888,7 +3916,11 @@ For more help: https://playwright.dev/docs/browsers
                     return {
                         tag: el.tagName.toLowerCase(),
                         text: el.innerText?.trim().substring(0, 80) || el.getAttribute("aria-label") || el.getAttribute("value") || "",
-                        selector: el.id ? `#${el.id}` : el.getAttribute("data-testid") ? `[data-testid="${el.getAttribute("data-testid")}"]` : `${el.tagName.toLowerCase()}:nth-of-type(${i + 1})`,
+                        selector: el.getAttribute("data-testid")
+                            ? `[data-testid="${el.getAttribute("data-testid").replace(/"/g, '\\"')}"]`
+                            : el.id
+                                ? `#${CSS.escape(el.id)}`
+                                : `${el.tagName.toLowerCase()}:nth-of-type(${i + 1})`,
                         role: el.getAttribute("role") || undefined,
                         aboveFold,
                         region: classifyRegion(el, r.top, r.bottom),
@@ -4369,14 +4401,19 @@ For more help: https://playwright.dev/docs/browsers
                 // Convert ElementHandle back to Locator isn't directly possible,
                 // but we can get a selector from it
                 const generatedSelector = await page.evaluate((el) => {
+                    // Escaped, and ARIA-first — see the note on analyzePage's getSelector.
+                    const q = (v) => v.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+                    const ariaLabel = el.getAttribute("aria-label");
+                    if (ariaLabel)
+                        return `[aria-label="${q(ariaLabel)}"]`;
+                    const testId = el.getAttribute("data-testid");
+                    if (testId)
+                        return `[data-testid="${q(testId)}"]`;
                     if (el.id)
-                        return `#${el.id}`;
+                        return `#${CSS.escape(el.id)}`;
                     const name = el.getAttribute("name");
                     if (name)
-                        return `[name="${name}"]`;
-                    const testId = el.getAttribute("data-testid");
-                    if (testId)
-                        return `[data-testid="${testId}"]`;
+                        return `[name="${q(name)}"]`;
                     return null;
                 }, element);
                 if (generatedSelector) {
@@ -4519,14 +4556,19 @@ For more help: https://playwright.dev/docs/browsers
             const element = fuzzyHandle.asElement();
             if (element) {
                 const generatedSelector = await page.evaluate((el) => {
+                    // Escaped, and ARIA-first — see the note on analyzePage's getSelector.
+                    const q = (v) => v.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
+                    const ariaLabel = el.getAttribute("aria-label");
+                    if (ariaLabel)
+                        return `[aria-label="${q(ariaLabel)}"]`;
+                    const testId = el.getAttribute("data-testid");
+                    if (testId)
+                        return `[data-testid="${q(testId)}"]`;
                     if (el.id)
-                        return `#${el.id}`;
+                        return `#${CSS.escape(el.id)}`;
                     const name = el.getAttribute("name");
                     if (name)
-                        return `[name="${name}"]`;
-                    const testId = el.getAttribute("data-testid");
-                    if (testId)
-                        return `[data-testid="${testId}"]`;
+                        return `[name="${q(name)}"]`;
                     return null;
                 }, element);
                 if (generatedSelector) {