茉莉花和角嘲笑：嘲笑處理本地存儲的服務

Question

我有一個名爲wd $ cache的服務，基本上是localStorage.setItem和get.item的包裝。

現在我試圖測試一個控制器，使用該服務來實現特定的結果。主要的問題是，我有一個IF語句，只有當你已經設置了localstorage時纔會觸發IF語句，這會讓我瘋狂！ （我們在這裏做TDD）

服務

(function() { 

angular 
    .module('hub') 
    .controller('promotionNotificationCtrl', promotionNotificationCtrl); 

promotionNotificationCtrl.$inject = [ 
    'hub$promotions', 
    'hub$client', 
    'wd$cache' 
]; 

function promotionNotificationCtrl(
    hub$promotions, 
    hub$client, 
    wd$cache) { 

    var vm = this; 
    activate(); 

    ////////// 

    function activate() { 

     hub$promotions.get(hub$client.brand, hub$client.subbrand).success(function (data) { 

      if (!wd$cache.get('hub$notification')) { 

       wd$cache.add('before', 123); 
      } else { 

       wd$cache.add('after', 321); 
      } 
     }); 
    } 
} 
})(); 

TEST

describe('The promotion notification controller', function() { 

var controller, 
    hub$client, 
    $httpBackend, 
    wd$cache, 
    mockData = [{ 

     "foo": "bar" 
    }, 
    { 
     "faa": "boo" 
    }]; 


beforeEach(module('hub')); 
beforeEach(module('wired.core')); 

beforeEach(module(function ($provide) { 

    hub$client = { 

     brand: 'bw', 
     subbrand: 'plus' 
    }; 

    wd$cache = { 

     add: function() { 

     }, 

     get: function() { 

     } 
    }; 

    $provide.value('hub$client', hub$client); 
    $provide.value('wd$cache', wd$cache); 
    spyOn(wd$cache, 'add'); 
})); 

beforeEach(inject(function ($controller, _$httpBackend_, _hub$promotions_) { 

    controller = $controller('promotionNotificationCtrl'); 
    $httpBackend = _$httpBackend_; 
    hub$promotions = _hub$promotions_; 

    // request 
    $httpBackend.expectGET("/umbraco/api/promotions/get/?brand=bw&lang=en&subbrand=plus").respond(200, mockData); 
    $httpBackend.flush(); 
})); 

it('should attempt to add a cache with a "before" key if no previous "hub$notification" cache was found', function() { 


    expect(wd$cache.add).toHaveBeenCalledWith('before', 123); //WORKING 
}) 

it('should attempt to add a cache with a "after" key if a previous "hub$notification" cache was found', function() { 

    localStorage.setItem('hub$notification'); 
    wd$cache.add('hub$notification'); 

    expect(wd$cache.add).toHaveBeenCalledWith('after', 123); // NOT WORKING 
    // CANT GET THROUGH THE IF STATEMENT 
}) 
}); 

基本上我可以永遠到不了BeforeEach塊後 '測試案例'，無論我做什麼。我已經嘗試了一切，因爲它嘲笑它使用實際存儲。

任何想法？

Answer 1

可以提供已經填充了一些數據模擬實現：

var cache = {};  

beforeEach(module(function ($provide) { 
    // ... 
    wd$cache = { 
     add: function (key, value) { 
      cache[key] = value; 
     }, 
     get: function (key) { 
      return cache[key]; 
     } 
    }; 

    // add initial data here or in the individual tests, e.g. 


    // ... 
})); 

要正確設置緩存爲特定的測試用例，你可以使用cache場這樣的：

cache['hub$notification'] = 'whatever value makes sense here'; 

當然你也可以在beforeEach中這樣做。

目前你正在嘗試做這樣的：

wd$cache.add('hub$notification'); 
expect(wd$cache.add).toHaveBeenCalledWith('after', 123); 

這是兩方面的原因存在問題：

• ，因爲你是在add方法刺探沒有你不更新緩存.andCallThrough()。您應該修復此問題（間諜創建後添加.andCallThrough()），否則控制器的更新不會影響緩存。

• 間諜記錄你的電話。你不希望這個設置代碼，因爲它使後續的斷言更復雜。