mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
63 lines
2.2 KiB
TypeScript
63 lines
2.2 KiB
TypeScript
/*!
|
|
* @license
|
|
* Copyright Google LLC All Rights Reserved.
|
|
*
|
|
* Use of this source code is governed by an MIT-style license that can be
|
|
* found in the LICENSE file at https://angular.dev/license
|
|
*/
|
|
|
|
import {ComponentFixture, TestBed} from '@angular/core/testing';
|
|
|
|
import {TabGroup} from './tab-group.component';
|
|
|
|
describe('TabGroup', () => {
|
|
let fixture: ComponentFixture<TabGroup>;
|
|
|
|
beforeEach(async () => {
|
|
fixture = TestBed.createComponent(TabGroup);
|
|
await fixture.whenStable();
|
|
});
|
|
|
|
it('should update tabs and tabpanels', async () => {
|
|
const testPanel = document.createElement('div');
|
|
testPanel.textContent = 'panel 1';
|
|
fixture.componentRef.setInput('tabs', [{label: 'tab 1', panel: testPanel}]);
|
|
await fixture.whenStable();
|
|
|
|
const tabs = fixture.nativeElement.querySelectorAll('.docs-tab');
|
|
const tabpanels = fixture.nativeElement.querySelectorAll('.docs-tab-panel');
|
|
|
|
expect(tabs.length).toBe(1);
|
|
expect(tabpanels.length).toBe(1);
|
|
expect(tabs[0].textContent.trim()).toBe('tab 1');
|
|
expect(tabpanels[0].textContent.trim()).toBe('panel 1');
|
|
});
|
|
|
|
it('should generate unique ids for tabs and tabpanels', async () => {
|
|
const testPanel1 = document.createElement('div');
|
|
testPanel1.textContent = 'panel 1';
|
|
const testPanel2 = document.createElement('div');
|
|
testPanel2.textContent = 'panel 2';
|
|
fixture.componentRef.setInput('tabs', [
|
|
{label: 'tab 1', panel: testPanel1},
|
|
{label: 'tab 2', panel: testPanel2},
|
|
]);
|
|
await fixture.whenStable();
|
|
|
|
const tabs = fixture.nativeElement.querySelectorAll('.docs-tab');
|
|
const tabpanels = fixture.nativeElement.querySelectorAll('.docs-tab-panel');
|
|
expect(tabs[0].id).not.toBe(tabs[1].id);
|
|
expect(tabpanels[0].id).not.toBe(tabpanels[1].id);
|
|
|
|
const fixture2 = TestBed.createComponent(TabGroup);
|
|
fixture2.componentRef.setInput('tabs', [
|
|
{label: 'tab 1', panel: testPanel1},
|
|
{label: 'tab 2', panel: testPanel2},
|
|
]);
|
|
await fixture2.whenStable();
|
|
const tabs2 = fixture2.nativeElement.querySelectorAll('.docs-tab');
|
|
const tabpanels2 = fixture2.nativeElement.querySelectorAll('.docs-tab-panel');
|
|
expect(tabs[0].id).not.toBe(tabs2[0].id);
|
|
expect(tabpanels[0].id).not.toBe(tabpanels2[0].id);
|
|
});
|
|
});
|