Spans don't form a waterfall in UI (Node.js agent)

Elastic Observability APM
1

Hi,

I've run into a strange issue regarding the span waterfal in APM Ul.
Say, I have a simple code like this:

const wait = time => () => new Promise(resolve => setTimeout(resolve, time));

const transaction = agent.startTransaction('test-apm-2', 'job');
const overallSpan = transaction.startSpan('overall-span', 'task');
let span1, span2, span3;

Promise.resolve()
  .then(wait(50))
  .then(() => span1 = transaction.startSpan('span-1', 'task'))
  .then(wait(50))
  .then(() => span1.end())
  .then(() => span2 = transaction.startSpan('span-2', 'task'))
  .then(wait(100))
  .then(() => span2.end())
  .then(() => span3 = transaction.startSpan('span-3', 'task'))
  .then(wait(150))
  .then(() => span3.end())
  .then(() => {
    overallSpan.end();
    transaction.end();
    agent.flush();
  });

I expect this behaviour: overall-span covers all transaction timeline and spans 1,2 and 3 appear sequentially. But instead I'm having the following picture will all spans starting at once:

amp-span-waterfall
amp-span-waterfall.png2820×1050 152 KB

The same thing appears with default instrumentation spans (like DB queries) - they all start at the same time in UI.

Am I doing something wrong? Or do I get the idea of waterfall wrong?

Node.js Agent v2.1.0
APM Server v6.5.3

Thanks.

2

What versions of Elasticsearch and Kibana are you using? It looks like an old Kibana UI to me. :thinking:

3

We have 6.4.0 - think it's the case?

4

Yeah, updating the Elastic stack did it :slight_smile:
Thanks for your help!

5

I'm glad you got it sorted. It seems to just be a data incompatibility between what apm-server stores and what your previous version of Kibana was expecting.