Principle:Getgauge Taiko Button Selection
| Knowledge Sources | |
|---|---|
| Domains | Browser_Automation, Form_Interaction |
| Last Updated | 2026-02-12 00:00 GMT |
Overview
Button_Selection is a technique for identifying button elements on a web page using label text or attributes for click interactions.
Description
Button selection provides a way to locate clickable button elements by their visible text or attribute values. The principle supports multiple HTML tag types that represent buttons in web applications:
<button>elements<input type="submit">elements<input type="reset">elements<input type="button">elements<input type="image">elements
The selector follows a dual search strategy: it tries input elements first (checking the value and type attributes), then falls back to <button> elements. This two-phase approach ensures buttons are found regardless of the HTML implementation pattern used by the application. Many older applications and server-rendered forms use <input type="submit">, while modern single-page applications tend to use <button> elements. By searching both, Button_Selection handles both patterns transparently.
Like other Taiko selectors, Button_Selection supports proximity selectors for disambiguation. When a page contains multiple buttons with the same label (e.g., several "Delete" buttons in a list), relative selectors such as near(), above(), or below() narrow the match to the intended element based on spatial proximity to a reference element.
Usage
Use Button_Selection to find buttons for:
- Click operations — Triggering form submissions, navigation actions, or UI state changes.
- Existence assertions — Verifying that a specific button is present on the page.
- State assertions — Checking whether a button is visible, disabled, or enabled.
This principle is commonly applied in form submission verification flows, dialog interaction tests, and navigation automation scenarios.
Theoretical Basis
The dual search strategy is grounded in the observation that web applications use two distinct HTML patterns to render buttons:
- Input-based buttons — The original HTML form submission mechanism, where
<input type="submit" value="Submit">renders a button labeled "Submit". The button's label is stored in thevalueattribute. This pattern is prevalent in server-rendered applications and legacy codebases. - Button elements — The modern semantic HTML approach, where
<button>Submit</button>renders a button labeled "Submit". The button's label is its text content. This pattern supports richer content (icons, spans) inside the button.
By searching input elements first, the selector handles the more constrained and unambiguous pattern before falling back to the more flexible <button> pattern. This ordering reduces false positives because input buttons have a well-defined value attribute, whereas <button> elements may contain nested elements that complicate text matching.