Configurer Karma pour une librairie angulaire

Question

Je suis en train de construire une librairie Angular, et je voulais pouvoir faire quelques tests. Après avoir suivi les instructions these, j'ai réussi à tout mettre en place correctement et effectivement être en mesure d'exécuter mes tests.

question principale

Bien que tout fonctionne correctement il arrive quelque chose maladroit. Lorsque je cours npm test à côté de chaque fichier .ts un fichier .js est généré. Normalement, tous les fichiers d.ts et les gros fichiers .js vont dans un dossier dist qui utilise l'utilisation de la bibliothèque. Donc, quelqu'un sait d'où pourraient ces fichiers javascript sont générés, et si elles sont en effet nécessaires, puisque tout ce code existe déjà pour ainsi dire dans le dossier dist.

Bonus question

pas aussi important que ce qui précède, tous les résultats des tests sont affichés dans le terminal, alors que le navigateur affiche uniquement:

Karma v1.4.1 - connecté Chrome 61,0. 3163 (Mac OS X 10.12.6) est inactif

Alors, y a-t-il une solution pour afficher mon test aussi bien que le angular-cli est prêt à l'emploi?

Note qu'après avoir fait mes devoirs, je n'ai pas trouvé quelque chose de relatif en ligne, et je ne veux pas télécharger un tas de jsons désagréables. Si quelqu'un a une idée sur la direction du problème, je serai heureux d'inclure le code.

La structure de base de ma bibliothèque a été générée par this

Edit: karma.config.js

module.exports = function(config) { 
    config.set({ 
    basePath: '', 
    frameworks: ['jasmine', 'karma-typescript'], 
    files: [ 
    'init-test-bed.spec.ts', 
    'src/**/*.ts' 
    ], 
    exclude: [ 
    ], 
    preprocessors: { 
     '**/*.ts': ['karma-typescript'] 
    }, 

    karmaTypescriptConfig: { 
     bundlerOptions: { 
     entrypoints: /\.spec\.ts$/, 
     transforms: [ 
     require('karma-typescript-angular2-transform') 
     ] 
    }, 

    compilerOptions: { 
     lib: ['ES2015', 'DOM'] 
    } 
}, 
    reporters: ['progress', 'karma-typescript'], 
    port: 9876, 
    colors: true, 
    logLevel: config.LOG_INFO, 
    autoWatch: true, 
    browsers: ['Chrome'], 
    singleRun: false, 
    concurrency: Infinity 
}) 
} 

tsconfig.json

{ 
    "compilerOptions": { 
    "baseUrl": "./src", 
    "experimentalDecorators": true, 
    "moduleResolution": "node", 
    "rootDir": "./src", 
    "target": "es5", 
    "typeRoots": [ 
     "node_modules/@types" 
    ], 
    "lib": [ 
     "es2015", 
     "dom" 
    ], 
    "skipLibCheck": true, 
    "types": [ 
     "jasmine", 
     "node" 
    ] 
    } 
} 

Enfin, les test exécute ce script

"test": "tsc && karma start" 

Answer 1

Vous obtenez le fichier .js pour chaque fichier .ts en raison de votre configuration dactylographiée. Vous pouvez modifier votre configuration dans tsconfig.json pour indiquer au compilateur que vous écrivez un seul fichier ou dans un dossier et y ajoutez tous les scripts.

"outDir": "../out-tsc/spec" -> ajoutera tous les fichiers javascript de sortie dans un seul dossier.

Pour votre deuxième question, Lorsque le karma s'exécute en interne, il exécute webdriver et se connecte au navigateur. C'est la raison pour laquelle vous voyez localhost:9876 ou une URL similaire ouverte avec un bouton de débogage à droite. Pendant que le webdriver est en cours d'exécution, vous pouvez également déboguer toute situation de bogue dans le navigateur et bien plus encore.