IdsToolbar: Toolbar in IDSHeader with an IDSAppMenu will misposition the overflow menu

[Sovia]

Describe the bug When a page has an app menu, and a toolbar in an IdsHeader, the more actions menu will be mispositioned. Also, a submenu in the more actions menu will not display when hovered over.

To Reproduce

Steps to reproduce the behavior:

1. Unzip in-header.zip into src/app/components/ids-toolbar/demos in the enterprise-wc-examples/angular-ids-wc. Add the new InHeaderComponent to the two ids-toolbar.module.ts files.
2. Navigate to /ids-toolbar/inheader
3. Click the three line button on the left of the toolbar title. This should open up the application menu
4. Click on the more actions button on the right side of the toolbar.
5. See how the popup menu is moved far to the right and causes a horizontal scrollbar to appear.
6. Hover over the More Options submenu in the more actions menu, and see that no sub menu appears.

Expected behavior The menu is correctly positioned, and doesn't cause a horizontal scrollbar to appear. Submenus should also appear correctly.

Version

• ids-enterprise: 17.0.9

Screenshots

This is the error in the browser console when the submenu is hovered over:

Platform

• Infor Application/Team Name: Landmark
• Device: (if applicable) All

Additional context Should also probably look at if an action has a very long name. It seems to just expand the popup menu. Should it ellipsis off or wrap the string?

[tmcconechy]

Just wondering if you would be replacing App Menu with Module Nav (or if we need to check both components for this case)

[Sovia]

We are introducing the module nav as our version three menu, so probably good to check both cases. Thanks!

[tmcconechy]

@clayinfor consider this example https://main.wc.design.infor.com/ids-app-menu/with-masthead.html i made it might help make this example work and you can build on it