Angular 2 und Jasmine

Ich habe das Tutorial https://angular.io/docs/ts/latest/guide/testing.html zur Implementierung von Jasmine mit Angular 2 mit dem Tour of Heroes Tutorial verfolgt.Angular 2 und Jasmine

Alles funktioniert gut, wenn ich mit "hero.spec" teste. Wenn ich jedoch versuche, "app.component.ts" mit einer Komponententestdatei zu testen, die ich "app.spec" nannte, fügt System JS "js" nicht an es an. Ich erhalte die folgenden Fehler:

angular2-polyfills.js:126 GET http://127.0.0.1:8080/src/test/app.component 404 (Not Found)` 

system.src.js:1068 GET http://127.0.0.1:8080/angular2/core 404 (Not Found)

Die app.spec.ts Datei ist wie folgt:

import { AppComponent } from 'app.component'; 

describe('AppComponent',() => { 

let app : AppComponent; 

beforeEach(() => { 
    app = new AppComponent(); 
}); 

it('true to be true',() => { 
    expect(true).toEqual(true); 
}); 

});

Die Unit-Test-Datei wird wie folgt dar:

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html;charset=utf-8"> 
<title>Ng App Unit Tests</title> 
<link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> 
<script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> 
<script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> 
<script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script> 
</head> 
<body> 
<!-- #1. add the system.js library --> 
<script src="node_modules/systemjs/dist/system-polyfills.js"></script> 
<script src="node_modules/systemjs/dist/system.src.js"></script> 

<script> 
    // #2. Configure systemjs to use the .js extension 
    //  for imports from the app folder 
    System.config({ 
     packages: { 
      'app': {defaultExtension: 'js'} 
     } 
    }); 

    // #3. Import the spec files explicitly 
    Promise.all([ 
      System.import('app/app.spec'), 
      System.import('app/app.component') 
     ]) 

      // #4. wait for all imports to load ... 
      //  then re-execute `window.onload` which 
      //  triggers the Jasmine test-runner start 
      //  or explain what went wrong. 
      .then(window.onload) 
      .catch(console.error.bind(console)); 
</script> 
</body> 
</html>

Es sieht aus wie es ist System JS hängt "js" an "app.spec" an, aber nicht an "app.component" oder andere. Kann mir jemand in die richtige Richtung zeigen?

Dank

Quelle

2016-04-20 Christopher Grigg

Können Sie versuchen, defaultJSExtensions: True in Ihrer System.config? – echonax

@echonax in der Tat, nicht genau genug hinsehen. gute Frage - ich wette, das behebt es. – drewmoore

Versuchen: import { AppComponent } from './app.component' Oder wenn app.component unter App-Ordner ist: './app/app.component'. Befindet sich die Spezifikationsdatei im selben Ordner wie die Komponente?

Quelle

2016-04-20 06:23:14

Ich glaube, dass Sie vergessen haben, einige JS-Dateien in Ihre HTML-Datei zu importieren, weil ich einen 404-Fehler für das Modul angular2/core sehe. Außerdem denke ich nicht, dass Sie das zu testende Modul (app.component) in Ihrem Fall importieren müssen, da es in Ihr Testmodul importiert wird.

Darüber hinaus sehe ich, dass Sie Testdatei nicht unter dem Ordner app befindet, seit SystemJS versucht, es über diese URL zu laden: http://127.0.0.1:8080/src/test/app.component. Sie konfigurieren nur den Ordner app. Deshalb fügt das Tool nicht die Erweiterung js hinzu.

Hier ist, was ich in der HTML-Datei verwenden würde:

<script src="https://code.angularjs.org/2.0.0-beta.7/angular2-polyfills.js"></script> 
<script src="https://code.angularjs.org/tools/system.js"></script> 
<script src="https://npmcdn.com/[email protected]/lib/typescript.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.7/Rx.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.7/angular2.dev.js"></script> 
<script src="https://code.angularjs.org/2.0.0-beta.7/testing.dev.js"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.js"></script> 

<script> 
    System.config({ 
    packages: { 
     app: { 
     defaultExtension: 'js' 
     } 
    } 
    }); 
    System.import('angular2/src/platform/browser/browser_adapter') 
    .then(function(browser_adapter) { browser_adapter.BrowserDomAdapter.makeCurrent(); }) 
    .then(function() { 
     System.import('app/foo.bar.spec') 
     .then(null, console.error.bind(console)) 
     .then(window.onload); 
    }) 
</script>

Sehen Sie diese plunkr: https://plnkr.co/edit/YAVD4s?p=preview.

Quelle

2016-04-20 07:21:25

Angular 2 und Jasmine

Antwort

Verwandte Themen