Kibana: Visualizations report "renderComplete" prior to being visible in the DOM

Created on 4 Sep 2018  路  3Comments  路  Source: elastic/kibana

See #22581 for additional detail.

It's not clear what impact this has on anything other than reporting, but it may also negatively impact snapshot testing.

It seems to be fixable by changing our simple_emitter to be asynchronous. This puts the emit onto the JS event loop, which puts it behind the other already queued events (one of which actually places the visualizations in the DOM). Alternatively, we could put the specific renderComplete emit into a setTimeout or similar and accomplish the same thing.

There may be other possible fixes, but these two are the ones I explored. They solved the issue, but also broke various tests that expect the current behavior.

Repro steps

  • After this emit, place alert('Hello. The visualization should be in the DOM.');
  • Load up a dashboard or visualization
  • You'll see the alert, but no visualization

I think that the browser "capture snapshot" behavior freezes the DOM the same way an alert does (otherwise, you'd get really weird artifacts in your captured images). So, I think this is the source of the occasional blank visualizations we see in reporting tests.

Reporting Visualizations KibanaApp triage_needed

Most helpful comment

Can we leave this one open? Even though it hasn't been prioritized yet, I think it's important. Maybe something that could be investigated when moving the pie chart implementation to EUI? (cc @markov00)

All 3 comments

Closing due to low priority and lack of traction.

Can we leave this one open? Even though it hasn't been prioritized yet, I think it's important. Maybe something that could be investigated when moving the pie chart implementation to EUI? (cc @markov00)

This'll be a tricky one to get right.

One of the challenges here is that the visualization logic may be complete, but the rendering operation (drawing the visualization) is async for some visualizations, so it may not actually be in the DOM yet. One way to address this is to have visualizations put some kind of element into the DOM along with their visualization, and when that DOM element is rendered, it means the visualization is rendered.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

stacey-gammon picture stacey-gammon  路  3Comments

socialmineruser1 picture socialmineruser1  路  3Comments

timmolter picture timmolter  路  3Comments

bradvido picture bradvido  路  3Comments

LukeMathWalker picture LukeMathWalker  路  3Comments