spectrum-web-components icon indicating copy to clipboard operation
spectrum-web-components copied to clipboard

[Bug]: TypeError: Cannot read properties of undefined (reading 'selectionRoot') in Menu.handlePointerBasedSelection

Open spdev3000 opened this issue 1 year ago • 3 comments

Code of conduct

  • [X] I agree to follow this project's code of conduct.

Impacted component(s)

Menu

Expected behavior

When using non-menu-item components as submenu clicking those components shouldn't trigger TypeError

Actual behavior

Using arbitrary components as submenu items and clicking them produces the TypeError: Cannot read properties of undefined (reading 'selectionRoot') in Menu.handlePointerBasedSelection

Screenshots

Screenshot 2024-05-15 at 12 16 48

What browsers are you seeing the problem in?

No response

How can we reproduce this issue?

  1. Go to '...'
  2. Click on '....'
  3. Scroll to '....'
  4. Check console
  5. See error

Sample code that illustrates the problem

This might be fixed by adding ? after menuData, see:

 target?.menuData?.selectionRoot === this &&

in https://github.com/adobe/spectrum-web-components/blob/d38bf04fc204ea47c1b60874bd48536d961cb9c1/packages/menu/src/Menu.ts#L391

Logs taken while reproducing problem

No response

spdev3000 avatar May 15 '24 10:05 spdev3000

I'm surprised that without a Menu Item that this code is finding a trigger. Can you share what the trigger is so we can understand how it is both el.getAttribute('role') === this.childRole and el.menuData === undefined?

Westbrook avatar May 21 '24 17:05 Westbrook

  handlePointerBasedSelection(event) {
    const path = event.composedPath();
    const target = path.find((el) => {
      if (!(el instanceof Element)) {
        return false;
      }
      console.log("MENU SWC: ", el);
      return el.getAttribute("role") === this.childRole;
    });

prints out:

<li class="spectrum-Menu-item" tabindex="0" role="menuitem"><span class="spectrum-Menu-itemLabel"><span>Edit version info</span></span></li>

and leads to:

    TypeError: Cannot read properties of undefined (reading 'selectionRoot')
    at Menu.handlePointerBasedSelection (chunk-SCU35XXF.js?v=c2a8ef54:347:59)
    at Menu.handlePointerup (chunk-SCU35XXF.js?v=c2a8ef54:321:10)
    at Menu.nrWrapper (chunk-DTJESBZO.js?v=c2a8ef54:71:21)

spdev3000 avatar May 22 '24 13:05 spdev3000

We can add this, but we should make sure we add tests for this case.

najikahalsema avatar May 22 '24 14:05 najikahalsema