JavaScript ユニットテストで localStorage をモックするにはどうすればいいですか? 質問する

JavaScript ユニットテストで localStorage をモックするにはどうすればいいですか? 質問する

モックできるライブラリはありますかlocalStorage?

私は使っていますシノン.JS他のほとんどの JavaScript モックにも使用しましたが、本当に素晴らしいことがわかりました。

最初のテストでは、localStorage は Firefox では割り当てられないことがわかりました (悲しい)。そのため、おそらく何らかのハックが必要になるでしょう :/

現時点での私の選択肢は(私が見る限り)次のとおりです。

  1. すべてのコードで使用するラッピング関数を作成し、それらをモック化する
  2. localStorage に対して、何らかの (複雑になる可能性がある) 状態管理 (テスト前の localStorage のスナップショット、クリーンアップ時のスナップショットの復元) を作成します。
  3. ??????

これらのアプローチについてどう思われますか。また、これを実行する他のより良い方法はあると思いますか。いずれにせよ、最終的に作成した「ライブラリ」をオープンソースとして github に公開します。

ベストアンサー1

Jasmine でこれをモックする簡単な方法は次のとおりです。

let localStore;

beforeEach(() => {
  localStore = {};

  spyOn(window.localStorage, 'getItem').and.callFake((key) =>
    key in localStore ? localStore[key] : null
  );
  spyOn(window.localStorage, 'setItem').and.callFake(
    (key, value) => (localStore[key] = value + '')
  );
  spyOn(window.localStorage, 'clear').and.callFake(() => (localStore = {}));
});

すべてのテストでローカルストレージをモックしたい場合は、beforeEach()上記の関数をテストのグローバルスコープで宣言します(通常はスペックヘルパー.js脚本)。

おすすめ記事