Skip to content

Double rendering of charts on initial load #690

@monfera

Description

@monfera

Describe the bug
Double rendering of charts, reproducible in Storybook and Playground

To Reproduce
Steps to reproduce the behavior:

  1. Put in a console.log in a render function, and/or randomize some data in the view model or render function
  2. Reload the page
  3. See dual console logging for rendering, or points/lines/etc. moving with the randomization approach

Expected behaviour
Single rendering

Additional context
Looks like the code that gets invoked is
https://github.com/elastic/elastic-charts/blob/master/src/components/chart_resizer.tsx#L86-L93

  private handleResize = (entries: ResizeObserverEntry[]) => {
    // return; // <= this line isn't here
    if (this.initialResizeComplete) {
      this.onResizeDebounced(entries);
    } else {
      this.initialResizeComplete = true;
      this.onResize(entries);
    }
  };

If the return is uncommented, the double rendering goes away, but then of course, it'll not respond to a resizing

Metadata

Metadata

Assignees

Labels

bugSomething isn't workingreleasedIssue released publicly

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions