[CCI] Remove unused tags in the navigation plugin (#3964)

* Remove unused tags in the navigation plugin (#3962)

Signed-off-by: Andrey Myssak <andreymyssak@gmail.com>

* Update CHANGELOG.md (#3962)

Signed-off-by: Andrey Myssak <andreymyssak@gmail.com>

---------

Signed-off-by: Andrey Myssak <andreymyssak@gmail.com>
Signed-off-by: Manasvini B Suryanarayana <manasvis@amazon.com>
Co-authored-by: Manasvini B Suryanarayana <manasvis@amazon.com>
(cherry picked from commit 1ef3e9f)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

Author: github-actions[bot]

src/plugins/navigation/public/top_nav_menu/top_nav_menu.test.tsx

@@ -43,7 +43,6 @@ const dataShim = {
 };
 
 describe('TopNavMenu', () => {
-  const WRAPPER_SELECTOR = '.osdTopNavMenu__wrapper';
   const TOP_NAV_ITEM_SELECTOR = 'TopNavMenuItem';
   const SEARCH_BAR_SELECTOR = 'SearchBar';
   const menuItems: TopNavMenuData[] = [
@@ -66,28 +65,24 @@ describe('TopNavMenu', () => {
 
   it('Should render nothing when no config is provided', () => {
     const component = shallowWithIntl(<TopNavMenu appName={'test'} />);
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(0);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(0);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(0);
   });
 
   it('Should not render menu items when config is empty', () => {
     const component = shallowWithIntl(<TopNavMenu appName={'test'} config={[]} />);
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(0);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(0);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(0);
   });
 
   it('Should render 1 menu item', () => {
     const component = shallowWithIntl(<TopNavMenu appName={'test'} config={[menuItems[0]]} />);
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(1);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(1);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(0);
   });
 
   it('Should render multiple menu items', () => {
     const component = shallowWithIntl(<TopNavMenu appName={'test'} config={menuItems} />);
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(1);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(menuItems.length);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(0);
   });
@@ -96,7 +91,6 @@ describe('TopNavMenu', () => {
     const component = shallowWithIntl(
       <TopNavMenu appName={'test'} showSearchBar={true} data={dataShim as any} />
     );
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(1);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(0);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(1);
   });
@@ -105,7 +99,6 @@ describe('TopNavMenu', () => {
     const component = shallowWithIntl(
       <TopNavMenu appName={'test'} config={menuItems} showSearchBar={true} data={dataShim as any} />
     );
-    expect(component.find(WRAPPER_SELECTOR).length).toBe(1);
     expect(component.find(TOP_NAV_ITEM_SELECTOR).length).toBe(menuItems.length);
     expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(1);
   });
@@ -170,7 +163,6 @@ describe('TopNavMenu', () => {
 
       await refresh();
 
-      expect(component.find(WRAPPER_SELECTOR).length).toBe(1);
       expect(component.find(SEARCH_BAR_SELECTOR).length).toBe(1);
 
       // menu is rendered outside of the component

src/plugins/navigation/public/top_nav_menu/top_nav_menu.tsx

@@ -115,22 +115,21 @@ export function TopNavMenu(props: TopNavMenuProps): ReactElement | null {
   function renderLayout() {
     const { setMenuMountPoint } = props;
     const menuClassName = classNames('osdTopNavMenu', props.className);
-    const wrapperClassName = 'osdTopNavMenu__wrapper';
     if (setMenuMountPoint) {
       return (
         <>
           <MountPointPortal setMountPoint={setMenuMountPoint}>
-            <span className={wrapperClassName}>{renderMenu(menuClassName)}</span>
+            {renderMenu(menuClassName)}
           </MountPointPortal>
-          <span className={wrapperClassName}>{renderSearchBar()}</span>
+          {renderSearchBar()}
         </>
       );
     } else {
       return (
-        <span className={wrapperClassName}>
+        <>
           {renderMenu(menuClassName)}
           {renderSearchBar()}
-        </span>
+        </>
       );
     }
   }