Uncaught ReferenceError: context is not defined at channel.onHoverTeaser

Hi,

The following code:

const channel = channelTemplate({
id: `channel{index}${new Date().getTime()}`,
width: '100%',
height: '147%',
centerX: '50%',
centerY: '50%'
}, {}, {});

channel.onHoverTeaser = () => {
voltmx.print("### hover event executed: " + context.eventType);

if (context.eventType !== "leave"){
channel.flxChannel.borderWidth = 0;
channel.flxChannel.borderColor = "ffffff";
} else {
channel.flxChannel.borderWidth = 1;
channel.flxChannel.borderColor = "000000";
}
}

is giving me the following error:

Uncaught ReferenceError: context is not defined at channel.onHoverTeaser

How can I do?

Hi Eugenio, I think you need to declare your arrow function so that the widget and context arguments are passed in:

channel.onHoverTeaser = (widgRef, context) => {
voltmx.print("### hover event executed: " + context.eventType);

if (context.eventType !== "leave"){
channel.flxChannel.borderWidth = 0;
channel.flxChannel.borderColor = "ffffff";
} else {
channel.flxChannel.borderWidth = 1;
channel.flxChannel.borderColor = "000000";
}
}

Our documentation reference has a code snippet with these two arguments passed in to the function:
https://opensource.hcltechsw.com/volt-mx-docs/95/docs/documentation/Iris/iris_widget_prog_guide/Content/FlexContainer_Events.html

Many thanks,

I tried this way, but passing only the context and it didn't work.

Have a nice day! :)