{"record":{"id":"fa45c3375da66f28","repo":"angular/components","slug":"could-not-find-a-mat-option-matching-json-string","errorCode":null,"errorMessage":"Could not find a mat-option matching ${JSON.stringify(filters)}","messagePattern":"Could not find a mat-option matching (.+?)","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/material/autocomplete/testing/autocomplete-harness.ts","lineNumber":122,"sourceCode":"      throw new Error(\n        'Unable to retrieve option groups for autocomplete. Autocomplete panel is closed.',\n      );\n    }\n\n    return this._documentRootLocator.locatorForAll(\n      MatOptgroupHarness.with({\n        ...(filters || {}),\n        ancestor: await this._getPanelSelector(),\n      } as OptgroupHarnessFilters),\n    )();\n  }\n\n  /** Selects the first option matching the given filters. */\n  async selectOption(filters: OptionHarnessFilters): Promise<void> {\n    await this.focus(); // Focus the input to make sure the autocomplete panel is shown.\n    const options = await this.getOptions(filters);\n    if (!options.length) {\n      throw Error(`Could not find a mat-option matching ${JSON.stringify(filters)}`);\n    }\n    await options[0].click();\n  }\n\n  /** Whether the autocomplete is open. */\n  async isOpen(): Promise<boolean> {\n    const panel = await this._getPanel();\n    return !!panel && (await panel.hasClass(`mat-mdc-autocomplete-visible`));\n  }\n\n  /** Gets the panel associated with this autocomplete trigger. */\n  private async _getPanel(): Promise<TestElement | null> {\n    // Technically this is static, but it needs to be in a\n    // function, because the autocomplete's panel ID can changed.\n    return this._documentRootLocator.locatorForOptional(await this._getPanelSelector())();\n  }\n\n  /** Gets the selector that can be used to find the autocomplete trigger's panel. */","sourceCodeStart":104,"sourceCodeEnd":140,"githubUrl":"https://github.com/angular/components/blob/0411926e7d8ae06b32236ec1048a888cfad5abf2/src/material/autocomplete/testing/autocomplete-harness.ts#L104-L140","documentation":"The MatAutocompleteHarness.selectOption test helper focuses the input, queries matching options via getOptions(filters), and throws this error when no rendered mat-option matches the given filter object. It is a harness assertion that the expected option text/selector existed at selection time.","triggerScenarios":"Calling harness.selectOption({text: '...'}) when no option's text matches (typo, different casing/whitespace, translated strings), or the panel never rendered options because the input's value/filter didn't produce results.","commonSituations":"i18n changing option labels after tests were written, options rendered only after async data loads without proper waiting, filter text containing extra whitespace or unicode variants, autocomplete bound to a filtered list that excludes the sought value.","solutions":["Print available options first (getOptions({}) ) and match exact rendered text.","Await async data: use harness flush/waitForRequestsInFlight-free patterns and ensure the panel options loaded before selectOption.","Normalize filter text to the rendered value (trim, correct locale).","If options load from a server, use fakeAsync/flush or intercept the request so results exist before selection."],"exampleFix":"// before\nawait harness.selectOption({text: '  New York '}); // whitespace mismatch\n// after\nawait harness.focus();\nconst opts = await harness.getOptions({});\nconsole.log(opts.map(o => o.getText())); // see actual text\nawait harness.selectOption({text: 'New York'});","handlingStrategy":"try-catch","validationCode":"const options = await harness.getOptions({});\nconst texts = await Promise.all(options.map(o => o.getText()));\nif (!texts.some(t => t.trim() === expectedText)) {\n  throw new Error('Available options: ' + texts.join(', '));\n}","typeGuard":null,"tryCatchPattern":"try {\n  await harness.selectOption({text: 'New York'});\n} catch (e) {\n  if (e instanceof Error && e.message.includes('Could not find a mat-option')) {\n    const all = await harness.getOptions({});\n    fail('Option missing. Available: ' + JSON.stringify(await Promise.all(all.map(o => o.getText()))));\n  } else throw e;\n}","preventionTips":["Log rendered option texts before filtering to catch i18n/whitespace drift","Ensure async option data is loaded (fakeAsync/flush, or await pending requests) before selecting","Trim/normalize filter text to match rendered labels exactly","Add harness-based smoke tests that fail with diagnostics when options disappear"],"tags":["angular","testing","test-harness","autocomplete"],"backgroundTag":"harness-option-not-found","analyzedSha":"0411926e7d8ae06b32236ec1048a888cfad5abf2","analyzedAt":"2026-08-31T11:58:23.400Z","schemaVersion":2},"datasetVersion":"2026-08-31T14:17:45.589Z"}