tests for activeTabIndex

Infineon · Jul 24, 2024 · 8bc6bb9 · 8bc6bb9
1 parent a468a2e
commit 8bc6bb9
Showing 1 changed file with 64 additions and 0 deletions.
diff --git a/packages/components/src/components/tabs/tabs.e2e.ts b/packages/components/src/components/tabs/tabs.e2e.ts
@@ -40,4 +40,68 @@ describe('IfxTabs', () => {
     expect(newActiveTabContent).not.toBeNull();
 
   });
+
+  it('should set active tab when activeTabIndex is set', async () => {
+    const page = await newE2EPage();
+    await page.setContent(`
+      <ifx-tabs active-tab-index="2">
+        <ifx-tab header="Tab 1">
+          Tab1Content
+        </ifx-tab>
+        <ifx-tab header="Tab 2">
+          Tab2Content
+        </ifx-tab>
+        <ifx-tab header="Tab 3">
+          Tab3Content
+        </ifx-tab>
+      </ifx-tabs>
+    `);
+
+    const activeTab = await page.find('ifx-tabs >>> .tab-item.active');
+
+    const tabContents = await page.findAll('ifx-tabs >>> .tab-content > div');
+    expect(tabContents.length).toBe(3);
+    expect(await tabContents[0].isVisible()).toBe(false);
+    expect(await tabContents[1].isVisible()).toBe(false);
+    expect(await tabContents[2].isVisible()).toBe(true);
+
+    expect(activeTab.innerText).toBe('Tab 3')    
+  });
+
+
+  it('should set active tab when activeTabIndex is overriden', async () => {
+    const page = await newE2EPage();
+    await page.setContent(`
+      <ifx-tabs active-tab-index="2">
+        <ifx-tab header="Tab 1">
+          Tab1Content
+        </ifx-tab>
+        <ifx-tab header="Tab 2">
+          Tab2Content
+        </ifx-tab>
+        <ifx-tab header="Tab 3">
+          Tab3Content
+        </ifx-tab>
+      </ifx-tabs>
+    `);
+
+    const tabs = await page.find('ifx-tabs');
+
+    await page.$eval("ifx-tabs", elm => {
+      elm.activeTabIndex = 0;
+    });
+
+
+    const activeTab = await page.find('ifx-tabs >>> .tab-item.active');
+
+    const tabContents = await page.findAll('ifx-tabs >>> .tab-content > div');
+    expect(tabContents.length).toBe(3);
+    expect(await tabContents[0].isVisible()).toBe(true);
+    expect(await tabContents[1].isVisible()).toBe(false);
+    expect(await tabContents[2].isVisible()).toBe(false);
+
+    expect(activeTab.innerText).toBe('Tab 1')    
+  });
+
+
 });