Skip to content

socket.io error on connect: Error: xhr poll error in Angular 2 with Nativescript using jasmine #606

@magar91

Description

@magar91

I recently updated my nativescript-Angular 2 project and wanted to refactor my testing code, the initial import required for the test to run no longer works:

import "nativescript-angular/aplication"

now I have to add an import for "reflect metadata" and zone.js I managed this by adding the following import to my spec.ts file

import "reflect-metadata"

and changed my karma.conf.js file like this:

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
      'app/**/*.js',

      'node_modules/zone.js/dist/zone.js',
      'node_modules/zone.js/dist/zone-node.js',
      'node_modules/zone.js/dist/long-stack-trace-zone.js',
      'node_modules/zone.js/dist/proxy.js',
      'node_modules/zone.js/dist/sync-test.js',
      'node_modules/zone.js/dist/jasmine-patch.js',
      'node_modules/zone.js/dist/async-test.js',
      'node_modules/zone.js/dist/fake-async-test.js',
    ],


    // list of files to exclude
    exclude: [
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: [],

    customLaunchers: {
      android: {
        base: 'NS',
        platform: 'android'
      },
      ios: {
        base: 'NS',
        platform: 'ios'
      },
      ios_simulator: {
        base: 'NS',
        platform: 'ios',
        arguments: ['--emulator']
      }
    },

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  })
}

this is my spec file:

import "reflect-metadata";
import { Http, Headers, HttpModule, XHRBackend, 
        BaseRequestOptions, Response, 
        ResponseOptions, RequestMethod } from '@angular/http';
import { MockBackend, MockConnection } from '@angular/http/testing';
import { LoginService } from '../../shared/login-service/login-service.service';
import { User } from '../../shared/user/user.model';
import { Config } from '../../shared/config';
import { inject, async, ComponentFixture, TestBed, 
        fakeAsync, getTestBed } from '@angular/core/testing';

describe('LoginService test', () => {
    let login : LoginService = null;
    let backend : MockBackend = null;
    let config = new Config();

    beforeEach(async(() => {
        TestBed.configureTestingModule({
            providers: [
                LoginService,
                BaseRequestOptions,
                {
                    provide: Http,
                    deps: [MockBackend, BaseRequestOptions],
                    useFactory:
                        (backend: MockBackend, defaultOptions: BaseRequestOptions) => {
                            return new Http(backend, defaultOptions);
                        }
                }
            ],
            imports: [
                HttpModule
            ]
        });

        TestBed.compileComponents();
    }));

    beforeEach(inject([LoginService, MockBackend], (userService: LoginService, mockBackend : MockBackend) => {
        login = userService;
        backend = mockBackend;
    }));
    
    it("should return token at succesful login",async(() =>{
        backend.connections.subscribe((connection: MockConnection) => {
            let options = new ResponseOptions({
                body: JSON.stringify({ token: "success" })
            });
            connection.mockRespond(new Response(options));
        });

        let user = new User();
        user.username = "admin";
        user.password = "password";
        login
            .login(user)
            .subscribe((response) => {
                expect(response).toEqual({ token: "success" })
            })
    }));

I get the following error in my console:

JS: NSUTR-socket.io: transport error
JS: NSUTR-socket.io: 1
JS: NSUTR: socket.io error on connect: Error: xhr poll error
JS: NSUTR-socket.io: 2
JS: NSUTR: socket.io error on connect: Error: xhr poll error
JS: NSUTR-socket.io: 3
JS: NSUTR: socket.io error on connect: Error: xhr poll error
23 12 2016 09:09:15.516:WARN [NativeScript / 23 (6.0; Samsung Galaxy S7)]: DiscoNativeScript / 23 (6.0; Samsung Galaxy S7) ERROR
  Disconnected, because no message in 10000 ms.
NativeScript / 23 (6.0; Samsung Galaxy S7): Executed 0 of 0 DISCONNECTED (10.005NativeScript / 23 (6.0; Samsung Galaxy S7): Executed 0 of 0 DISCONNECTED (10.005 secs / 0 secs)
JS: NSUTR-socket.io: 4
JS: NSUTR: socket.io error on connect: Error: xhr poll error

I've tried other solutions like this one, and wrote the spec as suggested in these examples angular 2 testing guide and angular 2 services with jasmine

any idea how to fix this?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions