[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>

Author: andreymyssak

CHANGELOG.md

@@ -163,6 +163,7 @@ Inspired from [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 - [Monaco editor] Add json worker support ([#3424](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3424))
 - [Multiple DataSource] Allow create and distinguish index pattern with same name but from different datasources ([#3604](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3604))
 - [Multiple DataSource] Integrate multiple datasource with dev tool console ([#3754](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3754))
+- [Navigation] Remove unused tags ([#3964](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3964))
 - [Notifications] Add id to toast api for deduplication ([#3752](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3752))
 - [UI] Add support for comma delimiters in the global filter bar ([#3686](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3686))
 - [UI] Indicate that IE is no longer supported ([#3641](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/3641))

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>
+        </>
       );
     }
   }