Search code examples
angularjasminekarma-jasmineangular6jasmine-jquery

Angular6 Jasmine TypeError: expect(...).toBeVisible is not a function


Setting up jasmine-query-matches in angular6

On angular 5 project it looks at simple as

import { } from 'jasmine-jquery/lib/jasmine-jquery';
import { } from 'jasmine-jquery-matchers';
import * as $ from 'jquery';

On angular 6 i have tried the following

import {} from "jasmine-jquery/lib/jasmine-jquery" ;
import {} from "jasmine-jquery-matchers/dist/jasmine-jquery-matchers" ;
import { } from "karma-jasmine-jquery";
import * as $ from 'jquery';

OR

import {} from "jasmine-jquery" ;
import {} from "jasmine-jquery-matchers" ;
import { } from "karma-jasmine-jquery";
import * as $ from 'jquery';

Usage as follows

imagesEL = fixture.debugElement.query(By.css('.cycle'));

and

expect(imagesEL).toBeVisible();

or

expect(imagesEL.nativeElement).toBeVisible();

But every thing seems to be giving the same error

TypeError: expect(...).toBeVisible is not a function

Thanks for helping

Sample Code : https://stackblitz.com/edit/ng-test-tobevisible?file=app/hello.component.spec.ts


Solution

  • try to use this as your imports

    import "jasmine-jquery/lib/jasmine-jquery" ;
    import "jasmine-jquery-matchers/dist/jasmine-jquery-matchers" ;
    import "karma-jasmine-jquery";
    import 'jquery';
    

    Please note that jasmine-jquery-matchers does not have a default export