Implementation:Getgauge Taiko CheckBox Element
| Knowledge Sources | |
|---|---|
| Domains | Browser_Automation, Form_Interaction |
| Last Updated | 2026-02-12 03:00 GMT |
Overview
Concrete tool for interacting with HTML checkbox input elements provided by the Taiko browser automation library.
Description
The `CheckBox` class extends the base `Element` class to represent `<input type="checkbox">` elements in the DOM. It provides methods to query whether a checkbox is currently checked, to programmatically check it, and to uncheck it. State changes are performed via the private helper function `setChecked(value)`, which uses the native value setter (registered through the parent class) to set the `checked` property and then dispatches `change`, `input`, and `click` events in sequence to simulate genuine user interaction. All mutation methods are wrapped in `doActionAwaitingNavigation` to handle any page navigation that might be triggered by the state change.
Usage
Use this class when you need to automate checkbox interactions such as toggling terms-of-service agreements, feature flags, or multi-select filter panels. Instances of `CheckBox` are not created directly by library consumers. Instead, calling the Taiko API function `checkBox()` returns an `ElementWrapper` that internally constructs `CheckBox` instances via the static `CheckBox.from(element, description)` factory method.
Code Reference
Source Location
- Repository: Getgauge_Taiko
- File: lib/elements/checkBox.js
- Lines: 1-79
Signature
class CheckBox extends Element {
async isChecked() { ... }
async check() { ... }
async uncheck() { ... }
static from(element, description) { ... }
}
// Private helper (module-scoped)
function setChecked(value) {
// Sets this.checked via native setter, dispatches change/input/click events
}
Import
// Internal class, accessed through Taiko API
const { checkBox } = require('taiko');
// Returns ElementWrapper that creates CheckBox instances internally
I/O Contract
Inputs
| Name | Type | Required | Description |
|---|---|---|---|
| element | Element | Yes (for `from`) | Base Element instance to convert into a CheckBox |
| description | string | Yes (for `from`) | Human-readable description used in event logging |
Outputs
| Name | Type | Description |
|---|---|---|
| isChecked() | Promise<boolean> | Returns `true` if the checkbox is currently checked, `false` otherwise. Emits a success event describing the state. |
| check() | Promise<void> | Sets the checkbox to checked state. Registers native value setter, highlights element in headful mode, dispatches change/input/click events. Awaits navigation. |
| uncheck() | Promise<void> | Sets the checkbox to unchecked state. Highlights element in headful mode, dispatches change/input/click events. Awaits navigation. |
| from() | CheckBox | Static factory that constructs a new CheckBox from an existing Element instance. |
Usage Examples
Basic Usage
const { openBrowser, goto, checkBox, closeBrowser } = require('taiko');
(async () => {
await openBrowser();
await goto('https://example.com/form');
// Check the "Accept Terms" checkbox
await checkBox('Accept Terms').check();
// Verify it is checked
const checked = await checkBox('Accept Terms').isChecked();
console.log('Is checked:', checked); // true
// Uncheck the checkbox
await checkBox('Accept Terms').uncheck();
await closeBrowser();
})();