{"record":{"id":"2dad6ff80374166e","repo":"vitest-dev/vitest","slug":"input-with-type-checkbox-or-type-radio-cannot-be-u","errorCode":null,"errorMessage":"input with type=checkbox or type=radio cannot be used with .toHaveValue(). Use .toBeChecked() for type=checkbox or .toHaveFormValues() instead","messagePattern":"input with type=checkbox or type=radio cannot be used with \\.toHaveValue\\(\\)\\. Use \\.toBeChecked\\(\\) for type=checkbox or \\.toHaveFormValues\\(\\) instead","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/browser/src/client/tester/expect/toHaveValue.ts","lineNumber":31,"sourceCode":" * copies or substantial portions of the Software.\n */\n\nimport type { MatcherResult, MatcherState } from 'vitest'\nimport type { Locator } from '../locators'\nimport { arrayAsSetComparison, getElementFromUserInput, getMessage, getSingleElementValue, isInputElement } from './utils'\n\nexport default function toHaveValue(\n  this: MatcherState,\n  actual: Element | Locator,\n  expectedValue?: string,\n): MatcherResult {\n  const htmlElement = getElementFromUserInput(actual, toHaveValue, this)\n\n  if (\n    isInputElement(htmlElement)\n    && ['checkbox', 'radio'].includes(htmlElement.type)\n  ) {\n    throw new Error(\n      'input with type=checkbox or type=radio cannot be used with .toHaveValue(). Use .toBeChecked() for type=checkbox or .toHaveFormValues() instead',\n    )\n  }\n\n  const receivedValue = getSingleElementValue(htmlElement)\n  const expectsValue = expectedValue !== undefined\n\n  let expectedTypedValue = expectedValue\n  let receivedTypedValue = receivedValue\n  // eslint-disable-next-line eqeqeq\n  if (expectedValue == receivedValue && expectedValue !== receivedValue) {\n    expectedTypedValue = `${expectedValue} (${typeof expectedValue})`\n    receivedTypedValue = `${receivedValue} (${typeof receivedValue})`\n  }\n\n  return {\n    pass: expectsValue\n      ? this.equals(receivedValue, expectedValue, [arrayAsSetComparison, ...this.customTesters])","sourceCodeStart":13,"sourceCodeEnd":49,"githubUrl":"https://github.com/vitest-dev/vitest/blob/1fa9837ec26533512fdcad8baebf249771bd340a/packages/browser/src/client/tester/expect/toHaveValue.ts#L13-L49","documentation":"Thrown by `toHaveValue` when the received element is an `<input>` whose `type` is `checkbox` or `radio`. Those input types do not have a single scalar `.value` semantics the way text inputs do — their meaningful state is `checked`, and radio/checkbox groups aggregate across multiple same-named elements. The matcher deliberately refuses to run and points you at the correct matchers.","triggerScenarios":"Calling `expect(checkboxEl).toHaveValue('on')` or `expect(radioEl).toHaveValue('yes')` where the element is `type=\"checkbox\"` or `type=\"radio\"`. The guard at toHaveValue.ts:27-30 checks `isInputElement(htmlElement) && ['checkbox','radio'].includes(htmlElement.type)`.","commonSituations":"Treating a checkbox like a text field; generated/label-based locators that resolve to a hidden checkbox input; porting tests from another library whose `toHaveValue` accepted booleans for checkboxes.","solutions":["For checkboxes, use `expect(el).toBeChecked()` (or `.not.toBeChecked()`).","For radio groups or multiple checkboxes sharing a `name`, use `expect(form).toHaveFormValues({ groupName: 'value' })`.","If you genuinely need the raw `value` attribute, read `el.value` directly and assert with `toBe`."],"exampleFix":"// before\nexpect(checkboxEl).toHaveValue('on')\n\n// after\nexpect(checkboxEl).toBeChecked()\n// or, for a radio group:\nexpect(form).toHaveFormValues({ role: 'admin' })","handlingStrategy":"validation","validationCode":"const tag = element.tagName\nconst type = (element as HTMLInputElement).type\nif (tag === 'INPUT' && (type === 'checkbox' || type === 'radio')) {\n  // use the correct matcher instead\n  expect(element).toBeChecked()\n} else {\n  expect(element).toHaveValue(value)\n}","typeGuard":"function isCheckableInput(el: Element): el is HTMLInputElement {\n  return el.tagName === 'INPUT'\n    && ['checkbox', 'radio'].includes((el as HTMLInputElement).type)\n}","tryCatchPattern":null,"preventionTips":["For checkboxes use `.toBeChecked()`; for radio/checkbox groups use `.toHaveFormValues()`.","Check the input `type` before choosing the matcher.","Read `.value` directly only when you need the raw attribute."],"tags":["matcher","browser","form","input"],"backgroundTag":null,"analyzedSha":"1fa9837ec26533512fdcad8baebf249771bd340a","analyzedAt":"2026-08-11T16:11:39.638Z","contentChangedAt":null,"schemaVersion":2},"datasetVersion":"2026-09-23T08:17:48.524Z"}