Wie um zu testen, John papa vm.model-unit-Tests mit jasmine?

Ich benutze John papa eckigen style guide mein controller sieht so aus:

folgenden Stil John papa Stil-controller style-guide:

function testController() {

    var vm = this;

    vm.model = { name: "controllerAs vm test" };
}

Mein Test-code sieht folgendermaßen aus:

describe('Controller: testController', function () {

    beforeEach(module('myApp'));

    var testController;

    beforeEach(inject(function ($controller) {
        scope = {};

        testController = $controller('testController', {
        });

    }));

    it('should have vm.model defined and testController.vm.model is equal to controllerAs vm test', function () { 
        expect(testController.vm).toBeDefined();  
        expect(testController.vm.model).toBeDefined();     
        expect(testController.vm.model.name).toEqual("controllerAs vm test");
    });
});

Ergebnis:

Test fehlgeschlagen ist:
Ergebnis-Meldung: Voraussichtlich undefiniert definiert werden.
bei stack

Also meine Frage ist, wie können wir die test-vm.Modell und weitere Variablen aus? Ich habe nicht gefunden ordnungsgemäßen Führung der Linie in der Führung der Linien: Controller

InformationsquelleAutor Utpal Kumar Das | 2015-02-11

Den vm ist gleich der Instanz selbst über vm = this;

Daher, alle Eigenschaften hängen direkt von dem Objekt.

function foo(){
  var vm = this;

  vm.name = 'Josh';
}

var myFoo = new foo();
myFoo.name; //'Josh';

So alle Sie tun müssen ist, ändern Sie Ihre Erwartungen zum entfernen der vm Eigenschaft.

expect(testController).toBeDefined();  
expect(testController.model).toBeDefined();     
expect(testController.model.name).toEqual("controllerAs vm test");

, Um zu beweisen,, hier ist Ihre genaue Beispiel, und die damit verbundenen Jasmine-tests.

JS:

function testController() {

  var vm = this;

  vm.model = {
    name: "controllerAs vm test"
  };
}


angular.module('myApp', [])
  .controller('testController', testController);

describe('Controller: testController', function() {

  beforeEach(module('myApp'));

  var testController;

  beforeEach(inject(function($controller) {
    scope = {};

    testController = $controller('testController', {});

  }));

  it('should have model defined and testController.model.name is equal to controllerAs vm test', function() {
    expect(testController).toBeDefined();
    expect(testController.model).toBeDefined();
    expect(testController.model.name).toEqual("controllerAs vm test");
  });

  it('should not have a property called vm', function() {
    expect(testController.vm).toBeUndefined();
  });
});

HTML:

<link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine-html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/boot.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular-mocks.js"></script>

wie eine Funktion Ihre Antwort aussieht, ok, aber hier mein problem ist, wenn ich das initialisieren der controller-Instanz durch: testController = $controller('testController', { }); dann testController.vm sollte funktionieren, aber funktioniert nicht. Also meine Frage ist an die Jungs, die gearbeitet haben, mit eckigen john papa controller als vm syntax und getestet mit Jasmin.
Unter der Haube $controller ist nur zum telefonieren new(), so dass es funktioniert auf die gleiche Weise.
Ich habe die Arbeit mit den Eckigen für mehrere Jahre jetzt, und haben getan, viele Tests mit Jasmine. Ich versuche zu erklären, dass dies nicht eine Eckige Sache, aber ein JavaScript ein. vm ist nicht eine Eigenschaft, die auf die Steuerung... es ist eine variable, die wird geschlossen, indem der Umfang der Funktionen. Deshalb wird es nie gibt es auf Ihrem controller, wenn verwendet, auf diese Weise. $controller nicht ändern, wie JS arbeitet.
Siehe mein update
ja jetzt verstehe ich vm=testControllerInstance so vm.Variablen sind in testControllerInstance. Vielen Dank für deine Antwort. Super!!!!
Sie sollten akzeptieren, dass diese Antwort?
Die Antwort Josh vorgesehen funktioniert, aber ich fand es nicht notwendig zu gehören: Umfang = {}; Hier ist ein Beispiel, das ich erstellt auf Codepen.

InformationsquelleAutor Josh

testController ist die vm weil Sie var vm = this im controller. So, um Ihr test-code zu ähnlich, um Ihre controller-code, können Sie versuchen, Ihren controller zu vm im test zu statt testController

describe('Controller: testController', function () {
    //we work with "vm" instead of "testController" to have consistent verbiage
    //in test and controller
    var vm;

    beforeEach(module('app'));
    beforeEach(inject(function ($controller) {
        vm = $controller('testController', {}, {});
    }));

    it('should have vm.model defined and testController.vm.model is equal to controllerAs vm test', function () {

        //vm=this in controller
        expect(vm)
            .toBeDefined();

        //Testing primitives
        expect(vm.foo)
            .toBeDefined();
        expect(vm.foo)
            .toEqual('bar');

        //Testing objects
        expect(vm.model)
            .toBeDefined();
        expect(vm.model.name)
            .toEqual("Batman");

        //Testing a method
        expect(vm.greet())
            .toBeDefined();
        expect(vm.greet())
            .toEqual('Hello There');
    });
});

Code für den controller

(function () {
    'use strict';

    angular
        .module('app')
        .controller('testController', testController);

    /* @ngInject */
    function testController() {
        var vm = this;

        //Primitives
        vm.foo = 'bar';

        //Objects
        vm.model = {
            name: 'Batman'
        };

        //Methods
        vm.greet = function () {
            return 'Hello There';
        };
    }
})();

Hoffe, das hilft. Viel Glück.

InformationsquelleAutor Akash

Ich würde erstellen Sie ein neues Modul und injizieren es als Abhängigkeit in die app Modul es einfach zu machen und prüfbar. Testen Sie den controller mit John Papa ' s Style Guide:

(function () {
  'use strict';

  angular
    .module('test')
    .controller('testController', testController);

  function testController() {
    var vm = this;
    vm.model = { name: "controllerAs vm test" };
  }
})();

Die Skillung würde jetzt wie folgt Aussehen:

'use strict';

describe('testController', function() {
  var testController;
  beforeEach(module('test'));

  beforeEach(function () {
    inject(function($injector) {
      testController = $injector.get('$controller')('testController', {});
    });
  });

  it('should have model defined and testController.name is equal to controllerAs vm test', function() {
    expect(testController).toBeDefined();
    expect(testController.name).toEqual("controllerAs vm test");
  });
});

Hoffe, dies hilft jemand auf der Suche nach ähnlichen Lösungen.

InformationsquelleAutor Andrew Lobban

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.