fix: associate network info with each step

[vigneshshanmugam]

• part of capture more network information to improve waterfall #152
• Associate the network information with each step as its required for the waterfall chart creation
• fix the timestamp information as it was pointing to the journey end timestamp as opposed to the step start/end timestamp
• Move start/end in favor of requestSentTime/loadEndTime as its when events are written and not the actual duration.
  /cc @Kerry350

[vigneshshanmugam]

Will replace this with EventEmitter at some point if we require more integration between runner and plugins.

[apmmachine]

💚 Build Succeeded

the below badges are clickable and redirect to their specific view in the CI or DOCS

Expand to view the summary

Build stats

• Build Cause: Pull request #154 opened

• Start Time: 2020-12-01T12:46:45.452+0000

• Duration: 17 min 22 sec

Test stats 🧪

Test	Results
Failed	0
Passed	45
Skipped	0
Total	45

[vigneshshanmugam]

This change was done after some investigation with the chrome network events and how we will use it in the waterfall. copy pasting from internal gist

So here is the gist that i found and we need to change

• we will use requestTime for the waterfall stuff
• start/end represents the timestamp of when request is sent and when request completed, so we can calculate the queue time as follows

const queuedTime = payload.response.timing.request_time - payload.response.start
if (queuedTime > 0) {
 // convert in ms and use it in waterfall
}

• we discard end timing for now as its no useful. Also i think we can rename it to something like requestStartTime and responseEndTime to make it easier

@Kerry350 is aware of this issue.

[Kerry350]

LGTM 👍

Thanks for making things easier here 🙏

[Kerry350]

Much clearer 👍