proyecto - Cómo ejecutar solo una especificación de prueba con angular-cli

instalar angular 6

Question

Tengo la construcción del proyecto Angular2 con Angular-CLI (beta 20).

¿Hay alguna manera de ejecutar pruebas contra un solo archivo de especificaciones seleccionado?

Solía ​​tener un proyecto basado en el inicio rápido de Angular2, y podía agregar manualmente especificaciones al archivo de jazmín. Pero no sé cómo configurar esto fuera de las pruebas de karma o cómo limitar las pruebas de karma a archivos específicos con compilaciones de Angular-CLI.

Answer 1

Cada uno de sus archivos .spec.ts tiene todas sus pruebas agrupadas en el bloque describe así:

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

Puede ejecutar fácilmente este bloque único, con el prefijo del nombre de la función de describe con f :

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

Si tiene dicha función, no se ejecutarán otros bloques de describe . Por cierto. puedes hacer algo similar con it => fit y también hay una versión de "lista negra" - x . Asi que:

• fdescribe and fit hace que solo las funciones marcadas de esta manera se ejecuten
• xdescribe y xit hace que todas las funciones marcadas de esta manera se ejecuten

Answer 2

Configure el archivo test.ts dentro de la carpeta src :

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

Reemplace //.spec/.ts$/ con el nombre del archivo que desea probar. Por ejemplo: /app.component/.spec/.ts$/

Esto ejecutará la prueba solo para app.component.spec.ts .

Answer 3

Esto funciona para mí en Angular 7. Se basa en la opción --main del comando ng. No estoy seguro de si esta opción no está documentada y posiblemente esté sujeta a cambios, pero funciona para mí. Puse una línea en mi archivo package.json en la sección de scripts. Allí, usando la opción --main de con el comando ng test, especifico la ruta al archivo .spec.ts que quiero ejecutar. Por ejemplo

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

Puede ejecutar el script mientras ejecuta cualquier script de este tipo. Lo ejecuto en Webstorm haciendo clic en "prueba 1" en la sección npm.

Answer 4

Puede probar solo un archivo específico con la CLI angular (el comando ng ) de esta manera:

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

Otros documentos están en https://angular.io/cli/test

Tenga en cuenta que si bien esto funciona para archivos de biblioteca independientes, no funcionará para componentes angulares / servicios / etc. Esto se debe a que los archivos angulares dependen de otros archivos (es decir, src/test.ts en Angular 7). Lamentablemente, la bandera --main no toma múltiples argumentos.

Answer 5

Resolví este problema por mí mismo usando gruñido. Tengo el guión gruñido a continuación. Lo que hace el script es ejecutar el parámetro de línea de comando de la prueba específica y crea una copia de test.ts y coloca este nombre de prueba específico allí.

Para ejecutar esto, primero instale grunt-cli usando:

npm install -g grunt-cli

Ponga las siguientes dependencias grunt en su 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 ejecutarlo, guarde el siguiente archivo grunt como Gruntfile.js en su carpeta raíz. Luego, desde la línea de comandos, ejecútelo como:

grunt --target=app.component

Esto ejecutará app.component.spec.ts.

El archivo Grunt es el siguiente:

/*
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'']);

};

Answer 6

Si desea poder controlar qué archivos se seleccionan desde la línea de comando, logré hacerlo para Angular 7.

En resumen, debe instalar @angular-devkit/build-angular:browser y luego crear un complemento webpack personalizado para pasar la expresión regular del archivo de prueba. Por ejemplo:

angular.json : cambie el generador de pruebas de @angular-devkit/build-angular:browser y configure un archivo de configuración personalizado:

...

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

extra-webpack.config.js : crea una configuración de paquete web que lee la expresión regular desde la línea de comandos:

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 la especificación

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

Luego use lo siguiente para anular el valor predeterminado:

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

Documenté la historia de fondo aquí , disculpas de antemano por tipos y enlaces erróneos. Gracias a la respuesta anterior por @ Aish-Anu por señalarme en la dirección correcta.