Skip to content

Commit 5f05be8

Browse files
authored
feat: implement clickOnElement and typeIntoElement tools (#13)
* feat: add clickOnElement tool * feat: implement typeIntoElement command and refactor semantic queries * docs: add typeIntoElement command to docs in README * fix: remove unnecessary file
1 parent 7599139 commit 5f05be8

File tree

14 files changed

+2973
-107
lines changed

14 files changed

+2973
-107
lines changed

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
node_modules
22
build
3+
testplane-mcp-*.tgz

README.md

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,3 +141,87 @@ Navigate to URL in the browser.
141141
Close the current browser session.
142142

143143
</details>
144+
145+
<details>
146+
<summary>Element Interaction</summary>
147+
148+
### `clickOnElement`
149+
Click an element on the page using semantic queries (`testing-library`-style) or CSS selectors.
150+
151+
- Semantic Queries:
152+
- **Parameters:**
153+
- `queryType` (string, optional): Semantic query type. One of:
154+
- `"role"` - Find by ARIA role (e.g., "button", "link", "heading")
155+
- `"text"` - Find by visible text content
156+
- `"labelText"` - Find form inputs by their label text
157+
- `"placeholderText"` - Find inputs by placeholder text
158+
- `"altText"` - Find images by alt text
159+
- `"testId"` - Find by data-testid attribute
160+
- `"title"` - Find by title attribute
161+
- `"displayValue"` - Find inputs by their current value
162+
- `queryValue` (string, required when using queryType): The value to search for
163+
- `queryOptions` (object, optional): Additional options:
164+
- `name` (string): Accessible name for role queries
165+
- `exact` (boolean): Whether to match exact text (default: true)
166+
- `hidden` (boolean): Include hidden elements (default: false)
167+
- `level` (number): Heading level for role="heading" (1-6)
168+
169+
- CSS Selectors:
170+
- **Parameters:**
171+
- `selector` (string, optional): CSS selector or XPath when semantic queries cannot locate the element
172+
173+
**Examples:**
174+
```javascript
175+
// Semantic queries (preferred)
176+
{ queryType: "role", queryValue: "button", queryOptions: { name: "Submit" } }
177+
{ queryType: "text", queryValue: "Click here" }
178+
{ queryType: "labelText", queryValue: "Email Address" }
179+
180+
// CSS selector fallback
181+
{ selector: ".submit-btn" }
182+
{ selector: "#unique-element" }
183+
```
184+
185+
**Note:** Provide either semantic query parameters OR selector, not both.
186+
187+
### `typeIntoElement`
188+
Type text into an input element on the page using semantic queries (`testing-library`-style) or CSS selectors.
189+
190+
- Semantic Queries:
191+
- **Parameters:**
192+
- `queryType` (string, optional): Semantic query type. One of:
193+
- `"role"` - Find by ARIA role (e.g., "textbox", "searchbox")
194+
- `"text"` - Find by visible text content
195+
- `"labelText"` - Find form inputs by their label text
196+
- `"placeholderText"` - Find inputs by placeholder text
197+
- `"altText"` - Find images by alt text
198+
- `"testId"` - Find by data-testid attribute
199+
- `"title"` - Find by title attribute
200+
- `"displayValue"` - Find inputs by their current value
201+
- `queryValue` (string, required when using queryType): The value to search for
202+
- `text` (string, required): The text to type into the element
203+
- `queryOptions` (object, optional): Additional options:
204+
- `name` (string): Accessible name for role queries
205+
- `exact` (boolean): Whether to match exact text (default: true)
206+
- `hidden` (boolean): Include hidden elements (default: false)
207+
208+
- CSS Selectors:
209+
- **Parameters:**
210+
- `selector` (string, optional): CSS selector or XPath when semantic queries cannot locate the element
211+
- `text` (string, required): The text to type into the element
212+
213+
**Examples:**
214+
```javascript
215+
// Semantic queries (preferred)
216+
{ queryType: "labelText", queryValue: "Email Address", text: "[email protected]" }
217+
{ queryType: "placeholderText", queryValue: "Enter your name", text: "John Smith" }
218+
{ queryType: "role", queryValue: "textbox", queryOptions: { name: "Username" }, text: "john_doe" }
219+
220+
// CSS selector fallback
221+
{ selector: "#username", text: "john_doe" }
222+
{ selector: "input[name='email']", text: "[email protected]" }
223+
```
224+
225+
**Note:** Provide either semantic query parameters OR selector, not both.
226+
227+
</details>

0 commit comments

Comments
 (0)