MWPW-160014 : Search container for Standalone Gnav on devices (#3049)

search container on gnav for devices Co-authored-by: Snehal Sonawane <[email protected]>
adobecom · Oct 21, 2024 · 332c3a5 · 332c3a5
1 parent d9962d7
commit 332c3a5
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 2 deletions.
diff --git a/libs/blocks/global-navigation/global-navigation.js b/libs/blocks/global-navigation/global-navigation.js
@@ -355,6 +355,7 @@ class Gnav {
           ${this.decorateBrand()}
         </div>
         ${this.elements.navWrapper}
+        ${getConfig().searchEnabled === 'on' ? toFragment`<div class="feds-client-search"></div>` : ''}
         ${this.useUniversalNav ? this.blocks.universalNav : ''}
         ${(!this.useUniversalNav && this.blocks.profile.rawElem) ? this.blocks.profile.decoratedElem : ''}
         ${this.decorateLogo()}
@@ -839,7 +840,6 @@ class Gnav {
         ${isDesktop.matches ? '' : this.decorateSearch()}
         ${this.elements.mainNav}
         ${isDesktop.matches ? this.decorateSearch() : ''}
-        ${getConfig().searchEnabled === 'on' ? toFragment`<div class="feds-client-search"></div>` : ''}
       </div>
     `;
 

diff --git a/libs/navigation/navigation.css b/libs/navigation/navigation.css
@@ -42,3 +42,7 @@ header.global-navigation, header.global-navigation.feds--dark {
     padding: 0 15px;
   }
 }
+
+.feds-client-search {
+  margin-left: auto;
+}
diff --git a/test/blocks/global-navigation/global-navigation.test.js b/test/blocks/global-navigation/global-navigation.test.js
@@ -661,7 +661,7 @@ describe('global navigation', () => {
   describe('Client search feature in global navigation', () => {
     it('should append the feds-client-search div when search is enabled', async () => {
       await createFullGlobalNavigation({ customConfig: { searchEnabled: 'on' } });
-      expect(document.querySelector(selectors.topNavWrapper).classList.contains('feds-client-search')).to.exist;
+      expect(document.querySelector(selectors.topNav).classList.contains('feds-client-search')).to.exist;
     });
   });
 

diff --git a/test/blocks/global-navigation/test-utilities.js b/test/blocks/global-navigation/test-utilities.js
@@ -38,6 +38,7 @@ export const selectors = {
   promo: '.feds-promo',
   promoImage: '.feds-promo-image',
   topNavWrapper: '.feds-topnav-wrapper',
+  topNav: '.feds-topnav',
   breadcrumbsWrapper: '.feds-breadcrumbs-wrapper',
   mainNav: '.feds-nav',
   imsSignIn: '.feds-signIn',