How do I declare a variable in a specific scope in coffeescript?

Question

I'm trying to write a jasmine test in coffeescript that uses a beforeEach block. This runs into a problem with coffeescript's variable scoping. Here's what I'd like to write:

describe 'PhoneDetailCtrl', () ->
  beforeEach () ->
    scope = angular.scope()
    $browser = scope.$service('$browser')

  it 'should fetch phone detail', () ->
    scope.params = {phoneId:'xyz'}
    $browser.xhr.expectGET('phones/xyz.json').respond({name:'phone xyz'})
    ctrl = scope.$new(PhoneDetailCtrl)

    expect(ctrl.phone).toEqualData({})
    $browser.xhr.flush()

    expect(ctrl.phone).toEqualData({name:'phone xyz'})

This doesn't work, though, because the scope and $browser will get declared with var in the innermost scope. That is, once in the beforeEach and then again in the it block. I can force the variables to be declared in the right scope by initializing them, but this seems very strange:

describe 'PhoneDetailCtrl', () ->
  $browser = {}
  scope = {}
  beforeEach () ->
    scope = angular.scope()
    $browser = scope.$service('$browser')

  it 'should fetch phone detail', () ->
    scope.params = {phoneId:'xyz'}
    ...

This works, but the javascript it compiles to is actually

describe('PhoneListCtrl', function() {
  var $browser, ctrl, scope;
  $browser = {};
  ctrl = {};
  scope = {};

where all I need is the line var $browser, ctrl, scope;. Can I write this more concisely in coffeescript?

I think it's fine to keep the initializer at the top like that. — , Nov 04 '11 at 06:29

score 30 · Accepted Answer · edited Sep 25 '15 at 15:06

You are doing it the right way.

This is described in the CoffeeScript documentation. I wouldn't worry about the JS that it creates. Yes, it is a bit messy if you were to write it yourself, but this is one of the things that you have to live with when you use a re-writer like CoffeeScript.

You do, however, have a couple of options which are pretty nice.

You can put the variables in the current context if you wish (which happens to be your jasmine.Spec object for the curious, so it is a relatively safe and appropriate place to be putting variables... just don't overwrite existing vars in the context.):

describe 'PhoneDetailCtrl', () ->
  beforeEach () ->
    @scope = angular.scope()
    @$browser = @scope.$service('$browser')

it 'should fetch phone detail', () ->
  @scope.params = {phoneId:'xyz'}
  #... etc

You can also setup your own variable in which to store things

describe 'PhoneDetailCtrl', () ->
  setup = {}

  beforeEach () ->
    setup.scope = angular.scope()
    setup.$browser = setup.scope.$service('$browser')

  it 'should fetch phone detail', () ->
    setup.scope.params = {phoneId:'xyz'}
    #... etc

Felix Tjandrawibawa · Answer 2 · 2016-02-05T00:32:37.333

10

Your test could be written like the following:

describe "MyGame", ->
    mygame = null
    beforeEach inject (_MyGame_) ->
        mygame = _MyGame_

    it "should have two players", ->
        expect(mygame.opponents.length).toEqual 2

Much cleaner syntax - without the need to make things global.

edited Feb 05 '16 at 00:32

answered Aug 16 '12 at 00:44

Felix Tjandrawibawa

492
5
12

4

You can also use `a = b = c = d = null` for spare lines. The variables won't affect each other (as opposed to if you'd assign them to `{}`) – Fluffy Feb 08 '13 at 17:01
You link's dead. I'm not sure if/where it is now, or I'd suggest an edit. – StackExchange What The Heck Sep 25 '15 at 14:43

How do I declare a variable in a specific scope in coffeescript?

2 Answers2

Linked