Skip to content

Commit

Permalink
feat(material/tabs): add a harness filter for tab selected state (#25806
Browse files Browse the repository at this point in the history
)
  • Loading branch information
mmalerba authored Oct 14, 2022
1 parent baaf7c9 commit c370e06
Show file tree
Hide file tree
Showing 9 changed files with 48 additions and 14 deletions.
7 changes: 6 additions & 1 deletion src/material/legacy-tabs/testing/tab-group-harness.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
import {MatLegacyTabsModule} from '@angular/material/legacy-tabs';
import {runTabGroupHarnessTests} from '@angular/material/tabs/testing/tab-group-shared.spec';
import {MatLegacyTabGroupHarness} from './tab-group-harness';
import {MatLegacyTabHarness} from './tab-harness';

describe('Non-MDC-based MatTabGroupHarness', () => {
runTabGroupHarnessTests(MatLegacyTabsModule, MatLegacyTabGroupHarness as any);
runTabGroupHarnessTests(
MatLegacyTabsModule,
MatLegacyTabGroupHarness as any,
MatLegacyTabHarness as any,
);
});
2 changes: 2 additions & 0 deletions src/material/legacy-tabs/testing/tab-harness-filters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ import {BaseHarnessFilters} from '@angular/cdk/testing';
export interface LegacyTabHarnessFilters extends BaseHarnessFilters {
/** Only find instances whose label matches the given value. */
label?: string | RegExp;
/** Only find instances whose selected state matches the given value. */
selected?: boolean;
}

/**
Expand Down
14 changes: 9 additions & 5 deletions src/material/legacy-tabs/testing/tab-harness.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,11 +29,15 @@ export class MatLegacyTabHarness extends ContentContainerComponentHarness<string
* @return a `HarnessPredicate` configured with the given options.
*/
static with(options: LegacyTabHarnessFilters = {}): HarnessPredicate<MatLegacyTabHarness> {
return new HarnessPredicate(MatLegacyTabHarness, options).addOption(
'label',
options.label,
(harness, label) => HarnessPredicate.stringMatches(harness.getLabel(), label),
);
return new HarnessPredicate(MatLegacyTabHarness, options)
.addOption('label', options.label, (harness, label) =>
HarnessPredicate.stringMatches(harness.getLabel(), label),
)
.addOption(
'selected',
options.selected,
async (harness, selected) => (await harness.isSelected()) == selected,
);
}

/** Gets the label of the tab. */
Expand Down
3 changes: 2 additions & 1 deletion src/material/tabs/testing/tab-group-harness.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import {MatTabsModule} from '@angular/material/tabs';
import {runTabGroupHarnessTests} from './tab-group-shared.spec';
import {MatTabGroupHarness} from './tab-group-harness';
import {MatTabHarness} from './tab-harness';

describe('MDC-based MatTabGroupHarness', () => {
runTabGroupHarnessTests(MatTabsModule, MatTabGroupHarness);
runTabGroupHarnessTests(MatTabsModule, MatTabGroupHarness, MatTabHarness);
});
14 changes: 13 additions & 1 deletion src/material/tabs/testing/tab-group-shared.spec.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
import {ComponentHarness, HarnessLoader} from '@angular/cdk/testing';
import {ComponentHarness, HarnessLoader, parallel} from '@angular/cdk/testing';
import {TestbedHarnessEnvironment} from '@angular/cdk/testing/testbed';
import {Component} from '@angular/core';
import {ComponentFixture, TestBed} from '@angular/core/testing';
import {MatTabsModule} from '@angular/material/tabs';
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
import {MatTabGroupHarness} from './tab-group-harness';
import {MatTabHarness} from './tab-harness';

/** Shared tests to run on both the original and MDC-based tab-group's. */
export function runTabGroupHarnessTests(
tabsModule: typeof MatTabsModule,
tabGroupHarness: typeof MatTabGroupHarness,
tabHarness: typeof MatTabHarness,
) {
let fixture: ComponentFixture<TabGroupHarnessTest>;
let loader: HarnessLoader;
Expand Down Expand Up @@ -151,6 +153,16 @@ export function runTabGroupHarnessTests(
expect(await tabs[1].isSelected()).toBe(false);
expect(await tabs[2].isSelected()).toBe(true);
});

it('should be able to get tabs by selected state', async () => {
const selectedTabs = await loader.getAllHarnesses(tabHarness.with({selected: true}));
const unselectedTabs = await loader.getAllHarnesses(tabHarness.with({selected: false}));
expect(await parallel(() => selectedTabs.map(t => t.getLabel()))).toEqual(['First']);
expect(await parallel(() => unselectedTabs.map(t => t.getLabel()))).toEqual([
'Second',
'Third',
]);
});
}

@Component({
Expand Down
8 changes: 5 additions & 3 deletions src/material/tabs/testing/tab-harness-filters.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@
*/
import {BaseHarnessFilters} from '@angular/cdk/testing';

/** A set of criteria that can be used to filter a list of `MatRadioButtonHarness` instances. */
/** A set of criteria that can be used to filter a list of `MatTabHarness` instances. */
export interface TabHarnessFilters extends BaseHarnessFilters {
/** Only find instances whose label matches the given value. */
label?: string | RegExp;
/** Only find instances whose selected state matches the given value. */
selected?: boolean;
}

/** A set of criteria that can be used to filter a list of `MatRadioButtonHarness` instances. */
/** A set of criteria that can be used to filter a list of `MatTabGroupHarness` instances. */
export interface TabGroupHarnessFilters extends BaseHarnessFilters {
/** Only find instances whose selected tab label matches the given value. */
selectedTabLabel?: string | RegExp;
Expand All @@ -28,5 +30,5 @@ export interface TabLinkHarnessFilters extends BaseHarnessFilters {
/** A set of criteria that can be used to filter a list of `MatTabNavBarHarness` instances. */
export interface TabNavBarHarnessFilters extends BaseHarnessFilters {}

/** A set of criteria that can be used to filter a list of `MatTabNavBarHarness` instances. */
/** A set of criteria that can be used to filter a list of `MatTabNavPanelHarness` instances. */
export interface TabNavPanelHarnessFilters extends BaseHarnessFilters {}
12 changes: 9 additions & 3 deletions src/material/tabs/testing/tab-harness.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,15 @@ export class MatTabHarness extends ContentContainerComponentHarness<string> {
this: ComponentHarnessConstructor<T>,
options: TabHarnessFilters = {},
): HarnessPredicate<T> {
return new HarnessPredicate(this, options).addOption('label', options.label, (harness, label) =>
HarnessPredicate.stringMatches(harness.getLabel(), label),
);
return new HarnessPredicate(this, options)
.addOption('label', options.label, (harness, label) =>
HarnessPredicate.stringMatches(harness.getLabel(), label),
)
.addOption(
'selected',
options.selected,
async (harness, selected) => (await harness.isSelected()) == selected,
);
}

/** Gets the label of the tab. */
Expand Down
1 change: 1 addition & 0 deletions tools/public_api_guard/material/legacy-tabs-testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ export interface LegacyTabGroupHarnessFilters extends BaseHarnessFilters {
// @public @deprecated
export interface LegacyTabHarnessFilters extends BaseHarnessFilters {
label?: string | RegExp;
selected?: boolean;
}

// @public @deprecated
Expand Down
1 change: 1 addition & 0 deletions tools/public_api_guard/material/tabs-testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,7 @@ export interface TabGroupHarnessFilters extends BaseHarnessFilters {
// @public
export interface TabHarnessFilters extends BaseHarnessFilters {
label?: string | RegExp;
selected?: boolean;
}

// @public
Expand Down

0 comments on commit c370e06

Please sign in to comment.