web-dev-qa-db-ja.com

Karma / Jasmineテストからの外部ファイルの読み込み

JSONファイルを検証するために(KarmaとIntelliJ 13を使用して)Jasmineテストを実行しようとしています。理想的には、テストではJSONファイルをデータオブジェクトに単純に読み込み、解析して有効なフォーマットとデータを確認します。前後に関数を検証する必要も、サーバーに対してテストする必要もありません。

私の基本的なセットアップは次のとおりです。

it("should load an external file", function(){
var asyncCallComplete, result,
            _this = this;
        // asyncCallComplete is set to true when the ajax call is complete
        asyncCallComplete = false;

        // result stores the result of the successful ajax call
        result = null;

        // SECTION 1 - call asynchronous function
        runs(function() {
            return $.ajax('/test/config.json', {
                type: 'GET',
                success: function(data) {
                    asyncCallComplete = true;
                    result = data;
                },
                error: function() {
                    asyncCallComplete = true;
                }
            });
        });

        // SECTION 2 - wait for the asynchronous call to complete
        waitsFor(function() {
            return asyncCallComplete !== false;
        }, "async to complete");

        // SECTION 3 - perform tests
        return runs(function() {
            return expect(result).not.toBeNull();
        });
}

問題は、どのパスを使用しても404エラーが発生し、ファイルがロードされないことです。このテストサービスを使用して、リモートサーバーから外部JSON結果をロードしようとしました。

http://date.jsontest.com/

そして、これは機能します。

テストファイルの名前は/test/mySpec.jsで、karma.conf.jsファイルはルートにあります。 JSONファイルをこれらすべての場所に移動しましたが、運はありません。私は何を間違えていますか?

回答付き更新:

以下の回答に従って、これをkarma.conf.jsに追加しました。

// fixtures
{ pattern: 'test/*.json',
    watched: true,
    served:  true,
    included: false
}

次に、次のようにテストを作成しました。

    var json:any;
    it("should load a fixture", function () {
        jasmine.getFixtures().fixturesPath = "base/test/"
        var f = readFixtures("registration.json");
        json = JSON.parse(f);
        expect(json).toBeDefined();

    })

    it("should have a title", function () {
        expect(json.title).toNotBe(null);
    })
    etc...

そしてそれは通ります。

24
AlexB

JSONファイルをkarma.config.js経由で提供していますか?

フィクスチャを介してJSONファイルを提供できます。

files: [
      // angular 
      'angular.min.js',
      'angular-route.js',
      'angular-mocks.js',

      // jasmine jquery helper
     'jquery-1.10.2.min.js',
     'jasmine-jquery.js',

      //  app
      '../../public/js/app.js',

      // tests
      '*-spec.js',

      // JSON fixture
      { pattern:  '/test/*.json',
        watched:  true,
        served:   true,
        included: false }
    ],
20
jsplaine

フィクスチャを介してJSONを提供するのが最も簡単ですが、セットアップのために簡単に行うことができなかったため、代替ヘルパー関数を作成しました。

インストール

bower install karma-read-json

使用法

  1. Karma-read-json.jsをKarmaファイルに入れます。例:

    files = [
    ...
    'bower_components/karma-read-json/karma-read-json.js',
    ...
    ]
    
  2. JSONがKarmaによって提供されていることを確認してください、例:

    files = [
    ...
    {pattern: 'json/**/*.json', included: false},
    ...
    ]
    
  3. テストでreadJSON関数を使用します。例:

    var valid_respond = readJSON('json/foobar.json');
    $httpBackend.whenGET(/.*/).respond(valid_respond);
    
7
PizzaPanther

HTMLファイルをロードしようとしていて、jasmine-jqueryの使用を避けたい場合は、karma-ng-html2js-preprocessorを利用できます。

karma.conf.jsで:

// generate js files from html templates
preprocessors: {
    'resources/*.html': 'ng-html2js'
},

files: [
    ...
    'resources/*.html'
],

plugins: [
    ...
    'karma-ng-html2js-preprocessor'
],

あなたのジャスミンの仕様では:

beforeEach(module('resources/fragment.html'));

var $templateCache;
beforeEach(inject(function (_$templateCache_) {
    $templateCache = _$templateCache_;
}));

describe('some test', function () {
    it('should do something', function () {
        // --> load the fragment.html content from the template cache <--
        var fragment = $templateCache.get('resources/fragment.html');
        expect(fragment).toBe(...);
    });
});
2
Siggen

Jsonファイルを単に要求し、テストでグローバル変数として保存しようとしましたか?

私は今、Angular2プロジェクトを開発しています(Angular CLIを使用)。このセットアップで動作します:

// On the very beginning of the file let mockConfig = require('./test/config.json');

0