@@ -549,19 +549,18 @@ may need to explicitly wait for tasks outside `NgZone`, as this does not happen
549
549
550
550
### API for harness environment authors
551
551
552
- Harness environment authors are developers who want to add support for using component harnesses in
553
- additional testing environments. Out of the box, these harnesses can be used in Protractor E2E tests
554
- and Karma unit tests. Support for a new testing environment can be added by creating new
555
- ` TestElement ` and ` HarnessEnvironment ` implementations for the environment.
552
+ Out-of-the-box, Angular CDK's component harnesses can be used in Protractor E2E tests and Karma unit
553
+ tests. Developers can support additional environments by creating custom implementations of
554
+ ` TestElement ` and ` HarnessEnvironment ` .
556
555
557
556
#### Creating a ` TestElement ` implementation for the environment
558
557
559
558
The first step in adding support for a new testing environment is to create a ` TestElement `
560
- implementation. ` TestElement ` is simply an interface that serves as an environment-agnostic
561
- representation of a DOM element. It provides a way for harnesses to interact with DOM elements
562
- regardless of the environment they're used in. Because it is not possible to interact with elements
563
- synchronously in all test environments (e.g. Protractor), all of the methods on this interface are
564
- asynchronous and return a ` Promise ` with the result of the operation.
559
+ implementation. The ` TestElement ` interface serves as an environment-agnostic representation of a
560
+ DOM element; it lets harnesses interact with DOM elements regardless of the underlying environment.
561
+ Because some environments don't support interacting with DOM elements synchronous (e.g. webdriver),
562
+ all of ` TestElement ` methods are asynchronous, returning a ` Promise ` with the result of the
563
+ operation.
565
564
566
565
| Method | Description |
567
566
| ------ | ----------- |
@@ -580,12 +579,12 @@ asynchronous and return a `Promise` with the result of the operation.
580
579
| ` getProperty(name: string): Promise<any> ` | Gets the value of the given property for the element. |
581
580
| ` matchesSelector(selector: string): Promise<boolean> ` | Checks whether the given selector matches the element. |
582
581
583
- The ` TestElement ` interface consists largely of methods that look very similar to the methods
584
- available on an ` HTMLElement ` ; because of this, similar methods likely exist in most test
585
- environments, which makes implementing the methods fairly straightforward. However, one important
586
- difference to note when implementing the ` sendKeys ` method, is that the key codes in the ` TestKey `
587
- enum likely differ from the key codes used in the test environment. It is recommended to maintain a
588
- mapping from ` TestKey ` codes to the codes used in the particular testing environment.
582
+ The ` TestElement ` interface consists largely of methods that resemble methods
583
+ available on ` HTMLElement ` ; similar methods exist in most test environments, which makes
584
+ implementing the methods fairly straightforward. However, one important difference to note when
585
+ implementing the ` sendKeys ` method, is that the key codes in the ` TestKey `
586
+ enum likely differ from the key codes used in the test environment. Environment authors should
587
+ maintain a mapping from ` TestKey ` codes to the codes used in the particular testing environment.
589
588
590
589
Note: the
591
590
[ ` UnitTestElement ` ] ( https://github.com/angular/components/blob/master/src/cdk/testing/testbed/unit-test-element.ts#L57 )
@@ -595,16 +594,17 @@ implementations that come with the CDK serve as good examples of implementations
595
594
596
595
#### Creating a ` HarnessEnvironemnt ` implementation for the environment
597
596
598
- ` HarnessEnvironment ` is an abstract class that needs to be extended to create a concrete subclass to
599
- be used with the new environment. This is the class that test authors will use to actually create
600
- component harness instances for use in their tests.
597
+ Test authors use ` HarnessEnvironemnt ` to create component harness instances for use in tests.
601
598
602
- The first step in creating a ` HarnessEnvironment ` implementation for a new testing environment is to
603
- extend ` HarnessEnvironment ` and fill in implementations for the abstract methods. The
604
- ` HarnessEnvironment ` is generic on the raw element type of the environment, ` E ` . When extending the
605
- class, it is recommended to fix this generic parameter to the correct type for the environment
606
- (e.g. ` Element ` for the ` TestbedHarnessEnvironment ` , ` ElementFinder ` for the
607
- ` ProtractorHarnessEnvironment ` ). The following are the abstract methods that must be implemented:
599
+ ` HarnessEnvironment ` is an abstract class that must be extended to create a concrete subclass for
600
+ the new environment. When supporting a new test environment, you must create a ` HarnessEnvironment `
601
+ subclass that add concrete implementations for all abstract members.
602
+
603
+ You will notice that ` HarnessEnvironment ` has a generic type parameter: ` HarnessEnvironment<E> ` .
604
+ This parameter, ` E ` , represents the raw element type of the environment. For example, this parameter
605
+ is ` Element ` for unit test environments.
606
+
607
+ The following are the abstract methods that must be implemented:
608
608
609
609
| Method | Description |
610
610
| ------ | ----------- |
@@ -624,8 +624,8 @@ require arguments to be passed. (e.g. the `loader` method on `TestbedHarnessEnvi
624
624
` ComponentFixture ` , and the class provides additional static methods called ` documentRootLoader ` and
625
625
` harnessForFixture ` ).
626
626
627
- Note: the
627
+ The
628
628
[ ` TestbedHarnessEnvironment ` ] ( https://github.com/angular/components/blob/master/src/cdk/testing/testbed/testbed-harness-environment.ts#L20 )
629
629
and
630
630
[ ` ProtractorHarnessEnvironment ` ] ( https://github.com/angular/components/blob/master/src/cdk/testing/protractor/protractor-harness-environment.ts#L16 )
631
- implementations that come with the CDK serve as good examples of implementations of this interface.
631
+ implementations in Angular CDK serve as good examples of implementations of this interface.
0 commit comments