Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Cannot read properties of null (reading 'offsetWidth') when using notMerge #20335

Closed
Curtis-Lockley opened this issue Sep 11, 2024 · 3 comments · Fixed by #20435
Closed
Labels
bug en This issue is in English topic: tooltip

Comments

@Curtis-Lockley
Copy link

Curtis-Lockley commented Sep 11, 2024

Version

5.5.1

Link to Minimal Reproduction

https://jsfiddle.net/az4p58gs/

Steps to Reproduce

All you need to do once opening to reproduce the bug is to scroll around and zoom in/out until the crash occurs.

Current Behavior

Currently, there is a chance that when scrolling for a crash to occur as shown below.
echarts-null-value

Below is the error message

echarts.min.js:45 Uncaught TypeError: Cannot read properties of null (reading 'offsetWidth')
    at t.getSize (echarts.min.js:45:781248)
    at e._updatePosition (echarts.min.js:45:792803)
    at e.<anonymous> (echarts.min.js:45:790188)
    at e._showOrMove (echarts.min.js:45:788953)
    at e._showAxisTooltip (echarts.min.js:45:790116)
    at e._tryShow (echarts.min.js:45:788458)
    at e.manuallyShowTip (echarts.min.js:45:787122)
    at echarts.min.js:45:786112

Expected Behavior

The intended behaviour is:

  1. rebuild options from scratch using new data
  2. remember the previous scroll position
  3. not crash when scrolling/zooming

In my real app, I achieve the first 2 points by taking the values from chart.getOption and manually merging them into the new object.

Environment

No response

Any additional comments?

In my real app, I've seen the issue even if the chart is rebuilt every 5 seconds instead of 100ms. As it seems to happen whenever chart.setOption, the interval was lowered to make it quicker to reproduce.

Although options does not change. In the real app, options could be built from the same data, but filtered to exclude certain data points.

@echarts-bot echarts-bot bot added en This issue is in English pending We are not sure about whether this is a bug/new feature. labels Sep 11, 2024
@ktx-abhay
Copy link
Contributor

Facing same issue. Any update on this?

@plainheart plainheart added topic: tooltip and removed pending We are not sure about whether this is a bug/new feature. labels Oct 23, 2024
@jesse-garrison-panther
Copy link

jesse-garrison-panther commented Dec 3, 2024

Hello all, I just ran into this issue, and I can see the fix in the src directory here in Github, but it's not in the built version of the code as far as I can tell.

The built version of the code still contains the following lines for the getSize function:

TooltipHTMLContent.prototype.getSize = function () {
    var el = this.el;
    return [el.offsetWidth, el.offsetHeight];
  };

The version of the code with the fix (like here), has an extra check for the el before trying to check the offsetWidth and offsetHeight:

getSize() {
        const el = this.el;
        return el ? [el.offsetWidth, el.offsetHeight] : [0, 0];
    }

@plainheart
Copy link
Member

@jesse-garrison-panther Hi, we are preparing the release of v5.5.2 and it will be finished within two weeks at most.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug en This issue is in English topic: tooltip
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants