Default parameters in actionCreators don't parse correctly

[SyedFarhan]

An actionCreator function with default parameters doesn't parse correctly in the UI. The dispatch/action creation still seems to work fine.

[zalmoxisus]

Can you replicate it with our counter example? You can see the configuration here. Live demo seems to work ok. Without a repro (modifying that example or providing a repository), difficult to assist here.

Can also look to todomvc demo (as the counter's action creators have no parameters), the code is here.

[SyedFarhan]

I think I narrowed it down to the get-params package used in redux-devtools/packages/redux-devtools-core/src/utils/index.js. The getActionsArray function relies on flatTree function which uses get-params.

import getParams from 'get-params';
...
function flatTree(obj, namespace = '') {
  let functions = [];
  Object.keys(obj).forEach(key => {
    const prop = obj[key];
    if (typeof prop === 'function') {
      functions.push({
        name: namespace + (key || prop.name || 'anonymous'),
        func: prop,
        args: getParams(prop),
      });
    } else if (typeof prop === 'object') {
      functions = functions.concat(flatTree(prop, namespace + key + '.'));
    }
  });
  return functions;
}
...
export function getActionsArray(actionCreators) {
  if (Array.isArray(actionCreators)) return actionCreators;
  return flatTree(actionCreators);
}

get-params was last updated 4 years ago on May 2015, a month before ES6 was published. Which is probably why it doesn't handle es6 default params correctly. I did a simple test with the package and it didn't parse default params correctly. When I compiled the code below with babel, the result of get-params was an empty array.

const getParams = require('get-params');

function testFunction(id = 'test', selected) {
  console.log(id);
}

console.log(getParams(testFunction)); // [ 'id', '=', '\'test\'', 'selected' ]

I tried adding default parameters to the todomvc 'todos' action file ( the only changes I made are below). This resulted in no arguments being read by the Dispatcher monitor (probably due to babel).
This is different from my Electron apps thunk ( from the screenshot ), where the parameters show up but don't get parsed correctly. Which is compiled using Babel 7.

import * as types from '../constants/ActionTypes';

export function addTodo(text = 'test') {
  return { type: types.ADD_TODO, text };
}

export function deleteTodo(id = 1) {
  return { type: types.DELETE_TODO, id };
}

export function editTodo(id = 1, text) {
  return { type: types.EDIT_TODO, id, text };
}

export function completeTodo(id) {
  return { type: types.COMPLETE_TODO, id };
}

export function completeAll() {
  return { type: types.COMPLETE_ALL };
}

export function clearCompleted() {
  return { type: types.CLEAR_COMPLETED };
}

[SyedFarhan]

A partial solution/replacement for get-params package I came across was this answer on StackOverflow: https://stackoverflow.com/a/49544338/10016308
This works for simple default values, but any complex ones will break it.