Come testare un orologio AngularJS usando la funzione antirimbalzo con Jasmine

Question

Ho un controller con un orologio che usa il debounce da lodash per ritardare il filtraggio di un elenco di 500 ms.

$scope.$watch('filter.keywords', _.debounce(function() { 
    $scope.$apply(function() { 
    $scope.filtered = _.where(list, filter); 
    }); 
}, 500)); 

Sto cercando di scrivere un test che simula Jasmine inserire parole chiave di filtro che non si trovano seguiti da parole chiave che si trovano.

Il mio tentativo iniziale era di utilizzare $ digest dopo aver assegnato un nuovo valore alle parole chiave, che presumo non ha funzionato a causa del rimbalzo.

it('should filter list by reference', function() { 
    expect(scope.filtered).toContain(item); 
    scope.filter.keywords = 'rubbish'; 
    scope.$digest(); 
    expect(scope.filtered).not.toContain(item); 
    scope.filter.keywords = 'test'; 
    scope.$digest(); 
    expect(scope.filtered).toContain(item); 
}); 

Così ho provato a utilizzare timeout $, ma non funziona neanche.

it('should filter list by reference', function() { 
    expect(scope.filtered).toContain(item); 
    $timeout(function() { 
    scope.filter.keywords = 'rubbish'; 
    }); 
    $timeout.flush(); 
    expect(scope.filtered).not.toContain(item); 
    $timeout(function() { 
    scope.filter.keywords = 'test'; 
    }); 
    $timeout.flush(); 
    expect(scope.filtered).toContain(item); 
}); 

Ho anche provato a dare a $ timeout un valore superiore a 500ms impostato su debounce.

Come altri hanno risolto questo problema?

MODIFICA: ho trovato una soluzione che doveva avvolgere l'aspettativa in una funzione di timeout $ quindi chiamare $ apply sull'ambito.

it('should filter list by reference', function() { 
    expect(scope.filtered).toContain(item); 
    scope.filter.keywords = 'rubbish'; 
    $timeout(function() { 
    expect(scope.filtered).not.toContain(item); 
    }); 
    scope.$apply(); 
    scope.filter.keywords = 'test'; 
    $timeout(function() { 
    expect(scope.filtered).toContain(item); 
    }); 
    scope.$apply(); 
}); 

Sono ancora interessato a sapere se questo approccio è migliore però.

Answer 1

Questo è un approccio errato. È necessario utilizzare un debounce specifico angolare come this che utilizza $ timeout anziché setTimeout. In questo modo, puoi fare

$timeout.flush(); 
    expect(scope.filtered).toContain(item); 

e le specifiche passeranno come previsto.

Answer 2

Utilizzando spyOn per sostituire _.debounce, controllare questo collegamento. http://gotoanswer.stanford.edu/?q=Jasmine+test+does+not+see+AngularJS+module

Answer 3

Ho usato questo:

beforeEach(function() { 
    ... 
    spyOn(_, 'debounce').and.callFake(function (fn) { 
     return function() { 
      //stack the function (fn) code out of the current thread execution 
      //this would prevent $apply to be invoked inside the $digest 
      $timeout(fn); 
     };    
    }); 
}); 

function digest() { 
    //let the $watch be invoked 
    scope.$digest(); 
    //now run the debounced function 
    $timeout.flush(); 
} 

it('the test', function() { 
    scope.filter.keywords = ...; 
    digest(); 
    expect(...); 
}); 

Speranza che aiuta