How to do event binding on component?

[jfrux]

When I do like onPlay={() => {}} or something along those lines, its causing react-tv renderer to throw errors in browser like Unexpected token (.

On react-dom it works fine.
What is a way I can do this without it throwing this error? I REALLY want to use this renderer but this is keeping me from rendering videos for some reason.

UPDATE:
It seems to be doing it with my more dynamic components like ones that use: createElement

Any tips? Anybody done this?

[raphamorim]

Sorry about the delay, @joshuairl.
Well, maybe now it's better to try to use with React-DOM. I'm working on React-TV 0.4 version with full improve on memory usage (#123) and creating a development version to catch these type of errors.

[jfrux]

Okay I’ll use react dom for now. But react tv was so much snappier

…

-- Joshua F. Rountree | UX Developer The E.W. Scripps Company 312 Walnut Street, Suite 2800, Floor 29th, Office 29W109 Cincinnati, Ohio 45202-4024 (513) 977-3840 (office, M-F, 7a-4p) (513) 827-7936 (mobile)

On May 19, 2018, 10:41 AM -0400, Raphael Amorim ***@***.***>, wrote: Sorry about the delay, @joshuairl. Well, maybe now it's better to try to use with React-DOM. I'm working on React-TV 0.4 version with full improve on memory usage (#123) and creating a development version to catch these type of errors. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.

[jfrux]

Assuming this is fixed now then?

[jfrux]

Nah it just doesn’t work

[robolivable]

I ran into the same issue, @jfrux.

This issue is apparently due to react-tv not properly handling event emitters. The cryptic Unexpected token ( error you're seeing is caused by passing in an anonymous function to the Element.setAttribute method when setting an element's event listener property. You can get the error to go away by passing in a named function as a value for the event. Here's a jsfiddle example of what I mean. Keep in mind though that since setAttribute works differently than using a dot accessor for setting the value, you will likely have to call toString on your function when you pass it in... This also limits you from passing in any scoped functions, for example, a prototype method will just be rendered as function myFunc() { [native code] }, which would just throw a similar Unexpected token error as a result. My work around for this was to just pass in static methods (or just inline function expressions) and use globals to achieve dynamic functionality (e.g., persisting a value of an input in sessionStorage on onKeyDown ... super hacky, I know, I would appreciate any better ideas).

Side note, while digging through react files I was blown away by the intricacies surrounding the events module responsible for managing element on events...

[marcus-sa]

Only workaround is instead of using an anonymous function, you should put in a named function:

onPlay(myFn)