grafana/k6 · error

selecting options

Error message

selecting options: %w

What it means

Thrown by the k6 browser module's ElementHandle.selectOption(). It wraps any failure of the selectOption action: the timeout expiring, the wrapped element being detached, or the injected script returning a DOM error string that errorFromDOMError translates, most commonly 'element is not a <select> element' (error:notselect).

Solutions

  1. Verify the target is a real native <select> element: check (await el.getProperty('tagName')).jsonValue() === 'SELECT'; for custom dropdowns use click() + click() on options instead.
  2. Re-query the element handle right before the call so it is attached: el = await page.waitForSelector('select#country', { state: 'visible' }).
  3. Increase the timeout: el.selectOption(['de'], { timeout: '60s' }).
  4. Pass { force: true } to skip actionability checks if the element is present but flaky about visibility/stability.

Example fix

// before
const dropdown = await page.$('.my-dropdown'); // a styled <div>, not a <select>
await dropdown.selectOption(['de']); // error: element is not a <select> element

// after
const dropdown = await page.waitForSelector('select#country');
await dropdown.selectOption(['de'], { timeout: '30s' });
Defensive patterns

Strategy: validation

Validate before calling

const tag = await el.getProperty('tagName').then(p => p.jsonValue());
if (tag !== 'SELECT') {
  throw new Error(`selectOption requires a <select>, got <${tag}>`);
}
await el.selectOption(['de'], { timeout: '30s' });

Type guard

async function isNativeSelect(el) {
  if (!el) return false;
  const tag = await el.getProperty('tagName').then(p => p.jsonValue()).catch(() => null);
  return tag === 'SELECT';
}

Try / catch

try {
  await el.selectOption(['de'], { timeout: '30s' });
} catch (e) {
  if (String(e).includes('not a <select>')) { /* drive custom dropdown via clicks */ }
  else { throw e; }
}

Prevention

When it happens

Trigger: Calling el.selectOption(['opt1']) on anything other than a <select> element (a div styled as a dropdown, a custom combobox); on a <select> that is re-rendered and detached before the action runs; on a detached/stale handle; with a timeout shorter than the page's render time.

Common situations: Modern component libraries (MUI, Ant Design) that render fake dropdowns with <ul><li> instead of native <select>; React re-rendering the select and invalidating the handle; option value mismatch is NOT this error (that silently selects nothing) — this error is about the target node itself.

Related errors


AI-assisted analysis of grafana/k6@3fcf5388d7 (2026-08-18). Data as JSON: /api/errors/bbb6eeaa26ded94f. Report an issue: GitHub.

Appendix: source

Thrown at internal/js/modules/k6/browser/common/element_handle.go:1429

		return fmt.Errorf("scrolling element into view: %w", err)
	}

	applySlowMo(h.ctx)

	return nil
}

// SelectOption selects the options matching the given values.
func (h *ElementHandle) SelectOption(values []any, opts *ElementHandleBaseOptions) ([]string, error) {
	selectOption := func(apiCtx context.Context, handle *ElementHandle) (any, error) {
		return handle.selectOption(apiCtx, values)
	}
	selectOptionAction := h.newAction(
		[]string{}, selectOption, opts.Force, withRetry, opts.NoWaitAfter, opts.Timeout,
	)
	selectedOptions, err := call(h.ctx, selectOptionAction, opts.Timeout)
	if err != nil {
		return nil, fmt.Errorf("selecting options: %w", err)
	}
	var returnVal []string
	if err := convert(selectedOptions, &returnVal); err != nil {
		return nil, fmt.Errorf("unpacking selected options: %w", err)
	}

	applySlowMo(h.ctx)

	return returnVal, nil
}

// SelectText selects the text of the element.
func (h *ElementHandle) SelectText(opts *ElementHandleBaseOptions) error {
	selectText := func(apiCtx context.Context, handle *ElementHandle) (any, error) {
		return nil, handle.selectText(apiCtx)
	}
	selectTextAction := h.newAction(
		[]string{}, selectText, opts.Force, withRetry, opts.NoWaitAfter, opts.Timeout,

View on GitHub (pinned to 3fcf5388d7)