tshaddix / webext-redux

A set of utilities for building Redux applications in Web Extensions.
MIT License
1.23k stars 180 forks source link

Mention that redux actions should be serializable #22

Closed mironov closed 8 years ago

mironov commented 8 years ago

Please add that to the Limitations section of the README.

For example redux-promise-middleware and redux-api-middleware v1 will not work because actions they produce are not serializable. redux-api-middleware v2 beta has String key instead of Symbol making it compatible with react-chrome-redux.

viskin commented 8 years ago

Sorry that I intervene, but I don't think that "actions should be serializable" is limitation of react-chrome-redux. As mentioned in this discussion, actions in redux should be plain objects. So creating not serializable actions is limitation of libraries that do that. Maybe it really worth noting the fact of serializablility of actions in "reminder" section. Again, in my option, it's not limitation but conformance to redux architecture.

mironov commented 8 years ago

@viskin It is not a limitation of react-chrome-redux but of Chrome Extension Messaging API:

A message can contain any valid JSON object (null, boolean, number, string, array, or object).

The Redux app might work without a problem on the web or mobile (with react-native), but when you start porting it to the Chrome ecosystem you will encounter unexpected behavior. Moreover, there are no errors; actions just come to the background page without "non-serializable" fields.

redux-thunk async actions also can't be serialized, so the aliases hack exists. Probably we can re-use that trick for other middlewares, but we should at least highlight that in README.

tshaddix commented 8 years ago

@mironov Have you looked into dispatchResponder? This was included to allow a "conversion" to a serializable object that the UI Components understand. The bottom example is an example with redux-promise-middleware. Please let us know if this helps (or not)!

tshaddix commented 8 years ago

Also, I'm happy to work with someone on the README sections. Right now it exists as a collection of wiki links.

mironov commented 8 years ago

@tshaddix Oh wow! Sorry, I overlooked this example somehow.

I think the easiest thing to do is to change headers to "Usage with redux-thunk" and "Usage with a promise middleware" on the Advanced Usage page.

Feel free to close the issue since the workaround is already documented.

tshaddix commented 8 years ago

@mironov, great to hear!

I agree we should probably breakout the Readme sections into something a little more recognizable. I would like to keep the documentation package-agnostic. Ideas?