mongodb-js / connect-backbone-to-react

Connect Backbone Models and Collections to React.
https://www.npmjs.com/package/connect-backbone-to-react
Apache License 2.0
27 stars 5 forks source link

Problem with using Context in React Classes #27

Open ruaneg opened 3 years ago

ruaneg commented 3 years ago

Hi guys,

Thanks for sharing your plugin!

Ive recently upgraded React along with your plugin so I can take advantage of using React Context API. For functional components everything has worked fine. However if I use Context in a class component, which is also connected to your plugin via connectBackboneEvents HOC I get console errors when the model listeners are setup.

Uncaught TypeError: model.on is not a function createEventListener createEventListener createEventListeners createEventListeners ConnectBackboneToReact constructClassInstance

Debugging the code it seems that the context 'this.context' in my wrapped component is being used as the context in the HOC. const models = Object.assign({}, this.context, this.props.models); https://github.com/mongodb-js/connect-backbone-to-react/blob/master/lib/connect-backbone-to-react.js#L88 Screenshot 2020-10-29 at 17 03 21

Screenshot 2020-10-29 at 17 16 01

I know I can work my way around this by not using context in components that are using this HOC. However, that is a bit of a workaround, and it would be nice if we could fix the plugin to handle all scenarios. Perhaps reworking the validateModelTypes function to ensure only Backbone models are set to this.models.

Thanks! Gary

hswolff commented 3 years ago

Heya! Thanks for opening the issue! Do you mind providing some code that reproduces the issue so I can better understand how to fix it? Thanks!

ruaneg commented 3 years ago

Hi,

Ill try and put something together this week on jsfiddle/codepen.

cheers