标签: karma-jasmine

如何降低给定代码段的复杂性？我在 Sonarqube 中收到此错误---> 重构此方法以将其认知复杂度从 21 降低到允许的 15。

this.deviceDetails = this.data && {...this.data.deviceInfo} || {};
    if (this.data && this.data.deviceInfo) {
      this.getSessionInfo();
      // tslint:disable-next-line: no-shadowed-variable
      const { device, driver, ipAddress, port, active, connectionType } = this.data.deviceInfo;
      this.deviceDetails = {
        name: device.name || '',
        manufacturer: device.manufacturer || '',
        deviceType: device.deviceType || '',
        model: device.model || '',
        description: device.description || '',
        managerId: device.deviceManager && device.deviceManager.managerId || null,
        locationId: device.location && device.location.locationId || null,
        active: device.active,
        connectionType: connectionType || null,
        driver_id: driver && driver.driverId || …

节点和npm的最新版本导致运行业力的问题.当我尝试安装karma-cli时,npm i -g karma karma-cli我收到以下警告:

npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents@1.0.8
npm WARN optional Skipping failed optional dependency /gulp-karma/chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents@0.2.1

当我尝试运行时karma test,我得到以下错误:

"C:\Program Files\nodejs\node.exe" "C:\Program Files (x86)\JetBrains\WebStorm 11.0.3\plugins\js-karma\js_reporter\karma-intellij\lib\intellijServer.js" --karmaPackageDir=C:\Users\xxx\AppData\Roaming\npm\node_modules\karma --configFile=C:\Users\xxx\Documents\project\karma.conf.js
26 02 2016 11:24:07.871:WARN [plugin]: Cannot find plugin "karma-chrome-launcher".
  Did you forget to install it ?
  npm install karma-chrome-launcher --save-dev
26 …

我的组件中有一个包含a的close函数 setTimeout()以便给动画完成时间.

public close() {
    this.animate = "inactive"
    setTimeout(() => {
       this.show = false
    }, 250)
}

this.show 必然是一个 ngIf.

this.animate 绑定动画.

我有一个需要测试此功能的测试

it("tests the exit button click", () => {
  comp.close()
  fixture.detectChanges()
  //verifies the element is no longer in the DOM
  const popUpWindow = fixture.debugElement.query(By.css("#popup-window"))
  expect(popUpWindow).toEqual(null)
})

如果有的话,你如何正确测试这个功能？ setTimeout()？

我正在使用,jasmine.clock().tick(251)但窗户永远不会消失.对此有何想法？

如何使用karma和jasmine对Angular 2.0.0版中的路由器进行单元测试？

这是我的旧单元测试在版本2.0.0-beta.14中的样子

import {
  it,
  inject,
  injectAsync,
  beforeEach,
  beforeEachProviders,
  TestComponentBuilder
} from 'angular2/testing';

import { RootRouter } from 'angular2/src/router/router';
import { Location, RouteParams, Router, RouteRegistry, ROUTER_PRIMARY_COMPONENT } from 'angular2/router';
import { SpyLocation } from 'angular2/src/mock/location_mock';
import { provide } from 'angular2/core';

import { App } from './app';

describe('Router', () => {

  let location, router;

  beforeEachProviders(() => [
    RouteRegistry,
    provide(Location, {useClass: SpyLocation}),
    provide(Router, {useClass: RootRouter}),
    provide(ROUTER_PRIMARY_COMPONENT, {useValue: App})
  ]);

  beforeEach(inject([Router, Location], (_router, _location) => {
    router = _router;
    location = …

当我尝试测试角度分量时,我遇到以下错误:

运行jest测试时出错:

Can't bind to 'matMenuTriggerFor' since it isn't a known property of 'button'.

这是我的HTML:

<button mat-button [matMenuTriggerFor]="menu">Menu</button>
<mat-menu #menu="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
</mat-menu>`

我"@angular/material": "6.1.0",在我的package.json中使用.我也进口的所有必要的材料依赖于beforeAll块下TestBed 我也试着更改按钮的特性matMenuTriggerFor来mat-menu-trigger-for.它没用.

请建议我如何修复此测试.

这不是我第一次遇到"1 timer(s) still in the queue"，但通常我会找到某种方法使用tick()或detectChanges()等来摆脱它。

下面的测试工作正常，直到我尝试测试我知道应该抛出异常的条件：

  it('should be able to change case', fakeAsync(() => {
    expect(component).toBeTruthy();

    fixture.whenStable().then(fakeAsync(() => {
      component.case = 'lower';
      fixture.autoDetectChanges();
      tick(500);
      const input = fixture.nativeElement.querySelector('input') as HTMLInputElement;
      typeInElement('abcDEF', input);
      fixture.autoDetectChanges();
      tick(500);
      expect(component.text).toEqual('abcdef');

      component.case = 'upper';
      fixture.autoDetectChanges();
      tick(500);
      typeInElement('abcDEF', input);
      fixture.autoDetectChanges();
      tick(500);
      expect(component.text).toEqual('ABCDEF');

      // Everything above works fine. Here's where the trouble begins
      expect(() => {
        component.case = 'foo';
        fixture.autoDetectChanges();
        tick(500);
      }).toThrowError(/Invalid case attribute/);
    }));
  }));

我正在测试的是一个 Angular 组件，它是 Material 输入字段的包装器。该组件有许多可选属性，其中大多数只是常见输入字段功能的传递属性，但也有一些自定义属性，例如我在上面测试的用于大写/小写转换的属性。 …

我有一个跟随控制器:

.controller('ProjectUserAddCtrl', ['$scope', 'ProjectUser', '$q', 'i18nNotifications',     
function($scope, ProjectUser, $q, i18nNotifications) {
    var buildUnassignedUsers = function(users, project) {
        var unassignedUsers = [];
        angular.forEach(users, function(user) {
            var match;
            angular.forEach(project.projectUsers, function(projectUser) {
                if(match) {return;}
                if(projectUser.user.id === user.id) {
                    match = true;
                }
            });

            if(!match) {
                unassignedUsers.push(user);
            }
        });

        $scope.unassignedUsers = unassignedUsers;
    };     

    $q.all([
            $scope.users,
            $scope.project
    ]).then(function(result) {
            buildUnassignedUsers($scope.users, $scope.project);
            $scope.$watch('project', function(newVal) { 
                buildUnassignedUsers($scope.users, $scope.project); }, true
            );
    });
}]);

并在茉莉花中进行以下测试:

describe('ProjectUserAddCtrl', function() {
    var ctrl;
    beforeEach(function(){
        $scope.users = [];
        $scope.project = {
            projectUsers: …

我对使用Jasmine和Karma的5角单元测试存在问题.

错误是:"无法绑定到'fruits',因为它不是'my-component2'的已知属性".

单元测试代码是:

SRC /应用/组件/我-COMPONENT1 /我-component1.component.spec.ts:

import { TestBed, inject, ComponentFixture, async} from '@angular/core/testing';
import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';

import { Post } from '../../models/post.model';

import { MyComponent1Component } from './my-component1.component';
import { MyService1Service } from '../../services/my-service1.service';

import { HttpClientModule, HttpClient,HttpHandler } from '@angular/common/http';
import {fruit} from '../../Models/fruit';


fdescribe('MyComponent1Component', () => {
  let component: MyComponent1Component;
  let fixture: ComponentFixture<MyComponent1Component>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ MyComponent1Component ],
      imports: [],
      providers: [MyService1Service, HttpClient, HttpHandler, HttpTestingController]
    })

    .compileComponents();
  }));

  beforeEach(async(() => {
    fixture …

编辑:本文末尾的快速和肮脏的解决方案

我正在使用AngularUI-Bootstrap中的模态窗口,就像在网站上解释的那样,除了我分割文件.因此我有:

CallingController.js:

$scope.delete = function () {
    if ($scope.selected.length > 0) {
        // [...]
        // preparing data
        // [...]
        var modalInstance = $modal.open({
            templateUrl: 'views/modalView.html',
            controller: 'modalCtrl',
            resolve: {
                itemArray: function () {
                    return $scope.selected;
                }
            }
        });
        modalInstance.result.then(function (confirm) {
            if (confirm === true) {
                // [...]
                // treat
                // [...]
            }
        });
    }
};

modalController.js:

myAppControllers.controller('modalCtrl',
    function ($scope, $modalInstance, itemArray) {

        $scope.accept = function () {
            $modalInstance.close(true);
        };

        $scope.reject = function () {
            $modalInstance.close(false);
        };

        $scope.itemArray = …

鉴于以下代码,我尝试测试ngOnChangesAngular2 的生命周期钩子:

import {
    it,
    inject,
    fdescribe,
    beforeEachProviders,
} from '@angular/core/testing';

import {TestComponentBuilder} from '@angular/compiler/testing';

import {Component, OnChanges, Input} from '@angular/core';

@Component({
    selector: 'test',
    template: `<p>{{value}}</p>`,
})
export class TestComponent implements OnChanges {
    @Input() value: string;

    ngOnChanges(changes: {}): any {
        // should be called
    }
}

fdescribe('TestComponent', () => {
    let tcb: TestComponentBuilder;

    beforeEachProviders(() => [
        TestComponentBuilder,
        TestComponent,
    ]);

    beforeEach(inject([TestComponentBuilder], _tcb => {
        tcb = _tcb;
    }));

    it('should call ngOnChanges', done => {
        tcb.createAsync(TestComponent).then(fixture => {
            let testComponent: …