Running mocha дает ошибку 'ReferenceError: sessionStorage не определен'

Question

Я настраиваю Mocha для моего приложения ReactJs (в основном в формате ES6).

На выполнении теста с использованием "test": "mocha --compilers js:babel-register --recursive" установки в package.json я получаю следующий результат:

purezen_@mb ~/workspace/webapp (Test-Setup●●)$ npm test 

> webapp@0.1.0 test /Users/purezen_/workspace/webapp 
> mocha --compilers js:babel-register --recursive 

/Users/purezen_/workspace/webapp/src/js/data/reducers/auth.js:31 
var auth = sessionStorage.getItem('auth'); 
     ^

ReferenceError: sessionStorage is not defined 
    at Object.<anonymous> (auth.js:5:14) 
    at Module._compile (module.js:397:26) 
    at loader (/Users/purezen_/workspace/kredx-fe/client/node_modules/babel-register/lib/node.js:158:5) 
    at Object.require.extensions.(anonymous function) [as .js] (/Users/purezen_/workspace/webapp/node_modules/babel-register/lib/node.js:168:7) 
    at Module.load (module.js:343:32) 
    at Function.Module._load (module.js:300:12) 
    at Module.require (module.js:353:17) 
    at require (internal/module.js:12:17) 
    at Object.<anonymous> (index.js:5:1) 
    at Module._compile (module.js:397:26) 
    at loader (/Users/purezen_/workspace/webapp/node_modules/babel-register/lib/node.js:158:5) 

тест/действия/actions.spec.js

import configureMockStore from 'redux-mock-store' 
import createSagaMiddleware from 'redux-saga' 
import sagas from 'data/sagas' 
import nock from 'nock' 
import expect from 'expect' 

(function (glob) { 
    function mockStorage() { 
     var storage = {}; 
     return { 
      setItem: function(key, value) { 
       storage[key] = value || ''; 
      }, 
      getItem: function(key) { 
       return storage[key]; 
      }, 
      removeItem: function(key) { 
       delete storage[key]; 
      }, 
      get length() { 
       return Object.keys(storage).length; 
      }, 
      key: function(i) { 
       var keys = Object.keys(storage); 
       return keys[i] || null; 
      } 
     }; 
    } 
    glob.localStorage = mockStorage(); 
    glob.sessionStorage = mockStorage(); 
}(typeof window !== 'undefined' ? window : global)); 

const sagaMiddleware = createSagaMiddleware(sagas) 
const middlewares = [ sagaMiddleware ] 
const mockStore = configureMockStore(middlewares) 
// const storeWithMiddleware = applyMiddleware(middlewares)(mockStore) 

console.log(mockStore) 

Я пытался внедрить хранилище сеансового сеанса в файл спецификации, но это, похоже, не помогает.

EDIT: Вот мой auth.js в соответствии с просьбой в комментариях

import * as c from 'data/constants' 
import {Map} from 'immutable' 

// Load auth details from session storage 
const auth = sessionStorage.getItem('auth'); 
const defaultState = Map(JSON.parse(auth)); 

export default function (state=defaultState, action) { 
    const { type, payload} = action 
    switch (type) { 
    case c.SET_AUTH: { 
     return Map(payload) 
    } 
    } 
    return state; 
} 

Answer 1

Хорошо, я вижу проблему. Вы пытаетесь установить глобальный sessionStorage из своего теста, и это нормально, но Mocha делает это проще с before. Этот пример должен помочь вам двигаться вперед.

Вот что должно выглядеть в спецификации.

import configureMockStore from 'redux-mock-store' 
import createSagaMiddleware from 'redux-saga' 
import sagas from '../sagas' 
import nock from 'nock' 
import expect from 'expect' 

describe('test the sagas', function(){ 

    before(function(){ 

    if(typeof window !== 'undefined') { 
     console.log('window is defined'); 
     global = window; 
    } 

    function mockStorage() { 
     var storage = {}; 
     return { 
      setItem: function(key, value) { 
       storage[key] = value || ''; 
      }, 
      getItem: function(key) { 
       return storage[key]; 
      }, 
      removeItem: function(key) { 
       delete storage[key]; 
      }, 
      get length() { 
       return Object.keys(storage).length; 
      }, 
      key: function(i) { 
       var keys = Object.keys(storage); 
       return keys[i] || null; 
      } 
     }; 
    } 

    global['localStorage'] = mockStorage(); 
    global['sessionStorage'] = mockStorage(); 

    }); 

    it('should bootstrap a saga and store', function(){ 

    const sagaMiddleware = createSagaMiddleware(sagas); 
    const middlewares = [ sagaMiddleware ]; 
    const mockStore = configureMockStore(middlewares); 
    console.log('mockStore', mockStore); 

    }); 

}); 

Обратите внимание, как вместо того, чтобы использовать IIFE, мы можем использовать before, который предоставляется мокко. Это позволяет вам настроить такие вещи, как global.sessionStorage, до начала тестов. Все это должно быть обернуто в describe, и вы должны использовать it для определения фактического модульного теста.

С этой загрузкой, выполненной в функции before, ваш тест на auth.js, вероятно, просто сработает.

Я опубликовал это whole example to github, с другим примером async_action из другого сообщения. Вы можете проверить это и следовать README, и две спецификации должны работать. Удачи.

Answer 2

// Это должно перейти в папку тест мокко/helpers.js

import jsdom from 'jsdom'; 

// Jsdom document & window 
    const doc = jsdom.jsdom('<!doctype html><html><body></body><div id="react-root"></div></html>'); 

    const win = doc.defaultView; 
// Add to global 
    global.document = doc; 
    global.window = win; 

    global.localStorage = {}; 

// Add window keys to global window 
Object.keys(window).forEach((key) => { 
if (!(key in global)) { 
global[key] = window[key]; 
} 
});