Mouseleave event not triggered

Issues - Platform and API
1

Related app/team name: Firestone

Issue Description:
Since recently (I don’t have the exact date unfortunately), the mouseleave event is not firing anymore in some circumstances.
I have added a video that showcases the issue:
mouse_leave_bug.zip (1.5 MB)

In short, when mousing over a mostly transparent overlay (the background color is set to rgba(255, 255, 255, 0.01) to be able to trigger the events), the mouseover event is properly emitted, but the mouseleave event is not. It is only triggered when I mouse over another element.
In the video attached, the background color has been set to rgba(255, 255, 255, 0.5) to make it easier to see the element’s boundaries.

The code that triggers the two events (Angular) is:

	@HostListener('mouseenter')
	onMouseEnter() {
		console.debug('mouse enter');
	}

	@HostListener('mouseleave')
	onMouseLeave() {
		console.debug('mouse leave');
	}

Impact for my app: High. While it doesn’t remove any functionality to the app, it is extremely annoying for many users, and could be a cause of uninstall / switch to another app, as this feature is used intensively.

Do you currently have a workaround? No

Please reproduce and attach a zip package of your OW client logs
Please mention the time of the event so we can find it easily in the logs

OverwolfLogs_2021-08-18_09-19-18.zip (1.6 MB)
Reproduced the issue at around 9:10:31

Thanks!

2

I did some more tests, and the mousemove event it properly fired. mouseout is not however.

3

We will check it and let you know. Thanks

1 Like
5

@sebastientromp hey,

I tested it and it’s working as expected.

I used this example which I integrated in an OW app:

Thanks.
Eran

6

Thanks. Could you share a bit more precisely the scenario that you used to test it?

As mentioned in the ticket, if I move from the element to another element, it works fine. But if I move to the container (a transparent window overlay), it is not triggered.

7

@sebastientromp, I think that the best way to reproduce it and eliminate other things is to create a clean sample app with transparent background, etc. - exactly like in your app but with the minimal elements and components. Pure js that you can send so if necessary I can pass to the R&D in case of a bug.

Would you please try that and update me if you still have an issue?