简体   繁体   English

Angular CLI为现有组件创建.spec文件

[英]Angular CLI create .spec files for already existing components

There is an option in .angular-cli.json to disable the automatic creating of *.spec files eg for components, see json schema . .angular-cli.json有一个选项可以禁用*.spec文件的自动创建,例如,对于组件,请参见json schema

This is a really nice feature because personally (this is just my opinion) testing the components might not be the thing that really worth it in a fast growing project. 这是一个非常不错的功能,因为个人(这只是我的观点)在快速发展的项目中测试组件可能并不是真正值得的。

However sometimes I would like to have an option to generate / recreate the corresponding *.spec file for an already existing component / service / pipe / whatsoever. 但是有时候我想有一个选项来为已经存在的组件/服务/管道/任何东西生成/重新创建相应的*.spec文件。

Is that possible using some command line call? 使用某些命令行调用可能吗?

Created a feature request , let's see how it goes... 创建了功能请求 ,让我们看看它如何进行...

Currently Angular CLI does not provide this functionality and it is not clear how and when it will be possible to manage it in official way. 当前,Angular CLI不提供此功能,并且尚不清楚如何以及何时以官方方式进行管理。

However, here is a library "ngx-spec" that generates the spec based on Angular CLI spec presets . 但是, 这是一个库“ ngx-spec”,它基于Angular CLI规范预设生成规范

chose a directory where you want to generate spec, and then it will generate all Angular spec. 选择要在其中生成规格的目录,然后它将生成所有Angular规格。

only generate file when spec file not exist, and the component / directive / guard / pipe / service follow the angular-cli file generate name. 仅当spec文件不存在时才生成文件,并且component / directive / guard / pipe / service遵循angular-cli文件生成名称。

npm install -g angular-spec-generator

angular-spec-generator 'C:\Users\Alan\Desktop\test'

There are 2 solutions for this : 有两种解决方案:

SimonTest is an extension to VS Code that generates tests for existing files. SimonTest是VS Code的扩展,可为现有文件生成测试。 I highly recommend it (I am not affiliated with them in any way). 我强烈推荐它(我不以任何方式隶属于他们)。

The only catch is that it comes with a 30-day free trial, and afterwards requires a paid license. 唯一的问题是它具有30天的免费试用期,之后需要付费许可证。

Scaffolding for existing .ts files can be created by using https://github.com/smnbbrv/ngx-spec 可以使用https://github.com/smnbbrv/ngx-spec创建现有.ts文件的支架

To install in an Angular project: 要在Angular项目中安装:

npm i -D ngx-spec@^2.0.0

(-D is the shorthand for --save-dev) (-D是--save-dev的简写)

example usage (for a service): 用法示例(用于服务):

ng g ngx-spec:spec path/my.service

or 要么

ng g ngx-spec:spec path/my.service.ts

For a service, this doesn't set up a test to be created via injection. 对于服务,这不会设置要通过注入创建的测试。 Adapt so that the test looks something like this: 调整一下,使测试看起来像这样:

import { TestBed, inject } from '@angular/core/testing';

import { DataService } from './data.service';
import { AuthService } from './auth.service';
import { HttpClient, HttpHandler } from '@angular/common/http';

describe('DataService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [DataService, AuthService, HttpClient, HttpHandler
      ]
    });
  });

  it('should be created', inject([DataService, AuthService], (service: DataService) => {
    expect(service).toBeTruthy();
  }));
});

It's also meant to be possible to generate tests using a wildcard, eg 这也意味着可以使用通配符生成测试,例如

ng g ngx-specs '**/*

That didn't work for me - see the GitHub issue: 这对我不起作用-请参阅GitHub问题:

https://github.com/smnbbrv/ngx-spec/issues/10 https://github.com/smnbbrv/ngx-spec/issues/10


Note - As a strategy to implement test-driven development, I found it easiest to search for and remove all existing *.spec.ts files that had automatically been created in the Angular project as part of initial artifact creation (by searching in Windows explorer), then as a starting point I created a single test for the main Angular data provider service, using ngx-spec 注意 -作为实施测试驱动开发的一种策略,我发现最简单的方法是搜索和删除在Angular项目中作为初始工件创建过程自动创建的所有现有*.spec.ts文件(通过在Windows资源管理器中进行搜索) ),然后作为起点,我使用ngx-spec为主要的Angular数据提供程序服务创建了一个测试

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM