src/material/toolbar/testing/toolbar-harness.spec.ts - main - githubmirror/components

src/material/toolbar/testing/toolbar-harness.spec.ts
80 строк3 KB
Kristiyan Kostadinov
build: add explicit change detection to tests (#33010)
30 мар 2026, 10:52
30 мар 2026, 10:527806398
import {Component, ChangeDetectionStrategy} from '@angular/core';
import {ComponentHarness, HarnessLoader} from '@angular/cdk/testing';
import {MatToolbarModule} from '../../toolbar';
import {MatToolbarHarness, MatToolbarSection} from './toolbar-harness';
import {ComponentFixture, TestBed} from '@angular/core/testing';
import {TestbedHarnessEnvironment} from '@angular/cdk/testing/testbed';

describe('MatToolbarHarness', () => {
  let fixture: ComponentFixture<ToolbarHarnessTest>;
  let loader: HarnessLoader;

  beforeEach(() => {
    fixture = TestBed.createComponent(ToolbarHarnessTest);
    fixture.detectChanges();
    loader = TestbedHarnessEnvironment.loader(fixture);
  });

  it('should find all toolbars', async () => {
    const toolbars = await loader.getAllHarnesses(MatToolbarHarness);

    expect(toolbars.length).toBe(2);
  });

  it('should find toolbar with text', async () => {
    const toolbars = await loader.getAllHarnesses(MatToolbarHarness.with({text: 'My App'}));

    expect(toolbars.length).toBe(1);
    expect(await toolbars[0].hasMultipleRows()).toBeFalse();
  });

  it('should find toolbar with regex', async () => {
    const toolbars = await loader.getAllHarnesses(MatToolbarHarness.with({text: /Row/}));

    expect(toolbars.length).toBe(1);
    expect(await toolbars[0].hasMultipleRows()).toBeTrue();
  });

  it('should get toolbar text', async () => {
    const toolbars = await loader.getAllHarnesses(MatToolbarHarness);

    expect(await toolbars[0].getRowsAsText()).toEqual(['My App']);
    expect(await toolbars[1].getRowsAsText()).toEqual(['Row 1', 'Row 2 Button 1  Button 2']);
  });

  it('should get harness loaders for toolbar row', async () => {
    const toolbar = await loader.getHarness(MatToolbarHarness.with({text: /Button/}));
    const rowLoaders = await toolbar.getAllChildLoaders(MatToolbarSection.ROW);
    const row1 = rowLoaders[0] as HarnessLoader;
    const row1Subcomponents = await row1.getAllHarnesses(DummyHarness);
    const row2 = rowLoaders[1] as HarnessLoader;
    const row2Subcomponents = await row2.getAllHarnesses(DummyHarness);

    expect(row1Subcomponents.length).toBe(1);
    expect(row2Subcomponents.length).toBe(3);
  });
});

@Component({
  template: `
    <mat-toolbar><span>My App</span></mat-toolbar>
    <mat-toolbar>
      <mat-toolbar-row><span>Row 1</span></mat-toolbar-row>
      <mat-toolbar-row><span>Row 2</span>
        <button matButton>
          Button 1
        </button>
        <button matButton>
          Button 2
        </button>
      </mat-toolbar-row>
    </mat-toolbar>
  `,
  imports: [MatToolbarModule],
  changeDetection: ChangeDetectionStrategy.Eager,
})
class ToolbarHarnessTest {}

class DummyHarness extends ComponentHarness {
  static hostSelector = 'span, button';
}