@triptease/tt-navbar 0.0.34 → 0.0.35

package/dist/web/urlMappings.js

@@ -1,5 +1,5 @@
 /**
-* @triptease/tt-navbar v0.0.34
+* @triptease/tt-navbar v0.0.35
 */
 
 // src/urlMappings.ts

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent tt-navbar following open-wc recommendations",
   "license": "MIT",
   "author": "tt-navbar",
-  "version": "0.0.34",
+  "version": "0.0.35",
   "type": "module",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",

package/src/TtNavbar.ts

@@ -67,14 +67,19 @@ export class TtNavbar extends LitElement {
   }
 
   public connectedCallback() {
-
+    // Listen for browser back/forward navigation
     window.addEventListener('popstate', this.setActiveState);
+
+    // Listen for Tetris programmatic navigation
+    window.addEventListener('tetris:navigate', this.setActiveState);
+
     super.connectedCallback();
   }
 
   public disconnectedCallback() {
-
     window.removeEventListener('popstate', this.setActiveState);
+    window.removeEventListener('tetris:navigate', this.setActiveState);
+
     super.disconnectedCallback();
   }
 

package/test/tt-navbar.test.ts

@@ -359,4 +359,25 @@ describe('TtNavbar', () => {
     expect(marketInsightsDetails).to.exist;
     expect(marketInsightsDetails.open).to.be.true;
   })
+
+  it('should set the active route when receives `tetris:navigate` event', async () => {
+    const navbar = await fixture<TtNavbar>(
+      `<tt-navbar client-key=${CLIENT_KEY}></tt-navbar>`
+    );
+    // eslint-disable-next-line no-restricted-globals
+    history.pushState({}, '', `/account/billing-management/${CLIENT_KEY}`)
+
+
+    // Dispatch the event to change to Channels route
+    const navigateEvent = new CustomEvent('tetris:navigate', {
+    });
+    window.dispatchEvent(navigateEvent);
+
+    await elementUpdated(navbar);
+    const anchor = navbar.shadowRoot!.querySelector('a[aria-current="page"]');
+
+    expect(anchor).to.exist;
+    expect(anchor!.textContent).to.include('Booking reconciliation');
+
+  })
 });