jquery - HTML isn't updated by knockout in QUnit test -

i'm writing unit tests qunit in order test html of web page. webpage uses knockout alter dom. in test, knockout isn't triggered or loaded, alteration it's supposed isn't done. therefore, test fails.

index.cshtml

<script>     qunit.config.autostart = false; </script> <div id="qunit-fixture">     <div id="root">         <div class="board" data-bind="click: css: { 'selected': $data === $root.selectedboard() }">     </div> </div> <script src="~/scripts/root.js"></script> <script>     var root = new root();     $(function ()     {         ko.applybindings(root, document.getelementbyid('root'));         qunit.start(); //tell qunit ready launch test     });  </script> 

root.js

root = function () {         var self = this;         self.boards = [];         self.selectedboard = ko.observable(null);         self.selectboard = function (board, event)         {             if (!!board && board != null && self.selectedboard() !== board)             {                 self.selectedboard(board);                 self.selectedboard().loaddata();             }         };          //some stuff build "boards" array. }  

test.js

test("selected board have visual indicator display it.", 1, function () {     var $boards= $(".board");     root.selectboard(root.boards[2]);//does change root.selectedboard     ok($boards.eq(2).hasclass("selected"), "second board should selected");//fail because knockout didn't add "selected" class yet. }); 

what can change have knockout work , make modification it's supposed in test?

note : initial run of test fails, when click "rerun" in qunit interface, test passes.

the test wasn't working on first try because of order tests ran. subsequent run worked because failed test run in first. so, test weren't independent each other because declared variable "root" once , applied knockout binding. because of this, each test leave variable "root" in different state next test run. needless bad.

to fix issue, used qunit setup/teardown create variable root , apply knockout binding before each test.

setup: function () {     var divroot = $('#root')[0];     this.root = new root();     ko.applybindings(this.root, divroot);  }, teardown: function () {     var divroot = $('#root')[0];     ko.cleannode(divroot);     this.root = null; } 

everything work expected this. behavior of knockout consequence of having dependent test.

also, qunit-fixture reset dom after each test, might have interfered knockout when had 1 mapping every tests.