fix echarts this.mouse

[MarcSkovMadsen]

Closing #7889

I don't fully understand the fix from GPT 4.1. But its simple and the Echarts events works for me in both edge and firefox after the change.

echarts-this.mouse-firefox.mp4

GPT 4.1 explanation

The error described in #fetch (TypeError: this.mouse is not a function at Object.pointer) occurs when handling mouse events like mouseover in ECharts, specifically in Edge (but not Firefox).

Looking at echarts.ts, mouse events are handled by the EChartsView._subscribe() method. For each event in event_config, it attaches a callback that serializes the event using serializeEvent:

The error trace points to a problem inside serializeEvent, specifically when it tries to call this.mouse. In event-to-object.ts, there is a class EventTransformCategories with a mouse method, but the context (this) may be lost if the method is called incorrectly (e.g., as a plain function instead of a method).

Root cause:
If EventTransformCategories.mouse is called without binding to an instance, this is undefined, so this.mouse fails. This can happen if the code does something like elementTransformCategoriescategorycategory instead of elementTransformCategories.mouse.call(instance, event).

Why Edge but not Firefox?
Edge may be stricter about this binding in certain contexts, or the event object structure may differ, triggering the bug only in Edge.

How to fix:
Ensure that all methods in EventTransformCategories are called with the correct this context, e.g., by using .call(instance, event) or converting them to static methods if they don't rely on instance state.

Summary:
The bug is caused by incorrect method binding in the event serialization logic, leading to this.mouse is not a function when handling mouse events in Edge. Fix the binding in serializeEvent to resolve the issue.

EChartsView
serializeEvent
EventTransformCategories
Similar code found with 1 license type - V

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 86.11%. Comparing base (edb382d) to head (01be6a7).
Report is 2 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #8041      +/-   ##
==========================================
- Coverage   87.08%   86.11%   -0.97%     
==========================================
  Files         346      346              
  Lines       53717    53717              
==========================================
- Hits        46780    46259     -521     
- Misses       6937     7458     +521     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[philippjfr]

Not sure why this is needed tbh but if it works, it works.

[github-actions]

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.