feat(material-experimental/checkbox): Add test harnesses for both versions of mat-checkbox (#16334)

Author: mmalerba

.github/CODEOWNERS

@@ -94,6 +94,8 @@
 /src/material-experimental/mdc-radio/**            @mmalerba
 /src/material-experimental/mdc-slide-toggle/**     @crisbeto
 /src/material-experimental/mdc-tabs/**             @crisbeto
+/src/material-experimental/mdc-theming/**          @mmalerba
+/src/material-experimental/mdc-typography/**       @mmalerba
 /src/material-experimental/popover-edit/**         @kseamon @andrewseguin
 
 # CDK experimental package

src/cdk-experimental/testing/BUILD.bazel

@@ -9,15 +9,9 @@ ng_module(
         ["**/*.ts"],
         exclude = [
             "**/*.spec.ts",
-            "tests/**",
         ],
     ),
     module_name = "@angular/cdk-experimental/testing",
-    deps = [
-        "//src/cdk/testing",
-        "@npm//@angular/core",
-        "@npm//protractor",
-    ],
 )
 
 ng_web_test_suite(

src/cdk-experimental/testing/protractor/BUILD

@@ -0,0 +1,16 @@
+package(default_visibility = ["//visibility:public"])
+
+load("//tools:defaults.bzl", "ts_library")
+
+ts_library(
+    name = "protractor",
+    srcs = glob(
+        ["**/*.ts"],
+        exclude = ["**/*.spec.ts"],
+    ),
+    module_name = "@angular/cdk-experimental/testing/protractor",
+    deps = [
+        "//src/cdk-experimental/testing",
+        "@npm//protractor",
+    ],
+)

src/cdk-experimental/testing/protractor/index.ts

@@ -6,5 +6,4 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-export * from './protractor-element';
-export * from './protractor-harness-environment';
+export * from './public-api';

src/cdk-experimental/testing/protractor/protractor-element.ts

@@ -50,4 +50,9 @@ export class ProtractorElement implements TestElement {
   async getAttribute(name: string): Promise<string|null> {
     return this.element.getAttribute(name);
   }
+
+  async hasClass(name: string): Promise<boolean> {
+    const classes = (await this.getAttribute('class')) || '';
+    return new Set(classes.split(/\s+/).filter(c => c)).has(name);
+  }
 }

src/cdk-experimental/testing/protractor/public-api.ts

@@ -0,0 +1,10 @@
+/**
+ * @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.io/license
+ */
+
+export * from './protractor-element';
+export * from './protractor-harness-environment';

src/cdk-experimental/testing/public-api.ts

@@ -8,6 +8,4 @@
 
 export * from './component-harness';
 export * from './harness-environment';
-export * from './protractor';
 export * from './test-element';
-export * from './testbed';

src/cdk-experimental/testing/test-element.ts

@@ -43,4 +43,7 @@ export interface TestElement {
    * falls back to reading the property.
    */
   getAttribute(name: string): Promise<string | null>;
+
+  /** Checks whether the element has the given class. */
+  hasClass(name: string): Promise<boolean>;
 }

src/cdk-experimental/testing/testbed/BUILD

@@ -0,0 +1,17 @@
+package(default_visibility = ["//visibility:public"])
+
+load("//tools:defaults.bzl", "ts_library")
+
+ts_library(
+    name = "testbed",
+    srcs = glob(
+        ["**/*.ts"],
+        exclude = ["**/*.spec.ts"],
+    ),
+    module_name = "@angular/cdk-experimental/testing/testbed",
+    deps = [
+        "//src/cdk-experimental/testing",
+        "//src/cdk/testing",
+        "@npm//@angular/core",
+    ],
+)

src/cdk-experimental/testing/testbed/index.ts

@@ -6,5 +6,4 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-export * from './testbed-harness-environment';
-export * from './unit-test-element';
+export * from './public-api';

src/cdk-experimental/testing/testbed/public-api.ts

@@ -0,0 +1,10 @@
+/**
+ * @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.io/license
+ */
+
+export * from './testbed-harness-environment';
+export * from './unit-test-element';

src/cdk-experimental/testing/testbed/unit-test-element.ts

@@ -86,7 +86,7 @@ export class UnitTestElement implements TestElement {
 
   async text(): Promise<string> {
     await this._stabilize();
-    return this.element.textContent || '';
+    return (this.element.textContent || '').trim();
   }
 
   async getAttribute(name: string): Promise<string|null> {
@@ -100,4 +100,9 @@ export class UnitTestElement implements TestElement {
     }
     return value;
   }
+
+  async hasClass(name: string): Promise<boolean> {
+    await this._stabilize();
+    return this.element.classList.contains(name);
+  }
 }

src/cdk-experimental/testing/tests/BUILD.bazel

@@ -36,6 +36,7 @@ ng_test_library(
         ":test_components",
         ":test_harnesses",
         "//src/cdk-experimental/testing",
+        "//src/cdk-experimental/testing/testbed",
     ],
 )
 
@@ -45,5 +46,6 @@ ng_e2e_test_library(
     deps = [
         ":test_harnesses",
         "//src/cdk-experimental/testing",
+        "//src/cdk-experimental/testing/protractor",
     ],
 )

src/cdk-experimental/testing/tests/protractor.e2e.spec.ts

@@ -1,6 +1,6 @@
+import {HarnessLoader} from '@angular/cdk-experimental/testing';
+import {ProtractorHarnessEnvironment} from '@angular/cdk-experimental/testing/protractor';
 import {browser} from 'protractor';
-import {HarnessLoader} from '../component-harness';
-import {ProtractorHarnessEnvironment} from '../protractor';
 import {MainComponentHarness} from './harnesses/main-component-harness';
 import {SubComponentHarness} from './harnesses/sub-component-harness';
 

src/cdk-experimental/testing/tests/testbed.spec.ts

@@ -1,6 +1,6 @@
+import {HarnessLoader} from '@angular/cdk-experimental/testing';
+import {TestbedHarnessEnvironment} from '@angular/cdk-experimental/testing/testbed';
 import {ComponentFixture, TestBed} from '@angular/core/testing';
-import {HarnessLoader} from '../component-harness';
-import {TestbedHarnessEnvironment} from '../testbed/index';
 import {MainComponentHarness} from './harnesses/main-component-harness';
 import {SubComponentHarness} from './harnesses/sub-component-harness';
 import {TestComponentsModule} from './test-components-module';

src/material-experimental/mdc-checkbox/BUILD.bazel

@@ -2,13 +2,16 @@ package(default_visibility = ["//visibility:public"])
 
 load("@io_bazel_rules_sass//:defs.bzl", "sass_binary", "sass_library")
 load("@npm_angular_bazel//:index.bzl", "protractor_web_test_suite")
-load("//tools:defaults.bzl", "ng_e2e_test_library", "ng_module", "ng_test_library", "ng_web_test_suite")
+load("//tools:defaults.bzl", "ng_e2e_test_library", "ng_module", "ng_test_library", "ng_web_test_suite", "ts_library")
 
 ng_module(
     name = "mdc-checkbox",
     srcs = glob(
         ["**/*.ts"],
-        exclude = ["**/*.spec.ts"],
+        exclude = [
+            "**/*.spec.ts",
+            "harness/**",
+        ],
     ),
     assets = [":checkbox_scss"] + glob(["**/*.html"]),
     module_name = "@angular/material-experimental/mdc-checkbox",
@@ -25,6 +28,18 @@ ng_module(
     ],
 )
 
+ts_library(
+    name = "harness",
+    srcs = glob(
+        ["harness/**/*.ts"],
+        exclude = ["**/*.spec.ts"],
+    ),
+    deps = [
+        "//src/cdk-experimental/testing",
+        "//src/cdk/coercion",
+    ],
+)
+
 sass_library(
     name = "mdc_checkbox_scss_lib",
     srcs = glob(["**/_*.scss"]),
@@ -55,8 +70,12 @@ ng_test_library(
         exclude = ["**/*.e2e.spec.ts"],
     ),
     deps = [
+        ":harness",
         ":mdc-checkbox",
+        "//src/cdk-experimental/testing",
+        "//src/cdk-experimental/testing/testbed",
         "//src/cdk/testing",
+        "//src/material/checkbox",
         "@npm//@angular/forms",
         "@npm//@angular/platform-browser",
     ],

src/material-experimental/mdc-checkbox/harness/checkbox-harness-filters.ts

@@ -0,0 +1,11 @@
+/**
+ * @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.io/license
+ */
+
+export type CheckboxHarnessFilters = {
+  label?: string | RegExp
+};