Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Failed: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'ng:///DynamicTestModule/module.ngfactory.js'. #262

Closed
AugusDogus opened this issue Jul 28, 2017 · 4 comments

Comments

@AugusDogus
Copy link

AugusDogus commented Jul 28, 2017

I followed your tutorial on your blog and did not run into any errors, but when trying to replicate the steps in my current project I am.

When trying to setup the most basic test for home.ts

import { Component } from '@angular/core';
import { WelcomeSegmentComponent } from '../../components/welcome-segment/welcome-segment';

@Component({
  selector: 'page-home',
  templateUrl: './home.html',
})

export class HomePage {

  constructor() {}

  ionViewDidLoad() {

  }

}

using the basic test laid out on your blog post

import { ComponentFixture, async } from '@angular/core/testing';
import { TestUtils }               from '../../test';
import { HomePage }                from './home';
import { WelcomeSegmentComponent } from "../../components/welcome-segment/welcome-segment";

let fixture: ComponentFixture<HomePage> = null;
let instance: any = null;

describe('Pages: HomePage', () => {

    beforeEach(async(() => TestUtils.beforeEachCompiler([HomePage, WelcomeSegmentComponent]).then(compiled => {
        fixture = compiled.fixture;
        instance = compiled.instance;
    })));

    it('should create the home page', async(() => {
        expect(instance).toBeTruthy();
    }));
});

I receive the error Failed: Uncaught (in promise): Error: No provider for UserProvider!

In my attempts to troubleshoot I included the testbed config inline in my test to add UserProvider to the list of providers.

import { ComponentFixture, async, TestBed } from '@angular/core/testing';
import { App, Platform, Form, Keyboard, MenuController, NavController, Config, IonicModule } from "ionic-angular";
import { ConfigMock } from "ionic-mocks";
import { FormsModule, ReactiveFormsModule} from "@angular/forms";
import { HomePage }                from './home';
import { WelcomeSegmentComponent } from "../../components/welcome-segment/welcome-segment";
import { UserProvider } from "../../providers/user/user";


let fixture: ComponentFixture<HomePage> = null;
let instance: any = null;

describe('Pages: HomePage', () => {

    let fixture = null;
    let instance = null;

    beforeEach(async(() => {

        TestBed.configureTestingModule({
            declarations: [HomePage, WelcomeSegmentComponent],
            providers: [
                App, Platform, Form, Keyboard, MenuController, NavController, UserProvider,
                {provide: Config, useFactory: () => ConfigMock.instance()},
            ],
            imports: [
                FormsModule,
                IonicModule,
                ReactiveFormsModule,
            ],
        })
            .compileComponents().then(() => {
            fixture = TestBed.createComponent(HomePage);
            instance = fixture;
            fixture.detectChanges();
        });
    }));

    it('should create the home page', async(() => {
        expect(instance).toBeTruthy();
    }));
});

Having done this I now receive the error Failed: Uncaught (in promise): Error: No provider for DomController! and so I add that to the list of providers in the same way I did with UserProvider.

Following this I end up with the error Failed: Failed to execute 'send' on 'XMLHttpRequest': Failed to load 'ng:///DynamicTestModule/module.ngfactory.js'.

I've redone these steps with minor differences here and there, but I always end up with the same error at the end. I'm not sure if I should be stubbing/mocking these components or services or if I'm completely off trail.

I'm very new to Angular, Jasmine, and testing in general. Any help offered would be much appreciated.

@lathonez
Copy link
Owner

Hey,

Please see #191.

Thanks

@titusfx
Copy link

titusfx commented Nov 20, 2017

Generally you can check the real error if you do:

ng test -sm=false

instead of

ng test

sm stands for sourcemap

Sometimes even that doesn't work and you need to set a breakpoint just before the exception and execute on the browser console and you receive the real error

NicMcPhee added a commit to UMM-CSci-3601/3601-lab4_mongo-pre-S20 that referenced this issue Feb 22, 2018
[This post](lathonez/clicker#262 (comment))
suggested that adding this flag would improve the usefulness of
stack traces from failed tests, and it did!
@lukasholzer
Copy link

the flag -sm=false is now --source-map=false

@lanshunfang
Copy link

Try my solution:

https://stackoverflow.com/a/55039841/931908

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants