{"id":"072cab67c4dc5ba8","repo":"vitest-dev/vitest","slug":"tohavedisplayvalue-currently-supports-only-inpu","errorCode":null,"errorMessage":".toHaveDisplayValue() currently supports only input, textarea or select elements, try with another matcher instead.","messagePattern":"\\.toHaveDisplayValue\\(\\) currently supports only input, textarea or select elements, try with another matcher instead\\.","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/browser/src/client/tester/expect/toHaveDisplayValue.ts","lineNumber":29,"sourceCode":" *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n */\n\nimport type { MatcherResult, MatcherState } from 'vitest'\nimport type { Locator } from '../locators'\nimport { getElementFromUserInput, getMessage, getTag, isInputElement } from './utils'\n\nexport default function toHaveDisplayValue(\n  this: MatcherState,\n  actual: Element | Locator,\n  expectedValue: string | RegExp | Array<string | RegExp>,\n): MatcherResult {\n  const htmlElement = getElementFromUserInput(actual, toHaveDisplayValue, this)\n  const tagName = getTag(htmlElement)\n\n  if (!['SELECT', 'INPUT', 'TEXTAREA'].includes(tagName)) {\n    throw new Error(\n      '.toHaveDisplayValue() currently supports only input, textarea or select elements, try with another matcher instead.',\n    )\n  }\n\n  if (isInputElement(htmlElement) && ['radio', 'checkbox'].includes(htmlElement.type)) {\n    throw new Error(\n      `.toHaveDisplayValue() currently does not support input[type=\"${htmlElement.type}\"], try with another matcher instead.`,\n    )\n  }\n\n  const values = getValues(tagName, htmlElement)\n  const expectedValues = getExpectedValues(expectedValue)\n  const numberOfMatchesWithValues = expectedValues.filter(expected =>\n    values.some(value =>\n      expected instanceof RegExp\n        ? expected.test(value)\n        : this.equals(value, String(expected), this.customTesters),\n    ),","sourceCodeStart":11,"sourceCodeEnd":47,"githubUrl":"https://github.com/vitest-dev/vitest/blob/d568f8ce3739b532d5bf2c1ee1e45e8a8a473d09/packages/browser/src/client/tester/expect/toHaveDisplayValue.ts#L11-L47","documentation":"Thrown by toHaveDisplayValue (packages/browser/src/client/tester/expect/toHaveDisplayValue.ts:26-32) when the resolved element's tag is not SELECT, INPUT, or TEXTAREA. The matcher reads .value or selected options (getValues at line 72-78), which only exist on form controls; any other element (div, button, a, etc.) has no display value, so it errors out with a pointer to use a different matcher.","triggerScenarios":"Calling expect(nonFormEl).toHaveDisplayValue('x') where nonFormEl is a <div>, <span>, <button>, etc. — typically the wrong element was queried, or a query returned a wrapper/container instead of the input itself.","commonSituations":"Querying a label or field container instead of the input; component renders an input only after interaction and the test queries too early; off-by-one selector returning a parent.","solutions":["Re-target the assertion at the actual form control: expect(inputEl).toHaveDisplayValue('x').","Use a more specific locator: page.elementLocator(document.body).getByLabelText('Email') to get the input, not the label.","For non-form elements, switch matcher: toHaveTextContent (toHaveText) or toHaveAttribute('value')."],"exampleFix":"// before — queried the wrapping label/div\nexpect(page.getByText('Email')).toHaveDisplayValue('a@b.com')\n// after — target the input itself\nexpect(page.elementLocator(document.body).getByLabelText('Email')).toHaveDisplayValue('a@b.com')","handlingStrategy":"type-guard","validationCode":"function isFormControl(el: Element): el is HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement {\n  return el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement || el instanceof HTMLSelectElement\n}\nconst el = page.elementLocator(document.body).getByLabelText('Email').element()\nif (isFormControl(el)) {\n  expect(el).toHaveDisplayValue('a@b.com')\n}","typeGuard":"function isFormControl(el: Element): el is HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement {\n  return el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement || el instanceof HTMLSelectElement\n}","tryCatchPattern":null,"preventionTips":["Target the actual form control (input/textarea/select), not its label or wrapper.","Use toHaveText / toHaveAttribute for non-form elements."],"tags":["browser","expect","matcher","tohavedisplayvalue","form","dom"],"analyzedSha":"d568f8ce3739b532d5bf2c1ee1e45e8a8a473d09","analyzedAt":"2026-08-03T20:23:56.861Z","schemaVersion":2}