Redux测试-ReferenceError:未定义localStorage

埃德卡尔

我目前在我的redux操作上运行测试时遇到很多麻烦。测试通过了,但是每次运行我都会收到以下错误:

ReferenceError: localStorage is not defined

在此之前,我还遇到了一个错误:

ReferenceError: fetch is not defined

我通过使用同构提取来解决此问题。无论如何,我不确定如何配置Mocha来运行这些前端测试。任何帮助将非常感激。


摩卡测试命令:

mocha -w test/test_helper.js test/*.spec.js

test_helper.js:

require('babel-register')();
var jsdom = require('jsdom').jsdom;

var exposedProperties = ['window', 'navigator', 'document'];

global.document = jsdom('');
global.window = document.defaultView;

Object.keys(document.defaultView).forEach((property) => {
  if (typeof global[property] === 'undefined') {
    exposedProperties.push(property);
    global[property] = document.defaultView[property];
  }
});

global.navigator = {
  userAgent: 'node.js'
};

documentRef = document;

auth.actions.spec.js

import configureMockStore from 'redux-mock-store'
import thunk from 'redux-thunk'
import * as actions from '../client/app/actions/auth'
import * as types from '../client/app/constants/ActionTypes'
import nock from 'nock'
import chai from 'chai'
import sinon from 'sinon'

var expect = chai.expect

import { SERVER_API } from './config'

const middlewares = [ thunk ]
const mockStore = configureMockStore(middlewares)

describe('auth actions', () => {

afterEach(() => {
    nock.cleanAll()
})

it('creates LOGIN_REQUEST and LOGINSUCCESS when correct username and password provided', () => {

    nock(SERVER_API)
    .post('/login', {
      username: 'test',
      password: 'password'
    })
    .reply(200, {
      token: 'TOKEN'
    });

    const expectedActions = [
    { 
        type: types.LOGIN_REQUEST,
        isFetching: true,
        isAuthenticated: false,
        creds: {
          username: 'test',
         password: 'password'
        } 
    },
    { 
        type: types.LOGIN_SUCCESS,
        isFetching: false,
        isAuthenticated: true,
        token: 'TOKEN'
    }
    ]

    const INITAL_STATE = {
      isFetching: false,
      isAuthenticated: false
    }
    const store = mockStore(INITAL_STATE)

    return    store.dispatch(actions.loginUser({username:'test',password:'password'}))
       .then(() => {
        expect(store.getActions()).to.deep.equal(expectedActions)
       })
    })
})

auth.js

import { push } from 'react-router-redux'
import 'es6-promise'
import fetch from 'isomorphic-fetch'

import {
  LOGIN_REQUEST, LOGIN_SUCCESS, LOGIN_FAILURE
} from '../constants/ActionTypes.js'

import { SERVER_PORT } from '../constants/config'


function requestLogin(creds) {
  return {
    type: LOGIN_REQUEST,
    isFetching: true,
    isAuthenticated: false,
    creds
  }
}

function receiveLogin(user) {
  return {
    type: LOGIN_SUCCESS,
    isFetching: false,
    isAuthenticated: true,
    token: user.token
  }
}

function loginError(message) {
  return {
    type: LOGIN_FAILURE,
    isFetching: false,
    isAuthenticated: false,
    message
  }
}

export function loginUser(creds) {

  let config = {
    method: 'POST',
    headers: { 'Content-Type':'application/x-www-form-urlencoded' },
    body: `username=${creds.username}&password=${creds.password}`
  }

  return dispatch => {
    dispatch(requestLogin(creds))
    return fetch('http://localhost:'+SERVER_PORT+'/api/login', config)
      .then(response =>
        response.json()
        .then(user => ({ user, response }))
      ).then(({ user, response }) =>  {
        if (!response.ok) {
          dispatch(loginError(user.message))
          return Promise.reject(user)
        }
        else {
          dispatch(receiveLogin(user))
          localStorage.setItem('token', user.token) //offending line
          dispatch(push('foo'))
        }
      }).catch(err => console.log("Error: ", err))
  }
}

谢谢。

ZekeDroid

非常简单的错误,localStorage由于window.localStorage未定义,因此无法在Mocha测试中使用有两种方法可以解决此问题。更为“规范”的方法是将localStorage调用从您的操作中移出,因为这是副作用,它是redux操作中的反模式。相反,您应该具有可以捕获此操作并设置的中间件localStorage

通过这样做,您已经消除了测试此操作的问题。

但是,如果您不知道该怎么做并且不明智,那么可以localStorage在mocha测试文件的顶部创建一个全局变量,以创建一个false,从而“伪造” localStorage我建议不要这样做,但这绝对是一种适用于您的情况的解决方案。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

ReferenceError:未定义测试

来自分类Dev

在Karma测试中,未定义ReferenceError:describe

来自分类Dev

未捕获的ReferenceError:未定义测试(函数)

来自分类Dev

ReferenceError:未定义文档Jest React测试库

来自分类Dev

为什么会出现“ ReferenceError:未定义测试”

来自分类Dev

ElementUI 测试抛出 ReferenceError:_Message 未定义

来自分类Dev

Flux(Alt):ReferenceError:未定义localStorage

来自分类Dev

静态NextJS站点中的localStorage:ReferenceError:未定义localStorage

来自分类Dev

获取ReferenceError:在Mocha中运行React Native测试时未定义访存

来自分类Dev

Grunt + Karma测试运行程序失败,并显示“ ReferenceError:未定义模块”

来自分类Dev

使用Jasmine和Karma测试离子-未捕获的ReferenceError:未定义角度

来自分类Dev

ReferenceError:在Karma中运行Jasmine单元测试时未定义<module>

来自分类Dev

未捕获的ReferenceError:测试真实性时未定义var

来自分类Dev

为什么此代码会引发ReferenceError:未定义测试?

来自分类Dev

ReactJS Jest Puppeteer测试不再起作用:ReferenceError:未定义文档

来自分类Dev

如何使用Mocha / Sinon / Chai对未定义的localStorage进行单元测试

来自分类Dev

Redux 状态未定义

来自分类Dev

当我在异步操作Redux上开始单元测试时,未定义Error Promise

来自分类Dev

玩笑测试React + Redux说prop中的值未定义

来自分类Dev

当我在异步操作Redux上开始单元测试时,未定义Error Promise

来自分类Dev

ReferenceError:未定义$

来自分类Dev

ReferenceError:未定义$

来自分类Dev

由于“ ReferenceError:未定义Faye”,因此使用QUnit和Karma测试Emberjs应用程序失败。

来自分类Dev

正在获取ReferenceError:在react-native ios上运行排毒测试时未定义设备

来自分类Dev

在NodeJS中遇到“ ReferenceError:未定义日历”,但相同的代码在Google的API测试控制台中有效

来自分类Dev

在mapStateToProps中未定义Redux状态

来自分类Dev

未定义不是函数-响应redux

来自分类Dev

javascript - redux 道具未定义

来自分类Dev

Redux:TypeError:e 未定义

Related 相关文章

  1. 1

    ReferenceError:未定义测试

  2. 2

    在Karma测试中,未定义ReferenceError:describe

  3. 3

    未捕获的ReferenceError:未定义测试(函数)

  4. 4

    ReferenceError:未定义文档Jest React测试库

  5. 5

    为什么会出现“ ReferenceError:未定义测试”

  6. 6

    ElementUI 测试抛出 ReferenceError:_Message 未定义

  7. 7

    Flux(Alt):ReferenceError:未定义localStorage

  8. 8

    静态NextJS站点中的localStorage:ReferenceError:未定义localStorage

  9. 9

    获取ReferenceError:在Mocha中运行React Native测试时未定义访存

  10. 10

    Grunt + Karma测试运行程序失败,并显示“ ReferenceError:未定义模块”

  11. 11

    使用Jasmine和Karma测试离子-未捕获的ReferenceError:未定义角度

  12. 12

    ReferenceError:在Karma中运行Jasmine单元测试时未定义<module>

  13. 13

    未捕获的ReferenceError:测试真实性时未定义var

  14. 14

    为什么此代码会引发ReferenceError:未定义测试?

  15. 15

    ReactJS Jest Puppeteer测试不再起作用:ReferenceError:未定义文档

  16. 16

    如何使用Mocha / Sinon / Chai对未定义的localStorage进行单元测试

  17. 17

    Redux 状态未定义

  18. 18

    当我在异步操作Redux上开始单元测试时,未定义Error Promise

  19. 19

    玩笑测试React + Redux说prop中的值未定义

  20. 20

    当我在异步操作Redux上开始单元测试时,未定义Error Promise

  21. 21

    ReferenceError:未定义$

  22. 22

    ReferenceError:未定义$

  23. 23

    由于“ ReferenceError:未定义Faye”,因此使用QUnit和Karma测试Emberjs应用程序失败。

  24. 24

    正在获取ReferenceError:在react-native ios上运行排毒测试时未定义设备

  25. 25

    在NodeJS中遇到“ ReferenceError:未定义日历”,但相同的代码在Google的API测试控制台中有效

  26. 26

    在mapStateToProps中未定义Redux状态

  27. 27

    未定义不是函数-响应redux

  28. 28

    javascript - redux 道具未定义

  29. 29

    Redux:TypeError:e 未定义

热门标签

归档