模拟jquery选择器并返回一个html元素

时间:2017-08-23 20:14:45

标签: javascript jquery jasmine

我正在尝试测试一个javascript函数,该函数要求DOM中存在某个元素。以下是我要测试的功能:

auction.save_scroll_state = function() {
    var user_agent = $window.navigator.userAgent.toLowerCase();
    var is_android = user_agent.indexOf("android") > -1;

    if (is_android) {
      var restore_pos = null;
      debugger
      if ($location.search().section == "items") {
        restore_pos = $('#all-items').scrollTop();
        $('#all-items').one('scroll', function(){$('#all-items').scrollTo(restore_pos)});
      }
      else if ($location.search().section == "user_items"){
        restore_pos = $('#your-items').scrollTop();
        $('#your-items').one('scroll', function(){$('#your-items').scrollTo(restore_pos)});
      }
    }
  };

当我运行测试并调试任何类型$('#all-items').length的调试器时,它返回0,表示无法找到该元素。 我试图形成某种Jasime间谍,它会模仿jquery选择器。我的测试如下:

it ('save_scroll_state android user_agent all-items', inject(function($bwAppState, $location, $window) {
  $window.navigator = {userAgent: "Mozilla/5.0 (Linux; Android 7.0; SM-G950F Build/NRD90M) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.83 Mobile Safari/537.36"};
  var items_div = $("<div id='all-items'></div>");
  var jq_div_spy = spyOn($.fn, 'html' ).and.returnValue(items_div);
  var items_div_spy = spyOn(items_div, 'scrollTop');
  spyOn($location, "search").and.returnValue({section: 'items'});
  $bwAppState.auction.save_scroll_state();
  expect(items_div_spy).toHaveBeenCalled();
  delete $window.nagivator;
}));

主要目标是确保在scrollTop()标识为id="all-items"的某个HTML元素上调用final Fragment request = new Fragment();

非常感谢任何帮助

1 个答案:

答案 0 :(得分:0)

不理想,但可以这样做:

describe('ScrollTop on .test', function(){

    var scrollTopSpy;

    beforeEach(function(){
        scrollTopSpy = jasmine.createSpyObj('$-spy', ['scrollTop']); 
        spyOn(window, '$').and.callFake(function(selector){
            if(selector == '.test') {
                return scrollTopSpy;
            }
            else {
                return $(selector);
            }
        });
    });

    it('is called', function(){
        $('.test').scrollTop();
        expect($('.test').scrollTop).toHaveBeenCalled();
    });

    it('is not called', function(){
        expect($('.test').scrollTop).not.toHaveBeenCalled();
    })
})

请注意,只有scrollTop的{​​{1}}来电才会被执行,测试不知道DOM中存在真正的.test元素。