angular/components · error
`getStartThumb` is only applicable for range sliders. Did yo
Error message
`getStartThumb` is only applicable for range sliders. Did you mean to use `getEndThumb`?
What it means
The slider test harness's `getStartThumb` only applies to range sliders; calling it on a single-value slider throws this error and suggests `getEndThumb`. Start/end thumbs exist only when the slider has start+end inputs; a plain slider exposes just one thumb.
Source
Thrown at src/material/slider/testing/slider-harness.ts:43
* @return a `HarnessPredicate` configured with the given options.
*/
static with<T extends MatSliderHarness>(
this: ComponentHarnessConstructor<T>,
options: SliderHarnessFilters = {},
): HarnessPredicate<T> {
return new HarnessPredicate(this, options)
.addOption('isRange', options.isRange, async (harness, value) => {
return (await harness.isRange()) === value;
})
.addOption('disabled', options.disabled, async (harness, disabled) => {
return (await harness.isDisabled()) === disabled;
});
}
/** Gets the start thumb of the slider (only applicable for range sliders). */
async getStartThumb(): Promise<MatSliderThumbHarness> {
if (!(await this.isRange())) {
throw Error(
'`getStartThumb` is only applicable for range sliders. ' +
'Did you mean to use `getEndThumb`?',
);
}
return this.locatorFor(MatSliderThumbHarness.with({position: ThumbPosition.START}))();
}
/** Gets the thumb (for single point sliders), or the end thumb (for range sliders). */
async getEndThumb(): Promise<MatSliderThumbHarness> {
return this.locatorFor(MatSliderThumbHarness.with({position: ThumbPosition.END}))();
}
/** Gets whether the slider is a range slider. */
async isRange(): Promise<boolean> {
return await (await this.host()).hasClass('mdc-slider--range');
}
/** Gets whether the slider is disabled. */View on GitHub (pinned to 0411926e7d)
Solutions
- Use `await harness.getEndThumb()` (or `getThumb()`) to get the single thumb of a non-range slider.
- Guard with `if (await harness.isRange())` before calling `getStartThumb`.
- Update the fixture template to a range slider (start+end inputs) if a start thumb is genuinely needed.
Example fix
// before const thumb = await sliderHarness.getStartThumb(); // after const thumb = (await sliderHarness.isRange()) ? await sliderHarness.getStartThumb() : await sliderHarness.getEndThumb();
Defensive patterns
Strategy: type-guard
Validate before calling
const isRange = await sliderHarness.isRange();
if (!isRange) {
const thumb = await sliderHarness.getEndThumb();
} else {
const start = await sliderHarness.getStartThumb();
} Type guard
async function hasStartThumb(h: MatSliderHarness): Promise<boolean> {
return h.isRange();
} Try / catch
try {
const thumb = await sliderHarness.getStartThumb();
} catch (e) {
if ((e as Error).message.includes('only applicable for range sliders')) {
return sliderHarness.getEndThumb();
}
throw e;
} Prevention
- Check `isRange()` before using start/end thumb APIs.
- Keep harness tests in sync when switching a slider between single and range modes.
When it happens
Trigger: `await harness.getStartThumb()` on a `MatSliderHarness` whose DOM contains a single `matSliderThumb` input (not a range).
Common situations: Reusing a test written for a range slider against a single-value slider; switching a component template from range to single thumb without updating tests; assuming start thumb always exists.
Related errors
- Select does not have options matching the specified filter
- Unable to retrieve options for autocomplete. Autocomplete pa
- Unable to retrieve option groups for autocomplete. Autocompl
- Cannot begin editing a chip that is not editable.
- Could not find a mat-option matching ${JSON.stringify(filter
AI-assisted analysis of angular/components@0411926e7d (2026-08-31).
Data as JSON: /api/errors/51ce5a41e51a6187.
Report an issue: GitHub.