Skip to content

Commit 82b5fad

Browse files
obecnymayurkale22
obecny
authored and
mayurkale22
committed
Tracer web (open-telemetry#334)
* feat(tracer-web): adding tracer web * feat(basic-tracer): adding karma tests * feat(tracer-web): adding some example for easier debugging in browser - for development purposes * fix: lint * fix: creating base for karma * fix: fixing problem with target for browser, cleanup tests * refactor: moving polyfills for node karma tests to one file * fix: adding missing package * refactor: removing unneeded file * refactor: prefixing privates, cleanup * fix: duplicate package * refactor: aligning tslint with other tslint packages * refactor: cleanups, adding comments for class * fix: linting * fix: type * refactor: generation of id for scope * refactor: removed previous uid for scope as originally it was meant to be used with async which is not the case anymore * chore: adding test for restoring scope * fix: lint * refactor: simplifying the stack scope manager * chore: updating readme with basic example * chore: fixes after merge * fix: updating test to accept greater or equal - fails on browser * refactor: moving example for web tracer * refactor: removing WebTracerConfig to use BasicTracerConfig which changed recently * chore: updating types * chore: spacing * chore: removing mocha tests for tracer-web * chore: updating types and linting * chore: updating packages after merge * chore: adding nyc report for karma tests for browser * chore: updating lerna script to run coverage for browsers * feat(tracer-web): bump version to 0.1.0
1 parent 00cd2ec commit 82b5fad

31 files changed

+1205
-85
lines changed

‎.circleci/config.yml‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,9 @@ browsers_unit_tests: &browsers_unit_tests
4141
- run:
4242
name: Unit tests
4343
command: yarn test:browser
44+
- run:
45+
name: report coverage
46+
command: yarn codecov:browser
4447

4548
jobs:
4649
lint:

‎examples/tracer-web/index.html‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<title>JS Example</title>
7+
<base href="/">
8+
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
</head>
11+
12+
<body>
13+
Testing, debugging in development
14+
<script type="text/javascript" src="/bundle.js"></script>
15+
</body>
16+
17+
</html>

‎examples/tracer-web/index.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import { WebTracer } from '@opentelemetry/tracer-web';
2+
3+
import * as shimmer from 'shimmer';
4+
5+
class Tester {
6+
constructor() {
7+
}
8+
add(name) {
9+
console.log('calling add', name);
10+
}
11+
}
12+
13+
const tester = new Tester();
14+
15+
const webTracer = new WebTracer();
16+
const span = webTracer.startSpan('span1');
17+
18+
shimmer.wrap(Tester.prototype, 'add', (originalFunction) => {
19+
return function patchedFunction() {
20+
try {
21+
span.addEvent('start');
22+
} catch (e) {
23+
console.log('error', e);
24+
} finally {
25+
const result = originalFunction.apply(this, arguments);
26+
span.addEvent('after call');
27+
span.end();
28+
return result;
29+
}
30+
};
31+
});
32+
33+
webTracer.withSpan(span, function () {
34+
console.log(this === span);
35+
});
36+
37+
tester.add('foo');
38+
console.log(span);

‎examples/tracer-web/package.json‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
{
2+
"name": "web-tracer-example",
3+
"private": true,
4+
"version": "0.1.0",
5+
"description": "Example of using @opentelemetry/tracer-web in browser",
6+
"main": "index.js",
7+
"scripts": {
8+
"start": "webpack-dev-server -d --progress --colors --port 8090 --config webpack.config.js --hot --inline --host 0.0.0.0"
9+
},
10+
"repository": {
11+
"type": "git",
12+
"url": "git+ssh://git@github.com/open-telemetry/opentelemetry-js.git"
13+
},
14+
"keywords": [
15+
"opentelemetry",
16+
"tracing",
17+
"web"
18+
],
19+
"engines": {
20+
"node": ">=8"
21+
},
22+
"author": "OpenTelemetry Authors",
23+
"license": "Apache-2.0",
24+
"bugs": {
25+
"url": "https://github.com/open-telemetry/opentelemetry-js/issues"
26+
},
27+
"devDependencies": {
28+
"@babel/core": "^7.6.0",
29+
"@types/shimmer": "^1.0.1",
30+
"babel-loader": "^8.0.6",
31+
"shimmer": "^1.2.0",
32+
"webpack": "^4.35.2",
33+
"webpack-cli": "^3.3.9",
34+
"webpack-dev-server": "^3.8.1",
35+
"webpack-merge": "^4.2.2"
36+
},
37+
"dependencies": {
38+
"@opentelemetry/tracer-web": "^0.1.0"
39+
},
40+
"homepage": "https://github.com/open-telemetry/opentelemetry-js#readme"
41+
}

‎examples/tracer-web/webpack.config.js‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
const webpack = require('webpack');
2+
const webpackMerge = require('webpack-merge');
3+
const path = require('path');
4+
const mainPath = path.resolve('');
5+
const directory = path.resolve(__dirname);
6+
7+
const common = {
8+
mode: 'development',
9+
entry: 'index.js',
10+
target: 'web',
11+
module: {
12+
rules: [
13+
{
14+
test: /\.js[x]?$/,
15+
exclude: /(node_modules)/,
16+
use: {
17+
loader: 'babel-loader'
18+
}
19+
},
20+
{
21+
test: /\.ts$/,
22+
exclude: /(node_modules)/,
23+
use: {
24+
loader: 'ts-loader'
25+
}
26+
}
27+
]
28+
},
29+
plugins: [
30+
new webpack.ProvidePlugin({
31+
jQuery: 'jquery',
32+
$: 'jquery',
33+
jquery: 'jquery',
34+
'window.jQuery': 'jquery'
35+
})
36+
],
37+
resolve: {
38+
modules: [
39+
path.resolve(mainPath, 'src'),
40+
path.resolve(directory),
41+
'node_modules'
42+
],
43+
extensions: ['.ts', '.js', '.jsx', '.json']
44+
}
45+
};
46+
47+
module.exports = webpackMerge(common, {
48+
devtool: 'eval-source-map',
49+
output: {
50+
filename: 'bundle.js',
51+
sourceMapFilename: '[file].map'
52+
},
53+
devServer: {
54+
contentBase: path.resolve(__dirname),
55+
// contentBase: path.resolve('.'),
56+
// historyApiFallback: true
57+
},
58+
plugins: [
59+
new webpack.DefinePlugin({
60+
'process.env.NODE_ENV': JSON.stringify('development')
61+
})
62+
]
63+
});

‎karma.base.js‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/*!
2+
* Copyright 2019, OpenTelemetry Authors
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
module.exports = {
18+
listenAddress: 'localhost',
19+
hostname: 'localhost',
20+
browsers: ['ChromeHeadless'],
21+
frameworks: ['mocha'],
22+
reporters: ['spec'],
23+
files: ['test/index-webpack.ts'],
24+
preprocessors: { 'test/index-webpack.ts': ['webpack'] },
25+
webpackMiddleware: { noInfo: true }
26+
};

‎package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
"main": "build/src/index.js",
66
"types": "build/src/index.d.ts",
77
"scripts": {
8+
"clean": "lerna run clean",
89
"fix": "lerna run fix",
910
"postinstall": "yarn run bootstrap",
1011
"compile": "lerna run compile",
@@ -13,6 +14,7 @@
1314
"bootstrap": "lerna bootstrap",
1415
"bump": "lerna publish",
1516
"codecov": "lerna run codecov",
17+
"codecov:browser": "lerna run codecov:browser",
1618
"check": "lerna run check",
1719
"predocs-test": "yarn docs",
1820
"docs-test": "lerna run docs-test",

‎packages/opentelemetry-core/karma.conf.js‎

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,17 +15,10 @@
1515
*/
1616

1717
const webpackConfig = require('./webpack/test.config.js');
18+
const karmaBaseConfig = require('../../karma.base');
1819

1920
module.exports = (config) => {
20-
config.set({
21-
listenAddress: 'localhost',
22-
hostname: 'localhost',
23-
browsers: ['ChromeHeadless'],
24-
frameworks: ['mocha'],
25-
reporters: ['spec'],
26-
files: ['test/index-webpack.ts'],
27-
preprocessors: {'test/index-webpack.ts': ['webpack']},
28-
webpack: webpackConfig,
29-
webpackMiddleware: {noInfo: true},
30-
});
21+
config.set(Object.assign({}, karmaBaseConfig, {
22+
webpack: webpackConfig
23+
}))
3124
};

‎packages/opentelemetry-core/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,8 @@
44
"description": "OpenTelemetry Core",
55
"main": "build/src/index.js",
66
"browser": {
7-
"./src/platform/index.ts": "./src/platform/browser/index.ts"
7+
"./src/platform/index.ts": "./src/platform/browser/index.ts",
8+
"./build/src/platform/index.js": "./build/src/platform/browser/index.js"
89
},
910
"types": "build/src/index.d.ts",
1011
"repository": "open-telemetry/opentelemetry-js",

‎packages/opentelemetry-core/webpack/test.config.js‎

Lines changed: 12 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -14,73 +14,21 @@
1414
* limitations under the License.
1515
*/
1616

17-
// This is the webpack configuration for browesr Karma tests.
17+
const webpackNodePolyfills = require('../../../webpack.node-polyfills.js');
18+
19+
// This is the webpack configuration for browser Karma tests.
1820
module.exports = {
1921
mode: 'development',
20-
output: {filename: 'bundle.js'},
21-
resolve: {extensions: ['.ts', '.js']},
22+
target: 'web',
23+
output: { filename: 'bundle.js' },
24+
resolve: { extensions: ['.ts', '.js'] },
2225
devtool: 'inline-source-map',
2326
module: {
2427
rules: [
25-
{test: /\.ts$/, use: 'ts-loader'},
26-
{
27-
parser: {
28-
// This setting configures Node polyfills for the browser that will be
29-
// added to the webpack bundle for Karma tests.
30-
node: {
31-
// Enable the assert library polyfill because that is used in tests
32-
assert: true,
33-
// The assert polyfill from github.com/browserify/commonjs-assert
34-
// also requires the `global` polyfill.
35-
global: true,
36-
37-
// Turn off all other Node.js API polyfills for the browser tests to
38-
// make sure that we are not attempting to use Node-specific APIs in
39-
// the browser code. Instead, we will write browser specific
40-
// implementations of platform functionality we need under the
41-
// `./src/platform/browser` folder. This allows for writing browser
42-
// optimized implementations of the specific needed functionality
43-
// rather than bringing in (sometimes large) polyfills for the
44-
// corresponding Node APIs.
45-
Buffer: false,
46-
__dirname: false,
47-
__filename: false,
48-
buffer: false,
49-
child_process: false,
50-
cluster: false,
51-
console: false,
52-
constants: false,
53-
crypto: false,
54-
dgram: false,
55-
dns: false,
56-
domain: false,
57-
events: false,
58-
fs: false,
59-
http: false,
60-
https: false,
61-
module: false,
62-
net: false,
63-
os: false,
64-
path: false,
65-
process: false,
66-
punycode: false,
67-
querystring: false,
68-
readline: false,
69-
repl: false,
70-
setImmediate: false,
71-
stream: false,
72-
string_decoder: false,
73-
sys: false,
74-
timers: false,
75-
tls: false,
76-
tty: false,
77-
url: false,
78-
util: false,
79-
vm: false,
80-
zlib: false,
81-
},
82-
},
83-
},
84-
],
85-
},
28+
{ test: /\.ts$/, use: 'ts-loader' },
29+
// This setting configures Node polyfills for the browser that will be
30+
// added to the webpack bundle for Karma tests.
31+
{ parser: { node: webpackNodePolyfills } }
32+
]
33+
}
8634
};

0 commit comments

Comments
 (0)