feat: add OpenTracing support (#138)

* feat: add OpenTracing support

add a separate bundle for opentracing
minor fixes

* add opentracing-entry

bundle opentracing seperately but including the apm-base

* update js-core to 2.4

.eslintrc.js

@@ -3,6 +3,8 @@ module.exports = {
         "es6": true
     },
     "rules": {
-        "max-len": ["error", { "code": 100 }]
+        "max-len": ["error", { "code": 100 }],
+        'no-unused-vars': 'error',
+        'space-before-function-paren': 'error'
     }
 }

package.json

@@ -28,7 +28,7 @@
     "run-script": "node ./scripts/run-script.js",
     "test": "npm run lint && npm run build && npm run buildE2eBundles && npm run runNodeTests && npm run runUnitTests && npm run run-e2e && npm run build-docs",
     "lint": "standard",
-    "format": "prettier-standard src/**/*.js test/**/*.js"
+    "format": "prettier-standard 'src/**/*.js' test/**/*.js"
   },
   "files": [
     "src/**/*.js",
@@ -77,7 +77,7 @@
     "webpack-cli": "^3.1.2"
   },
   "dependencies": {
-    "elastic-apm-js-core": "^2.3.0",
+    "elastic-apm-js-core": "^2.4.0",
     "es6-promise": "^4.2.4"
   },
   "standard": {
@@ -92,4 +92,4 @@
       "test/e2e/sourcemap/"
     ]
   }
-}
+}

src/opentracing-entry.js

@@ -0,0 +1,4 @@
+const indexExports = require('./index')
+const opentracing = require('./opentracing')
+const { extend } = require('elastic-apm-js-core/src/common/utils')
+module.exports = extend({}, indexExports, opentracing)

src/opentracing/index.js

@@ -0,0 +1,15 @@
+const { createTracer: createElasticTracer } = require('elastic-apm-js-core/src/opentracing')
+
+function createTracer (apmBase) {
+  return createElasticTracer(apmBase.serviceFactory)
+}
+
+if (window && window.elasticApm) {
+  window.elasticApm.createTracer = createTracer.bind(window.elasticApm, window.elasticApm)
+}
+
+module.exports = {
+  __esModule: true,
+  default: createTracer,
+  createTracer
+}

test/e2e/general-usecase/app.e2e-spec.js

@@ -74,9 +74,9 @@ describe('general-usercase', function () {
     var transactionPayload = serverCalls.sendTransactions[0].args[0][0]
     expect(transactionPayload.type).toBe('page-load')
     expect(transactionPayload.name).toBe('general-usecase-initial-page-load')
-    expect(transactionPayload.spans.length).toBeGreaterThan(3)
+    expect(transactionPayload.spans.length).toBeGreaterThan(2)
     var span = transactionPayload.spans.find(function (s) {
-      return s.name === 'GET /test/e2e/common/data.json?test=hamid'
+      return s.name === 'GET /test/e2e/common/data.json'
     })
     expect(span).toBeDefined()
 

test/e2e/general-usecase/app.js

@@ -14,6 +14,13 @@ var elasticApm = createApmBase({
   pageLoadSampled: true
 })
 
+const { createTracer } = require('../../../src/opentracing')
+var tracer = createTracer(elasticApm)
+
+var otSpan = tracer.startSpan('OpenTracing span')
+
+otSpan.finish(Date.now() + 200)
+
 elasticApm.setInitialPageLoadName('general-usecase-initial-page-load')
 
 elasticApm.setUserContext({

test/e2e/standalone-html/app.e2e-spec.js

@@ -18,4 +18,21 @@ describe('standalone-html', function () {
       return utils.allowSomeBrowserErrors(['timeout test error with a secret'])
     }
   })
+
+  it('should run the opentracing use-case', function () {
+    browser.timeouts('script', 30000)
+    browser.url('/test/e2e/standalone-html/opentracing.html')
+
+    browser.waitUntil(
+      function () {
+        return browser.getText('#test-element') === 'Passed'
+      },
+      10000,
+      'expected element #test-element'
+    )
+
+    if (isChrome()) {
+      return utils.allowSomeBrowserErrors(['timeout test error with a secret'])
+    }
+  })
 })

test/e2e/standalone-html/index.html

@@ -12,10 +12,12 @@
     <script>
       var serverUrl = 'http://localhost:8003',
         apmServerUrl = 'http://localhost:8001'
+
       elasticApm.init({
         serviceName: 'standalone-html',
         serverUrl: apmServerUrl,
-        distributedTracingOrigins: [serverUrl]
+        distributedTracingOrigins: [serverUrl],
+        pageLoadTransactionName: '/'
       })
 
       function checkDtInfo(payload) {

test/e2e/standalone-html/opentracing.html

@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>test</title>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="data:;base64,iVBORw0KGgo=" />
+  </head>
+
+  <body>
+    <div id="app"></div>
+    <script src="/dist/bundles/elastic-apm-opentracing.umd.min.js"></script>
+    <script>
+      var serverUrl = 'http://localhost:8003',
+        apmServerUrl = 'http://localhost:8001'
+
+      elasticApm.init({
+        serviceName: 'standalone-html',
+        serverUrl: apmServerUrl,
+        distributedTracingOrigins: [serverUrl],
+        pageLoadTransactionName: '/'
+      })
+
+      function checkDtInfo(payload) {
+        console.log('distributed tracing data', payload)
+        if (typeof payload.traceId !== 'string') {
+          throw new Error('Wrong distributed tracing payload: ')
+        }
+      }
+
+      var tracer = elasticApm.createTracer()
+      var span = tracer.startSpan('Opentracing span')
+      span.finish(Date.now() + 100)
+
+      req = new window.XMLHttpRequest()
+      req.onerror = function(err) {
+        console.log('[XHR Error]', err)
+      }
+      req.open('POST', serverUrl + '/data', false)
+      req.addEventListener('load', function() {
+        var payload = JSON.parse(req.responseText)
+        checkDtInfo(payload)
+
+        var appEl = document.getElementById('app')
+        var testEl = document.createElement('h2')
+        testEl.setAttribute('id', 'test-element')
+        testEl.innerHTML = 'Passed'
+        appEl.appendChild(testEl)
+      })
+
+      req.send()
+    </script>
+  </body>
+</html>

test/specs/apm-base.spec.js

@@ -57,7 +57,7 @@ describe('ApmBase', function () {
 
     spyOn(tr, 'startSpan').and.callThrough()
     apmBase.startSpan('test-span', 'test-type')
-    expect(tr.startSpan).toHaveBeenCalledWith('test-span', 'test-type')
+    expect(tr.startSpan).toHaveBeenCalledWith('test-span', 'test-type', undefined)
 
     expect(apmBase.getCurrentTransaction()).toBe(tr)
     expect(apmBase.getTransactionService()).toBe(trService)

webpack.config.js

@@ -6,11 +6,14 @@ const UglifyJSPlugin = require('uglifyjs-webpack-plugin')
 const OUTPUT_DIR = path.join(__dirname, 'dist', 'bundles')
 
 const baseConfig = {
-  entry: './src/index.js',
+  entry: {
+    'elastic-apm-js-base': './src/index.js',
+    'elastic-apm-opentracing': './src/opentracing-entry.js'
+  },
   output: {
-    filename: 'elastic-apm-js-base.umd.js',
+    filename: '[name].umd.js',
     path: OUTPUT_DIR,
-    library: 'elastic-apm-js-base',
+    library: '[name]',
     libraryTarget: 'umd'
   },
   mode: 'development',
@@ -40,7 +43,7 @@ const baseConfig = {
 
 const optimizeConfig = Object.assign({}, baseConfig, {
   output: {
-    filename: 'elastic-apm-js-base.umd.min.js',
+    filename: '[name].umd.min.js',
     path: OUTPUT_DIR
   },
   mode: 'production',