feat(aria/grid): add test harnesses (#33081)

Author: ok7sai

goldens/aria/grid/testing/index.api.md

@@ -0,0 +1,64 @@
+## API Report File for "@angular/aria_grid_testing"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+import { BaseHarnessFilters } from '@angular/cdk/testing';
+import { ComponentHarness } from '@angular/cdk/testing';
+import { ContentContainerComponentHarness } from '@angular/cdk/testing';
+import { HarnessPredicate } from '@angular/cdk/testing';
+
+// @public
+export class GridCellHarness extends ContentContainerComponentHarness {
+    blur(): Promise<void>;
+    click(): Promise<void>;
+    focus(): Promise<void>;
+    getText(): Promise<string>;
+    // (undocumented)
+    static hostSelector: string;
+    isDisabled(): Promise<boolean>;
+    isSelected(): Promise<boolean>;
+    static with(options?: GridCellHarnessFilters): HarnessPredicate<GridCellHarness>;
+}
+
+// @public
+export interface GridCellHarnessFilters extends BaseHarnessFilters {
+    disabled?: boolean;
+    selected?: boolean;
+    text?: string | RegExp;
+}
+
+// @public
+export class GridHarness extends ComponentHarness {
+    getCells(filters?: GridCellHarnessFilters): Promise<GridCellHarness[]>;
+    getCellTextByIndex(): Promise<string[][]>;
+    getRows(filters?: GridRowHarnessFilters): Promise<GridRowHarness[]>;
+    // (undocumented)
+    static hostSelector: string;
+    isDisabled(): Promise<boolean>;
+    isMultiSelectable(): Promise<boolean>;
+    static with(options?: GridHarnessFilters): HarnessPredicate<GridHarness>;
+}
+
+// @public
+export interface GridHarnessFilters extends BaseHarnessFilters {
+    disabled?: boolean;
+}
+
+// @public
+export class GridRowHarness extends ComponentHarness {
+    getCells(filters?: GridCellHarnessFilters): Promise<GridCellHarness[]>;
+    getCellTextByIndex(filters?: GridCellHarnessFilters): Promise<string[]>;
+    // (undocumented)
+    static hostSelector: string;
+    static with(options?: GridRowHarnessFilters): HarnessPredicate<GridRowHarness>;
+}
+
+// @public
+export interface GridRowHarnessFilters extends BaseHarnessFilters {
+}
+
+// (No @packageDocumentation comment for this package)
+
+```

src/aria/config.bzl

@@ -4,6 +4,7 @@ ARIA_ENTRYPOINTS = [
     "accordion/testing",
     "combobox",
     "grid",
+    "grid/testing",
     "listbox",
     "listbox/testing",
     "menu",

src/aria/grid/testing/BUILD.bazel

@@ -0,0 +1,42 @@
+load("//tools:defaults.bzl", "ng_project", "ng_web_test_suite", "ts_project")
+
+package(default_visibility = ["//visibility:public"])
+
+ts_project(
+    name = "testing",
+    srcs = glob(
+        ["**/*.ts"],
+        exclude = ["**/*.spec.ts"],
+    ),
+    deps = [
+        "//:node_modules/@angular/core",
+        "//src/cdk/testing",
+    ],
+)
+
+filegroup(
+    name = "source-files",
+    srcs = glob(["**/*.ts"]),
+)
+
+ng_project(
+    name = "unit_tests_lib",
+    testonly = True,
+    srcs = glob(["**/*.spec.ts"]),
+    deps = [
+        ":testing",
+        "//:node_modules/@angular/core",
+        "//:node_modules/@angular/platform-browser",
+        "//src/aria/grid",
+        "//src/cdk/testing",
+        "//src/cdk/testing/private",
+        "//src/cdk/testing/testbed",
+    ],
+)
+
+ng_web_test_suite(
+    name = "unit_tests",
+    deps = [
+        ":unit_tests_lib",
+    ],
+)

src/aria/grid/testing/grid-harness-filters.ts

@@ -0,0 +1,30 @@
+/**
+ * @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 {BaseHarnessFilters} from '@angular/cdk/testing';
+
+/** Filters for locating a `GridCellHarness`. */
+export interface GridCellHarnessFilters extends BaseHarnessFilters {
+  /** Only find instances whose text matches the given value. */
+  text?: string | RegExp;
+  /** Only find instances whose selected state matches the given value. */
+  selected?: boolean;
+  /** Only find instances whose disabled state matches the given value. */
+  disabled?: boolean;
+}
+
+/** Filters for locating a `GridRowHarness`. */
+export interface GridRowHarnessFilters extends BaseHarnessFilters {
+  // Add filters if needed, e.g., rowIndex
+}
+
+/** Filters for locating a `GridHarness`. */
+export interface GridHarnessFilters extends BaseHarnessFilters {
+  /** Only find instances whose disabled state matches the given value. */
+  disabled?: boolean;
+}

src/aria/grid/testing/grid-harness.spec.ts

@@ -0,0 +1,117 @@
+/**
+ * @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 {Component} from '@angular/core';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
+import {HarnessLoader} from '@angular/cdk/testing';
+import {TestbedHarnessEnvironment} from '@angular/cdk/testing/testbed';
+
+import {GridHarness, GridRowHarness, GridCellHarness} from './grid-harness';
+import {Grid, GridRow, GridCell} from '../index';
+
+describe('Grid Harness', () => {
+  let fixture: ComponentFixture<GridHarnessTestComponent>;
+  let loader: HarnessLoader;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [GridHarnessTestComponent],
+    });
+    fixture = TestBed.createComponent(GridHarnessTestComponent);
+    fixture.detectChanges();
+    loader = TestbedHarnessEnvironment.loader(fixture);
+  });
+
+  it('finds the grid harness', async () => {
+    await expectAsync(loader.getHarness(GridHarness)).toBeResolved();
+  });
+
+  it('returns all rows scoped within the grid', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const rows = await grid.getRows();
+    expect(rows.length).toBe(2);
+  });
+
+  it('returns all cells scoped within the grid', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const cells = await grid.getCells();
+    expect(cells.length).toBe(4);
+  });
+
+  it('returns cells scoped within a row', async () => {
+    const rows = await loader.getAllHarnesses(GridRowHarness);
+    expect(rows.length).toBe(2);
+
+    const cellsInRow0 = await rows[0].getCells();
+    expect(cellsInRow0.length).toBe(2);
+    expect(await cellsInRow0[0].getText()).toBe('Cell 1.1');
+
+    const cellsInRow1 = await rows[1].getCells();
+    expect(cellsInRow1.length).toBe(2);
+    expect(await cellsInRow1[0].getText()).toBe('Cell 2.1');
+  });
+
+  it('filters cells by exact text content', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const cells = await grid.getCells({text: 'Cell 1.1'});
+    expect(cells.length).toBe(1);
+  });
+
+  it('reports the disabled state of the grid', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const isDisabled = await grid.isDisabled();
+    expect(isDisabled).toBeFalse();
+  });
+
+  it('reports the multi-selectable state of the grid', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const isMulti = await grid.isMultiSelectable();
+    expect(isMulti).toBeTrue();
+  });
+
+  it('reports the selected state of a cell', async () => {
+    const cell = await loader.getHarness(GridCellHarness.with({text: 'Cell 1.1'}));
+    expect(await cell.isSelected()).toBeTrue();
+  });
+
+  it('reports the disabled state of a cell', async () => {
+    const cell = await loader.getHarness(GridCellHarness.with({text: 'Cell 2.2'}));
+    expect(await cell.isDisabled()).toBeTrue();
+  });
+
+  it('gets the text of cells organized by rows', async () => {
+    const grid = await loader.getHarness(GridHarness);
+    const text = await grid.getCellTextByIndex();
+    expect(text).toEqual([
+      ['Cell 1.1', 'Cell 1.2'],
+      ['Cell 2.1', 'Cell 2.2'],
+    ]);
+  });
+
+  it('gets the text of cells in a row', async () => {
+    const rows = await loader.getAllHarnesses(GridRowHarness);
+    expect(await rows[0].getCellTextByIndex()).toEqual(['Cell 1.1', 'Cell 1.2']);
+  });
+});
+
+@Component({
+  imports: [Grid, GridRow, GridCell],
+  template: `
+    <table ngGrid [multi]="true" [disabled]="false" [enableSelection]="true">
+      <tr ngGridRow>
+        <td ngGridCell [selected]="true">Cell 1.1</td>
+        <td ngGridCell>Cell 1.2</td>
+      </tr>
+      <tr ngGridRow>
+        <td ngGridCell>Cell 2.1</td>
+        <td ngGridCell [disabled]="true">Cell 2.2</td>
+      </tr>
+    </table>
+  `,
+})
+class GridHarnessTestComponent {}