Угловой 2 и Жасмин

Question

Угловой 2 и Жасмин

0

Я слежу за учебником https://angular.io/docs/ts/latest/guide/testing.html, чтобы реализовать Jasmine с Angular 2, используя учебник Tour of Heroes.

Все работает отлично, когда я тестирую "hero.spec". Однако, когда я пытаюсь проверить "app.component.ts" с единичным тестовым файлом, который я назвал "app.spec", система JS не добавляет к нему "js". Я получаю следующие ошибки:

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)

Файл app.spec.ts выглядит следующим образом:

import { AppComponent } from 'app.component';

describe('AppComponent', () => {

let app : AppComponent;

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

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

});

Файл тестового блока выглядит следующим образом:

<!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>

Похоже, что System JS добавляет "js" в "app.spec", но не "app.component" или другие. Может кто-то указать мне верное направление?

благодаря

Christopher Grigg 20 апр. 2016, в 08:16

Источник

1

Можете ли вы попробовать defaultJSExtensions: true в вашем System.config?
eko 20 апр. 2016, в 06:03
0

@echonax действительно, не выглядел достаточно внимательно. Хороший вопрос - держу пари, что это исправляет.
awqueous 20 апр. 2016, в 06:33

Теги:

angular

angularjs

jasmine

systemjs

2 ответа

Ещё вопросы

Можете ли вы попробовать defaultJSExtensions: true в вашем System.config?
@echonax действительно, не выглядел достаточно внимательно. Хороший вопрос - держу пари, что это исправляет.

Thierry Templier · Answer 1 · 2016-04-20T05-51-00.000Z

Я думаю, что вы забыли импортировать некоторые JS файлы в ваш HTML файл, потому что я вижу ошибку 404 для модуля angular2/core. Более того, я не думаю, что вам нужно импортировать модуль, который вы хотите протестировать (app.component), в вашем случае, так как он будет импортирован в ваш тестовый модуль.

Более того, я вижу, что тестовый файл не находится под папкой app так как SystemJS пытается загрузить его через этот URL: http://127.0.0.1:8080/src/test/app.component. Вы настраиваете только папку app. Поэтому инструмент не добавляет к нему расширение js.

Вот что я хотел бы использовать в вашем файле HTML:

<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>

См. Этот plunkr: https://plnkr.co/edit/YAVD4s?p=preview.

Bruno Garcia · Answer 2 · 2016-04-20T04-14-00.000Z

Попробуйте: import { AppComponent } from './app.component' Или если app.component находится в папке приложения:. './app/app.component'. Является ли файл spec в той же папке, что и компонент?