ReferenceError: Can't find variable: $ when running JasmineHeadlessWebkit

Question

I've been trying to find an answer to this at least for the last two hours without any luck. I hope someone here might be able to help.

I'm getting this ReferenceError: Can't find variable: $ when running my Jasmine specs using the JasmineHeadlessWebkit.

The weird thing is, this only happens when I say

$ ->
  game.init()

in my game.coffee file.

I can use the $ without any problems further down game.coffee. For example:

window.game =
  init: ->
    $('.gamelayer').hide()
    $('#gamestartscreen').show()

This is no problem at all.

Also, the tests work okay in Chrome.

So, I'm assuming this has to do with jQuery not being loaded in time but I can't figure out why.

I have jQuery in specs/javascripts/helpers/ and in jasmine.yml i'm mentioning the helpers before the spec_files and src_files but that doesn't seem to really make a difference.

So, if anyone has any idea how I can make sure that jQuery is completely loaded when Jasmine's specs are run, I would really appreciate any help.

Also, please let me know if you need any additional information.

Thank you.

Freckly

The error you are getting suggests that jQuery is not included at that point in the code. Are you including jQuery before that script? – Gametocyte

Answer 1

you can try two solution:

the first one delay the game.init() waiting for jQuery to be loaded:

function initJQuery() {
    if (typeof(jQuery) == 'undefined') {
        setTimeout("initJQuery()", 50);
    } else {
        game.init();
    }
}

the second one calls a jQuery function that prevent conflicts with the library (run it at the beginning of your code):

jQuery.noConflict()

you can try but i'm not sure it's the best solution in your case. Pay attention to use this solution, you'll have to change all '$' to 'jQuery'

Goodden

Thanks. The first thing you mentioned works but I consider this more to be a workaround than a real solution. I want to game.init() when the document is ready ( $(document).ready -> which is long for $ -> ), not at some time when jQuery has fully loaded. It should just be loaded and available before game.coffee is loaded and calls $ -> Thanks for your effort, though! – Freckly

Answer 2

I ran into this problem also. I fixed it by changing my jasmine.yml to load jquery before it loads the rest of the javascript files:

src_files:
  - public/js/jquery.js
  - public/js/**/*.js

Convexity