Unit test karma with browser phantomJS doesn't support import inheritance

Question

I met this issue when unit testing with phantomjs. That's I think the browser phantomjs doesn't support import inheritance. Here is the issue detail:

Environment:

karma 1.5.0
phantomjs: 2.1.1 (using as browser)

And I have these model classes:

base.model.ts

export class BaseModel {
    id?: number;
    name?: string;
}

customer.model.ts

import { BaseModel  } from './base.model';

export class CustomerModel extends  BaseModel {
    address?: string;
    // more properties defined
}

home.model.ts

import { BaseModel  } from './base.model';
import { CustomerModel } from './customer.model';

export class HomeModel extends  BaseModel {
    param1: CustomerModel;

    constructor(data?: any) { // write some logic in here }
}

home.service.ts

import { Injectable } from '@angular/core';
import { Home } from './home.model';

@Injectable()
export class HomeService {
    constructor(){  }

    get() {
        let home = new HomeModel();
    }
}

Steps to reproduce the behaviour

Write the unit test for function get() of HomeService (home.service.ts)
Run the unit test: npm run test will excute karma start config/karma.conf.js

Error

PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR TypeError: undefined: can't set as prototype!

Root cause: After days of investigating, I have found that the issue just happend when unit test going through new HomeModel(). And then its related to the BaseModel with extends, I think when we new HomeModel(), it initialized the the BaseModel first (import will run from top to bottom), then CustomerModel is initialized after that. In CustomerModel, it still have import BaseModel to extends.

am0wa am0wa · Accepted Answer · 2017-08-10T14:42:28

Faced with the same problem with "typescript": "2.4.0":

Updated the following dependencies and it's helped:

"@types/core-js": "0.9.42",
"html-loader": "^0.5.1",
"jasmine": "^2.7.0",
"jasmine-core": "^2.7.0",
"karma": "^1.7.0",
"karma-webpack": "^2.0.4",

Unit test karma with browser phantomJS doesn't support import inheritance

1 Answers