Como executar apenas uma especificação de teste com angular-cli

Eu tenho o projeto Angular2 compilado com Angular-CLI (beta 20).

Existe uma maneira de executar testes em apenas um arquivo de especificação selecionado?

Eu costumava ter um projeto baseado no início rápido do Angular2 e podia adicionar manualmente especificações ao arquivo jasmim. Mas não sei como configurar isso fora dos testes de karma ou como limitar os testes de karma a arquivos específicos com builds de CLI angular.

Cada .spec.tsarquivo tem todos os seus testes agrupados em describeblocos como este:

describe('SomeComponent', () => {...}

Você pode executar facilmente apenas esse único bloco, prefixando o describenome da função com f:

fdescribe('SomeComponent', () => {...}

Se você tiver essa função, nenhum outro describebloco será executado. Btw. você pode fazer algo semelhante com it=> fite também há uma versão da "lista negra" - x. Assim:

• fdescribee fitfaz com que apenas funções marcadas dessa maneira sejam executadas
• xdescribee xitfaz com que todas as funções marcadas dessa maneira sejam executadas

Configure o test.tsarquivo dentro da srcpasta:

const context = require.context('./', true, /\.spec\.ts$/);

Substitua /\.spec\.ts$/pelo nome do arquivo que você deseja testar. Por exemplo:/app.component\.spec\.ts$/

Isso executará o teste apenas para app.component.spec.ts.

Você pode testar apenas um arquivo específico com a CLI Angular (o ngcomando) assim:

ng test --main ./path/to/test.ts

Documentos adicionais estão em https://angular.io/cli/test

Observe que, embora funcione para arquivos de biblioteca independentes, não funcionará para componentes / serviços angulares / etc. Isso ocorre porque os arquivos angulares têm dependências de outros arquivos (principalmente src/test.tsno Angular 7). Infelizmente, a --mainbandeira não aceita vários argumentos.

Se você deseja controlar quais arquivos são selecionados na linha de comando, consegui fazer isso no Angular 7.

Em resumo, você precisa instalar @angular-devkit/build-angular:browsere criar um plug-in personalizado do webpack para passar o regex do arquivo de teste. Por exemplo:

angular.json - altere o construtor de teste @angular-devkit/build-angular:browsere defina um arquivo de configuração personalizado:

...

        "test": {
          "builder": "@angular-builders/custom-webpack:browser",
          "options": {
            "customWebpackConfig": {
              "path": "./extra-webpack.config.js"
            },
...

extra-webpack.config.js - crie uma configuração do webpack que leia o regex na linha de comando:

const webpack = require('webpack');
const FILTER = process.env.KARMA_FILTER;
let KARMA_SPEC_FILTER = '/.spec.ts$/';
if (FILTER) {
  KARMA_SPEC_FILTER = `/${FILTER}.spec.ts$/`;
}
module.exports = {
  plugins: [new webpack.DefinePlugin({KARMA_SPEC_FILTER})]
}

test.ts - edita as especificações

...
// Then we find all the tests.
declare const KARMA_CONTEXT_SPEC: any;
const context = require.context('./', true, KARMA_CONTEXT_SPEC);

Em seguida, use o seguinte para substituir o padrão:

KARMA_FILTER='somefile-.*\.spec\.ts$' npm run test

Eu documentei a história aqui , desculpando-me antecipadamente por tipos e links incorretos. Agradeço a resposta acima de @ Aish-Anu por me indicar a direção certa.

Isso está funcionando para mim no Angular 7. É baseado na opção --main do comando ng. Não tenho certeza se esta opção não está documentada e está sujeita a alterações, mas funciona para mim. Coloquei uma linha no meu arquivo package.json na seção scripts. Lá, usando a opção --main com o comando ng test, eu especifico o caminho para o arquivo .spec.ts que quero executar. Por exemplo

"test 1": "ng test --main E:/WebRxAngularClient/src/app/test/shared/my-date-utils.spec.ts",

Você pode executar o script como qualquer outro script. Eu o executo no Webstorm clicando em "teste 1" na seção npm.

Eu resolvi esse problema usando o grunhido. Eu tenho o script grunhido abaixo. O que o script faz é pegar o parâmetro de linha de comando do teste específico para executar e criar uma cópia de test.ts e colocar esse nome de teste específico lá.

Para executar isso, primeiro instale o grunt-cli usando:

npm install -g grunt-cli

Coloque as dependências grunt abaixo no seu package.json:

"grunt": "^1.0.1",
"grunt-contrib-clean": "^1.0.0",
"grunt-contrib-copy": "^1.0.0",
"grunt-exec": "^2.0.0",
"grunt-string-replace": "^1.3.1"

Para executá-lo, salve o arquivo grunt abaixo como Gruntfile.js na sua pasta raiz. Em seguida, na linha de comando, execute-o como:

grunt --target=app.component

Isso executará app.component.spec.ts.

O arquivo Grunt é como abaixo:

/*
This gruntfile is used to run a specific test in watch mode. Example: To run app.component.spec.ts , the Command is: 
grunt --target=app.component
Do not specific .spec.ts. If no target is specified it will run all tests.
*/
module.exports = function(grunt) {
var target = grunt.option('target') || '';
  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    clean: ['temp.conf.js','src/temp-test.ts'],
    copy: {
      main: {
        files: [
             {expand: false, cwd: '.', src: ['karma.conf.js'], dest: 'temp.conf.js'},
             {expand: false, cwd: '.', src: ['src/test.ts'], dest: 'src/temp-test.ts'}
             ],
      }
    },
    'string-replace': {
          dist: {
            files: {
              'temp.conf.js': 'temp.conf.js',
              'src/temp-test.ts': 'src/temp-test.ts'
            },
            options: {
              replacements: [{
                pattern: /test.ts/ig,
                replacement: 'temp-test.ts'
              },
              {
                pattern: /const context =.*/ig,
                replacement: 'const context = require.context(\'./\', true, /'+target+'\\\.spec\\\.ts$/);'
              }]
            }
        }
    },
    'exec': {
        sleep: {
          //The sleep command is needed here, else webpack compile fails since it seems like the files in the previous step were touched too recently
          command: 'ping 127.0.0.1 -n 4 > nul',
          stdout: true,
          stderr: true
        },
        ng_test: {
          command: 'ng test --config=temp.conf.js',
          stdout: true,
          stderr: true
        }
    }
  });

  // Load the plugin that provides the "uglify" task.
    grunt.loadNpmTasks('grunt-contrib-clean');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-string-replace');
    grunt.loadNpmTasks('grunt-exec');
  // Default task(s).
  grunt.registerTask('default', ['clean','copy','string-replace','exec']);

};

Além disso, para pessoas como eu, que estavam procurando uma maneira de executar uma única especificação no Angular e encontraram esse SO.

De acordo com os documentos angulares mais recentes (v9.0.6 no momento da gravação), o ng testcomando tem uma --includeopção em que você pode especificar um diretório de *.spec.(ts|tsx)arquivos ou apenas um único .spec.(ts|tsx)arquivo.

https://angular.io/cli/test

Apenas pequenas alterações necessárias no test.tsarquivo dentro da pasta src:

const context = require.context('./', true, /test-example\.spec\.ts$/);

Aqui test-exampleestá o nome exato do arquivo que precisamos executar

Da mesma forma, se você precisar testar apenas o arquivo de serviço, poderá substituir o nome do arquivo como "/test-example.service"

Isso funcionou para mim em todos os casos:

ng test --include='**/dealer.service.spec.ts'

No entanto, geralmente recebo "TypeError: Não é possível ler a propriedade 'ngModule' nulo" ":

ng test --main src/app/services/dealer.service.spec.ts

Versão do @ angular / cli 10.0.4