angular/components · error

Could not find item matching ${JSON.stringify(itemFilter)}

Error message

Could not find item matching ${JSON.stringify(itemFilter)}

What it means

The MatMenu harness `clickItem` helper throws when the harness query for menu items returns no matches. It means no `MatMenuItemHarness` matching the supplied `itemFilter` (text, icon, etc., excluding `ancestor`) exists in the menu at click time. The library throws early instead of clicking undefined.

Source

Thrown at src/material/menu/testing/menu-harness.ts:221

    return (await this.host()).matchesSelector(MatMenuHarness.hostSelector);
  }

  /** Gets the submenu associated with this menu item, or null if none. */
  async getSubmenu(): Promise<MatMenuHarness | null> {
    if (await this.hasSubmenu()) {
      return new MatMenuHarness(this.locatorFactory);
    }
    return null;
  }
}

export async function clickItemImplementation(
  items: MatMenuItemHarness[],
  itemFilter: Omit<MenuItemHarnessFilters, 'ancestor'>,
  subItemFilters: Omit<MenuItemHarnessFilters, 'ancestor'>[],
): Promise<void> {
  if (!items.length) {
    throw Error(`Could not find item matching ${JSON.stringify(itemFilter)}`);
  }

  if (!subItemFilters.length) {
    return await items[0].click();
  }

  const menu = await items[0].getSubmenu();
  if (!menu) {
    throw Error(`Item matching ${JSON.stringify(itemFilter)} does not have a submenu`);
  }
  return menu.clickItem(...(subItemFilters as [Omit<MenuItemHarnessFilters, 'ancestor'>]));
}

View on GitHub (pinned to 0411926e7d)

Solutions

  1. Open the menu (via trigger harness `click()`/`hover()`) before calling clickItem
  2. Log `await menuHarness.getItems()` to see the actual items and fix the filter
  3. Correct the `text`/`icon`/`selector` filter to match an existing item exactly

Example fix

// before
await menuHarness.clickItem({text: 'svae'});
// after
await menuHarness.clickItem({text: 'Save'});
Defensive patterns

Strategy: validation

Validate before calling

const items = await menuHarness.getItems();
if (!items.length) {
  throw new Error(`Menu empty before clickItem; check filters/menu open state`);
}

Type guard

function hasItems<T>(arr: T[] | undefined | null): arr is T[] { return Array.isArray(arr) && arr.length > 0; }

Try / catch

try {
  await menuHarness.clickItem({text: 'Save'});
} catch (e) {
  if (String(e?.message).startsWith('Could not find item matching')) {
    fail('Menu item filter matched nothing: open the menu and verify item text');
  }
  throw e;
}

Prevention

When it happens

Trigger: Calling `await menuHarness.clickItem({text: 'Save'})` (or the exported `clickItemImplementation`) when no menu item has that text, the menu was never opened, or the filter (e.g. regex or icon) does not match any rendered item.

Common situations: Typos or case differences in item text; forgetting to call `open()`/hover on the trigger so items are not rendered; test data changed so the menu label no longer matches; using `text` with regex when plain text is expected.

Related errors


AI-assisted analysis of angular/components@0411926e7d (2026-08-31). Data as JSON: /api/errors/c3143f53cf1722cf. Report an issue: GitHub.