diff --git a/tabs/internal/tabs.ts b/tabs/internal/tabs.ts index 1e9ad50ce..8fa166689 100644 --- a/tabs/internal/tabs.ts +++ b/tabs/internal/tabs.ts @@ -109,26 +109,6 @@ export class Tabs extends LitElement { @queryAssignedElements({flatten: true}) private readonly maybeTabs!: HTMLElement[]; - /** - * TODO(b/293476210): remove - * @deprecated use `activeTabIndex` - */ - @property({type: Number}) - get selected() { - return this.activeTabIndex; - } - set selected(index: number) { - this.activeTabIndex = index; - } - - /** - * TODO(b/293476210): remove - * @deprecated use `activeTab` - */ - get selectedItem() { - return this.activeTab; - } - private get focusedTab() { return this.tabs.find(tab => tab.matches(':focus-within')); } diff --git a/tabs/tabs_test.ts b/tabs/tabs_test.ts index c368744e0..9f28f1652 100644 --- a/tabs/tabs_test.ts +++ b/tabs/tabs_test.ts @@ -15,13 +15,13 @@ import {MdSecondaryTab} from './secondary-tab.js'; import {MdTabs} from './tabs.js'; interface TabsTestProps { - selected?: number; + activeTabIndex?: number; } function getTabsTemplate(props?: TabsTestProps) { return html` A B @@ -48,38 +48,38 @@ describe('', () => { describe('properties', () => { it('renders selected with indicator', async () => { - const {harness} = await setupTest({selected: 1}); - expect(harness.element.selected).toBe(1); + const {harness} = await setupTest({activeTabIndex: 1}); + expect(harness.element.activeTabIndex).toBe(1); expect(harness.element.activeTab).toBe(harness.harnessedItems[1].element); harness.harnessedItems.forEach(async (tabHarness, i) => { - const shouldBeSelected = i === harness.element.selected; + const shouldBeSelected = i === harness.element.activeTabIndex; await tabHarness.element.updateComplete; - expect(tabHarness.element.selected).toBe(shouldBeSelected); + expect(tabHarness.element.active).toBe(shouldBeSelected); expect(await tabHarness.isIndicatorShowing()).toBe(shouldBeSelected); }); await env.waitForStability(); - harness.element.selected = 0; + harness.element.activeTabIndex = 0; await harness.element.updateComplete; - expect(harness.element.selected).toBe(0); + expect(harness.element.activeTabIndex).toBe(0); harness.harnessedItems.forEach(async (tabHarness, i) => { - const shouldBeSelected = i === harness.element.selected; + const shouldBeSelected = i === harness.element.activeTabIndex; await tabHarness.element.updateComplete; - expect(tabHarness.element.selected).toBe(shouldBeSelected); + expect(tabHarness.element.active).toBe(shouldBeSelected); expect(await tabHarness.isIndicatorShowing()).toBe(shouldBeSelected); }); }); it('updates activeTab', async () => { - const {harness} = await setupTest({selected: 1}); + const {harness} = await setupTest({activeTabIndex: 1}); expect(harness.element.activeTab).toBe(harness.harnessedItems[1].element); - harness.element.selected = 0; + harness.element.activeTabIndex = 0; await harness.element.updateComplete; expect(harness.element.activeTab).toBe(harness.harnessedItems[0].element); }); it('maintains selection when tabs are mutated', async () => { // Note: adding and moving tabs does not change selection - const {harness} = await setupTest({selected: 1}); + const {harness} = await setupTest({activeTabIndex: 1}); const [, second] = harness.element.tabs; expect(harness.element.activeTab).toBe(second); const tab = document.createElement('md-primary-tab'); @@ -103,7 +103,7 @@ describe('', () => { }); it('selects first item when selected tab is removed', async () => { - const {harness} = await setupTest({selected: 1}); + const {harness} = await setupTest({activeTabIndex: 1}); const [first, second] = harness.element.tabs; expect(harness.element.activeTab).toBe(second); second.remove();