Skip to content

Instantly share code, notes, and snippets.

@sleepynate
Created March 22, 2012 01:15
Show Gist options
  • Save sleepynate/2154978 to your computer and use it in GitHub Desktop.
Save sleepynate/2154978 to your computer and use it in GitHub Desktop.
backbone derp?
RedrawCheckbox = Backbone.View.extend({
el: '#redrawCheckbox',
events: {
'click' : 'checkState'
},
checkState: function() {
this.trigger('redrawOnMove', this.$el.is(':checked'));
}
});
/** and in the jasmine spec **/
it('sets state in the analyzer when clicked about whether or not to redraw while dragging sliders', function() {
expect(this.a.sampleslider.redrawOnMove).toBe(false);
expect(this.a.ampslider.redrawOnMove).toBe(false);
$('#redrawCheckbox').click();
//this.a.redrawCheckbox.trigger('click');
expect(this.a.sampleslider.redrawOnMove).toBe(true);
expect(this.a.ampslider.redrawOnMove).toBe(true);
});
<!-- markup -->
<table class="buttonHolder">
<tr>
<td>
<input type="checkbox" id="redrawCheckbox" />
<label for="redrawCheckbox">Check here to allow update
the wave as controls are changed. (Can be very slow on
non-GL browsers!)</label>
</td>
<td>
<input type="button" id="redrawButton" value="Redraw the wave" />
</td>
<td>
<div class="buttonHolder">
<input type="button" id="playback" value="Play" />
</div>
</td>
</tr>
@davemo
Copy link

davemo commented Mar 30, 2012

Change line 16 to

$('#redrawCheckbox').trigger('click'); 

and see if that works.

@davemo
Copy link

davemo commented Mar 30, 2012

Also, recommended reading on the difference between $.fn.trigger and Backbone.Events along with its .trigger

@sleepynate
Copy link
Author

still red :(

@davemo
Copy link

davemo commented Mar 30, 2012

Hmm, I'd need to see how you were stubbing out the markup in a beforeEach or in the test itself. Can you post the full test context including setup/teardown?

@davemo
Copy link

davemo commented Mar 30, 2012

Couple things, any reason why you are binding click events in initialize? Also, are you on gtalk? I'd be tempted to rewrite it as:

RedrawButton = Backbone.View.extend({
    el: '#redrawButton',

    events: {
        'click' : 'redraw'
    },

    initialize: function () {
      this.$el.button();
    },

    redraw: function() {
      this.trigger('redraw');       
    }

  });

@sleepynate
Copy link
Author

a) backbone's wasn't firing for me, so i short-cutted and used jquery's.
2) yes
III) let me see if that magically works

@davemo
Copy link

davemo commented Mar 30, 2012

Here's another option to try and get it to fire in your test.

this.a.redrawCheckbox.$el.trigger('click');

Backbone caches the jQuery wrapped object that represents the DOM node for your view in view.$el

@sleepynate
Copy link
Author

Still red. You can probably see i've been rockin' those cached jQ objects in the previous specs, and I know they both have ridiculously similarly named eventing systems, but it's so weird that view.trigger('click') doesn't trigger view.events['click']'s function :O

@davemo
Copy link

davemo commented Mar 30, 2012

I just cloned the repo, hacking at it :)

@sleepynate
Copy link
Author

The good news is, if you ever need someone to break your JS, call me.

I don't care what @magnusstahre says about you, you're a swell dude.

@davemo
Copy link

davemo commented Mar 30, 2012

Haha :D

@davemo
Copy link

davemo commented Mar 30, 2012

Something is seriously messed up with those views, they aren't getting the normal jQuery event arguments proxied to them....

I even took jquery ui and those extra slider//dragslider plugins out of the equation and it's still borked, hmm.. still hacking :P

@sleepynate
Copy link
Author

sleepynate commented Mar 30, 2012 via email

@davemo
Copy link

davemo commented Mar 30, 2012

First test green, fixing second then i'll give you a pull request with comments on what went wrong.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment