Schematics for Component spec should use test host component when created with `-cd OnPush`
- Lenguaje dominante
- TypeScript
- Estrellas
- 27k
- Forks
- 11.8k
- Merge medio
- 14 h 23 min
- PR fusionados (30 d)
- 162
Descripción
### Versions
```
Angular CLI: 1.7.3
Node: 8.9.1
OS: win32 x64
Angular: 5.2.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router
@angular/cli: 1.7.3
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.2
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.4.2
webpack: 3.11.0
```
### Repro steps
* `ng generate component test -cd OnPush`
* Edit the test.component.html to be
```
{{ checkMe() }}
```
* Add the checkMe method to test.component.ts:
```TypeScript
checkMe() {
console.log('change detection was invoked!');
}
```
* Edit the generated .spec file to include the following test:
```TypeScript
fit('runs change detection', () => {
fixture.detectChanges();
fixture.detectChanges();
fixture.detectChanges();
});
```
* Run unit test
### Observed behavior
'change detection was invoked!' is logged only once (the initial check on creation of the component) rather than 4 times. That is to say, invoking `fixture.detectChanges()` does not actually run change detection. This is a known issue and is discussed in https://github.com/angular/angular/issues/12313
```
LOG: 'change detection was invoked!'
Chrome 65.0.3325 (Windows 10 0.0.0): Executed 1 of 478 SUCCESS (0 secs / 0.138 secs)
```
### Desired behavior
As discussed in the thread linked above, the solution for testing OnPush components is to use the "test host component" pattern as described in the [angular.io testing docs](https://angular.io/guide/testing#component-inside-a-test-host).
Therefore, the Angular CLI should use a schematic which uses the test host component when the `-cd OnPush` flag has been used. Otherwise we get a default test setup which is not fit for purpose (and will cause many wasted hours for devs like me 😓)
Guía de contribución
Línea de trabajo
Ejecuta `ng generate component test -cd OnPush` e inspecciona los archivos de componente generados y el archivo `.spec`, centrándote en cómo el Angular component schematic configura las pruebas. Usa como contexto las indicaciones de testing de Angular enlazadas y, después, verifica que la prueba generada utiliza el patrón de componente host de prueba y que las llamadas repetidas a `fixture.detectChanges()` invocan la detección de cambios.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- angular, typescript
- Área
- testing, tooling
- Tipo de issue
- Error
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 35/100