diff --git a/README.md b/README.md
index f3ae6c48..49b49afc 100644
--- a/README.md
+++ b/README.md
@@ -290,6 +290,9 @@ npx @playwright/mcp@latest --config path/to/config.json
// Remote Playwright server endpoint
remoteEndpoint?: string;
+
+ // testIdAttribute to use. Defaults to "data-testid"
+ testIdAttribute?: string;
},
// Server configuration
diff --git a/config.d.ts b/config.d.ts
index a9359187..3ed8a2ef 100644
--- a/config.d.ts
+++ b/config.d.ts
@@ -68,6 +68,11 @@ export type Config = {
* Remote endpoint to connect to an existing Playwright server.
*/
remoteEndpoint?: string;
+
+ /**
+ * The attribute to use for test IDs. Defaults to "data-testid".
+ */
+ testIdAttribute?: string;
},
server?: {
diff --git a/src/context.ts b/src/context.ts
index ecf66b95..2bca84e5 100644
--- a/src/context.ts
+++ b/src/context.ts
@@ -346,6 +346,8 @@ ${code.join('\n')}
sources: false,
});
}
+ if (this.config.browser?.testIdAttribute)
+ playwright.selectors.setTestIdAttribute(this.config.browser.testIdAttribute);
return result;
}
}
diff --git a/tests/core.spec.ts b/tests/core.spec.ts
index a35e7ed0..b56af5fe 100644
--- a/tests/core.spec.ts
+++ b/tests/core.spec.ts
@@ -70,6 +70,79 @@ await page.getByRole('button', { name: 'Submit' }).click();
`);
});
+test('browser_click with testid', async ({ client, server }) => {
+ server.setContent('/', `
+
Title
+
+ `, 'text/html');
+
+ await client.callTool({
+ name: 'browser_navigate',
+ arguments: { url: server.PREFIX },
+ });
+
+ expect(await client.callTool({
+ name: 'browser_click',
+ arguments: {
+ element: 'Submit button',
+ ref: 'e2',
+ },
+ })).toHaveTextContent(`
+- Ran Playwright code:
+\`\`\`js
+// Click Submit button
+await page.getByTestId('submit-btn').click();
+\`\`\`
+
+- Page URL: ${server.PREFIX}
+- Page Title: Title
+- Page Snapshot
+\`\`\`yaml
+- button "Submit" [ref=e2]
+\`\`\`
+`);
+});
+
+test('browser_click with custom testid', async ({ startClient, server }) => {
+ const { client } = await startClient({
+ config: {
+ browser: {
+ testIdAttribute: 'data-custom-testid',
+ }
+ }
+ });
+ server.setContent('/', `
+ Title
+
+ `, 'text/html');
+
+ await client.callTool({
+ name: 'browser_navigate',
+ arguments: { url: server.PREFIX },
+ });
+
+ expect(await client.callTool({
+ name: 'browser_click',
+ arguments: {
+ element: 'Submit button',
+ ref: 'e2',
+ },
+ })).toHaveTextContent(`
+- Ran Playwright code:
+\`\`\`js
+// Click Submit button
+await page.getByTestId('submit-btn').click();
+\`\`\`
+
+- Page URL: ${server.PREFIX}
+- Page Title: Title
+- Page Snapshot
+\`\`\`yaml
+- button "Submit" [ref=e2]
+\`\`\`
+`);
+});
+
test('browser_select_option', async ({ client, server }) => {
server.setContent('/', `
Title