Schematics for Component spec should use test host component when created with `-cd OnPush`
还没有人认领这个 Issue。
评估
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 新手友好度
- 35/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 停滞
- 技术栈
- angular, typescript
调研方向
运行 ng generate component test -cd OnPush,检查生成的组件文件和 .spec 文件,重点关注 Angular component schematic 如何设置测试。以链接的 Angular 测试指南作为上下文,然后验证生成的测试使用了测试宿主组件模式,并且重复调用 fixture.detectChanges() 会触发变更检测。
由索引模型根据 Issue 内容生成。
描述
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:
checkMe() {
console.log('change detection was invoked!');
}
- Edit the generated .spec file to include the following test:
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.
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 😓)
- 主要语言
- TypeScript
- 星标
- 27k
- 派生
- 11.8k
- 平均合并
- 16 小时 35 分钟
- 30 天内合并 PR
- 176
贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
angular/angular-cli 的其他 Issue
-
area: @angular/build gemini-triaged
难度 2/5 1-3 小时 新手友好度 74/100
angular/angular-cli#33955 ·
-
area: @angular/cli gemini-triaged
难度 2/5 1-3 小时 新手友好度 72/100
angular/angular-cli#33055 · 1 条评论 · 3 个 reaction ·
-
area: @angular/build gemini-triaged
难度 4/5 3-5 天 新手友好度 72/100
angular/angular-cli#34137 ·
-
angular/build:library area: @angular/build gemini-triaged
angular/angular-cli#34131 · 已指派 1 人 ·
-
angular/build:library area: @angular/build gemini-triaged
angular/angular-cli#34130 · 已指派 1 人 ·
查看 angular/angular-cli 的全部 Issue
相似的 Issue
-
难度 1/5 1 小时以内 新手友好度 72/100
EclipseFdn/open-vsx.org#13385 · 1 条评论 ·
-
S: triage
难度 1/5 1 小时以内 新手友好度 85/100
-
难度 2/5 1-3 小时 新手友好度 76/100
-
fix(errors): EHOSTUNREACH from a happy-eyeballs connect is reported as a resolver error (STAMP-80) 未关闭
难度 2/5 1-3 小时 新手友好度 90/100
snapshot-labs/stamp#666 ·
-
vangogh
难度 2/5 1-3 小时 新手友好度 75/100
knaw-huc/textannoviz#691 ·