Testing Marionette.js Behaviors

13
1 TESTING TESTING MARIONETTE.JS MARIONETTE.JS BEHAVIORS BEHAVIORS

Transcript of Testing Marionette.js Behaviors

1

TESTINGTESTING MARIONETTE.JS MARIONETTE.JS BEHAVIORSBEHAVIORS

3 . 1

WHAT IS THAT, WHAT IS THAT, BEHAVIORSBEHAVIORS??> A LITTLE CHECK-UP> A LITTLE CHECK-UP

3 . 2

FROM ZE DOCSFROM ZE DOCS

http://marionettejs.com/docs/v2.4.3/marionette.behavior.html

“ A Behavior is an isolated set of DOM / user interactionsthat can be mixed into any View or another Behavior.

“ Behaviors allow you to blackbox View-specific interactions intoportable logical chunks, keeping your Views simple and your code DRY.

3 . 3

CONCRETLYCONCRETLY

http://slides.com/stephanebachelier/marionettebehaviors#/

Explanations and implementation details wereperfectly presented by

at Stéphane Bachelier

Backbone.js Paris S01E06

4 . 1

TESTING YOUR TESTING YOUR BEHAVIORSBEHAVIORS, JUST DO IT!, JUST DO IT!> PROBLEMS> PROBLEMS

4 . 2

PB #1 : HOW TO TEST THE API?PB #1 : HOW TO TEST THE API?const Alert = Marionette.Behavior.extend( {

defaults: { title: "Alert!", message: "Not really urgent" },

events: { "click": "emitAlert" },

emitAlert() { alert( this.options.message ); }

} );

it( "should emit an alert", () => {

// => This won't work expect( Behavior.emitAlert() ).toEmitAnAlert();

} );

4 . 3

PB #2 : COUPLING WITH THE VIEWPB #2 : COUPLING WITH THE VIEW

To test a Behavior independently from a view:

a lot of setupno real value addeddon't verify that Behavior-View actually worksin the reality of our application

4 . 4

PB #3 : TEST CODE DUPLICATIONPB #3 : TEST CODE DUPLICATION

Testing the Behavior-View interaction in every views tests suite…

5 . 1

A PROPOSED A PROPOSED SOLUTIONSOLUTION

https://github.com/nicoespeon/testing-marionette-behaviors

http://www.nicoespeon.com/en/2015/11/testing-marionette-behaviors/

5 . 2

GREAT ARTICLES ABOUT THATGREAT ARTICLES ABOUT THAT

http://spin.atomicobject.com/2014/09/11/marionette-behaviors-overview/

http://spin.atomicobject.com/2014/09/12/testing-marionette-js-behaviors/

6

THANKS!THANKS! ANY QUESTION? ANY QUESTION?