Skip to content

Dispatch: Custom action creators fails with spread args #1932

@spamshaker

Description

@spamshaker

When an action creator is defined as a thunk or a prepare function and its parameters are destructured (e.g. function ({ id, name }) { … }), the Redux DevTools dispatcher panel does not list those arguments.

The UI shows an empty parameter list, which makes it hard to debug actions that rely on destructured payloads.

The problem originates from the getParams helper in redux-devtools-utils (see commit f033016).

getParams currently only handles simple parameter names and does not support the ObjectBindingPattern syntax introduced by ES2020 for destructuring.

This issue is similar to the one reported in get-params (fahad19/get-params#1 ) and affects any action creator that uses destructuring in its signature.

Expected behavior:

getParams should detect destructured parameters and return them as individual argument names so that the dispatcher view can display id, name, etc.

Steps to reproduce:

  1. Create a thunk or prepare function with destructured parameters.
  2. Open Redux DevTools and navigate to the dispatcher view.
  3. Observe that no arguments are listed for that action.

Screenshots:

Image

This is probably the place where the getParams is producing the result

Suggested fix:

Use esprima or similar parser to handle that functionality correctly.
https://esprima.org/demo/parse.html?code=%2F%2F%20Life%2C%20Universe%2C%20and%20Everything%0Afunction%20prepareMyAction(%7Bid%20%3D%201%7D)%7B%0A%0A%7D

I am reporting it here cause even if it would be fixed in get-params. The form of given arguments may need to be handled in the dispatcher functionality eg to produce a flat form e.g.

given the action creator has

function someAction({id = '', name = 1}){
 // Body ...
}

parameters form would be:

id
name

and so on...

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions