Principle:Getgauge Taiko Radio Button Selection
| Knowledge Sources | |
|---|---|
| Domains | Browser_Automation, Form_Interaction |
| Last Updated | 2026-02-12 00:00 GMT |
Overview
Technique for selecting radio button options within a radio group in browser automation.
Description
Radio button selection involves finding the target radio input by label or attributes and selecting it. Radio buttons are grouped by their name attribute, and within a radio group, selecting one option automatically deselects all others. This mutual exclusivity is a core HTML behavior that distinguishes radio buttons from checkboxes.
Taiko provides select(), deselect(), and isSelected() operations for radio button interaction. The select() operation clicks the target radio button to select it. The deselect() operation clicks a selected radio button to deselect it (though this is rarely used in practice, as standard HTML radio buttons cannot be individually deselected by clicking -- this is primarily useful for custom radio implementations). The isSelected() operation returns the current selection state for assertion purposes.
Radio buttons are located by their associated label text, following the same label-matching logic used for checkboxes. This provides a natural, readable API: radioButton('Male').select() reads like a description of the user action.
Usage
Use radio button selection when automating:
- Single-choice questions -- Select one option from a group of mutually exclusive choices (e.g., gender, payment method, shipping speed).
- Survey forms -- Automate responses to radio-button-based survey questions.
- Configuration wizards -- Choose options in step-by-step configuration flows.
- Form verification -- Assert that the correct radio button is pre-selected after loading form data.
- A/B test scenarios -- Select different radio options to test different application paths.
Theoretical Basis
Radio button selection operates on these principles:
- Element location -- Find the
<input type="radio">element by its associated label text,id,name,value, or other attributes. - Group awareness -- Radio buttons with the same
nameattribute form a group. Selecting one member of the group automatically deselects the previously selected member. This is handled natively by the browser when a click event is dispatched. - Selection via click -- The
select()operation performs a click on the radio button element, which triggers the browser's native selection behavior and dispatchesclick,input, andchangeevents. - State inspection -- The
isSelected()operation reads thecheckedproperty of the radio element to determine whether it is currently the selected option in its group.
The event dispatching during selection is important because many web applications react to radio button changes:
- Showing or hiding conditional form sections based on the selected option.
- Updating price calculations or summaries.
- Triggering AJAX requests to load additional data based on the selection.