Has anyone been able to create custom transaction using the new angular integration?

Elastic Observability APM
1

If you are asking about a problem you are experiencing, please use the following template, as it will help us help you. If you have a different problem, please delete all of this text :slight_smile:

Kibana version: 6.6.0

Elasticsearch version: 6.6.0

APM Server version: 6.6.0

APM Agent language and version: Js/angular 0.2.0, JS: 4.5.0

Browser version: Chrome

Original install method (e.g. download page, yum, deb, from source, etc.) and version:

Fresh install or upgraded from other version? fresh install

Is there anything special in your setup? For example, are you using the Logstash or Kafka outputs? Are you using a load balancer in front of the APM Servers? Have you changed index pattern, generated custom templates, changed agent configuration etc.

Description of the problem including expected versus actual behavior. Please include screenshots (if relevant):

Steps to reproduce:
1.
2.
3.

Errors in browser console (if relevant):

Provide logs and/or server output (if relevant):

2

Hi Kartheek,

Thanks for trying out the APM Angular package. Could you please let us know what error are you seeing in the console and also the config/relevant code which would help us figure out the issue.

We have a E2E test which could help if there is any issue with the setup - https://github.com/elastic/apm-agent-rum-js/tree/master/packages/rum-angular/test/e2e/with-router

Thanks,
Vignesh

3

Thanks for your reply. More than seeing an error I am a little confused on how to plugin the new angular changes into my app. I am mainly looking for examples on how it is being used so the link you provided will be helpful. Do you have an example test with the same setup but also includes custom transactions?

4

Update: I was able to setup the angular plugin. I didnt realize ApmService had a static var "apm" which I could use. So I am able to start and end a custom transaction but i keep receiving this error and the transaction is not sent to APM server. Any clue what I am doing wrong here?

As you can see http spans are automatically created. This was working in in js agent version 3.0.0

TransactionService.startTransaction Transaction {name: "XXX", .....}
logging-service.js:56 TransactionService.startSpan POST http://localhost:8080/XXX external.http
logging-service.js:56 TransactionService.addTask task1
logging-service.js:56 TransactionService.removeTask task1
logging-service.js:56 TransactionService.startSpan GET http://localhost:8080/YYY external.http
logging-service.js:56 TransactionService.addTask task1
logging-service.js:56 TransactionService.removeTask task1
logging-service.js:56 TransactionService transaction finished Transaction {name: "XXX",...}
logging-service.js:56 Transaction was discarded! Transaction does not include any spans
logging-service.js:56 Could not create a payload from the Transaction Transaction {name: "XXX",...}
logging-service.js:56 TransactionService.add Transaction {name: "XXX",...}

5

Hi Kartheek,

Can you try with the latest @elastic/apm-rum-angular version. We have fixed an issue which was causing the ApmService injection not working as expected. The API is changed a bit, please check the docs here

https://www.elastic.co/guide/en/apm/agent/rum-js/current/angular-integration.html#_instrumenting_your_angular_application

Thanks,
Vignesh

6

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.