# Using Proxies with Redux Types

DevFeed: [Using Proxies with Redux Types](<https://devfeed.tech/articles/using-proxies-with-redux-types-21864.md>)

Original publisher: [Read original article](<https://reactjsnews.com/proxies-with-redux-types>)

Author: Zach Silveira

Published: 2017-03-28T16:00:00Z

Content type: tutorial

Language: en

Sources: [ReactJS News](<https://devfeed.tech/sources/reactjs-news.md>)

Topics: [Redux](<https://devfeed.tech/topics/redux.md>), [debugging](<https://devfeed.tech/topics/debugging.md>), [Code](<https://devfeed.tech/topics/code.md>)

Tags: [code](<https://devfeed.tech/tags/code.md>), [debugging](<https://devfeed.tech/tags/debugging.md>), [errors](<https://devfeed.tech/tags/errors.md>), [es2015](<https://devfeed.tech/tags/es2015.md>), [es6](<https://devfeed.tech/tags/es6.md>), [import](<https://devfeed.tech/tags/import.md>), [js](<https://devfeed.tech/tags/js.md>), [react](<https://devfeed.tech/tags/react.md>), [redux](<https://devfeed.tech/tags/redux.md>)

## AI overview

This tutorial explains how misspelled Redux action types can be imported as undefined without raising browser errors, causing reducers to fall through to their default case. It proposes using ES2015 Proxies to validate action-type properties and make such mistakes easier to detect.

## Source excerpt

One of the most common problems that I run into when using Redux is trying to figure out why an action is not being captured by a reducer. For someone just getting starting with Redux, debugging this issue can be especially overwhelming because of how Redux manages data flow. So before you start pouring over configuration code, or the logic contained in your action creators and reducers, please, make sure your action types are defined and spelled correctly. One of the most common problems that I run into when using Redux is trying to figure out why an action is not being captured by a reducer. For someone just getting starting with Redux, debugging this issue can be especially overwhelming because of how Redux manages data flow. So before you start pouring over configuration code, or the logic contained in your action creators and reducers, please, make sure your action types are defined and spelled correctly. In any application that I have built, most bugs that I have run into are simply due to typos. However, the solution to this particular problem is harder to spot because no errors are raised when the application is run. Take a look at the snippet below. // actionTypes.js export const FETCH_FILE_REQUEST = 'fetch_file_request'; export const FETCH_FILE_SUCCESS = 'fetch_file_success'; export const FETCH_FILE_FAIL = 'fetch_file_fail'; // filesReducer.js import { FETCH_FILE_REQUEST, FETCH_FILE_SUCESS, FETCH_FILE_FAIL } from '../actions/actionTypes'; const filesReducer = (state = {}, action) => { switch (action.type) { case FETCH_FILE_SUCESS: return { ...state, file: action.payload }; default: return state; } } export default filesReducer; Assuming we dispatched an action with type FETCH_FILE_SUCCESS, the filesReducer should catch the action before the default case is returned. But what if that is not happening? Where do we start the debugging process. There does not appear to be anything wrong with the code in the reducer; the action type was imported and matches the