test: Add manual webpack tests with jsdom browser environment (#1760)

* test: Add manual webpack tests with jsdom browser environment

* test: Exit process when anything errors out

* Use jsdom v11 to support Node 6

Author: kamilogorek

packages/browser/package.json

@@ -23,6 +23,7 @@
   "devDependencies": {
     "@types/md5": "2.1.32",
     "chai": "^4.1.2",
+    "jsdom": "^11.12.0",
     "karma": "^2.0.2",
     "karma-chai": "^0.1.0",
     "karma-chrome-launcher": "^2.2.0",
@@ -47,7 +48,8 @@
     "rollup-plugin-uglify": "^3.0.0",
     "sinon": "^5.0.3",
     "tslint": "^5.11.0",
-    "typescript": "^3.0.1"
+    "typescript": "^3.0.1",
+    "webpack": "^4.26.0"
   },
   "scripts": {
     "build": "rollup --config",
@@ -65,6 +67,7 @@
     "test:integration": "karma start test/karma/karma.integration.config.js",
     "test:integration:watch": "karma start test/karma/karma.integration.config.js --auto-watch --no-single-run",
     "test:saucelabs": "karma start test/karma/karma.saucelabs.config.js",
+    "test:manual": "node test/manual/npm-build.js && rm test/manual/tmp.js",
     "size:check": "cat build/bundle.min.js | gzip -9 | wc -c | awk '{$1=$1/1024; print $1,\"kB\";}'",
     "version": "node ../../scripts/versionbump.js src/version.ts"
   },

packages/browser/test/manual/npm-build.js

@@ -0,0 +1,50 @@
+const fs = require('fs');
+const path = require('path');
+const webpack = require('webpack');
+const { JSDOM } = require('jsdom');
+
+webpack(
+  {
+    entry: path.join(__dirname, 'test-code.js'),
+    output: {
+      path: __dirname,
+      filename: 'tmp.js',
+    },
+    mode: 'production',
+  },
+  (err, stats) => {
+    if (err) {
+      console.error(err.stack || err);
+      if (err.details) {
+        console.error(err.details);
+      }
+      return;
+    }
+
+    const info = stats.toJson();
+
+    if (stats.hasErrors()) {
+      console.error(info.errors);
+    }
+
+    if (stats.hasWarnings()) {
+      console.warn(info.warnings);
+    }
+
+    runTests();
+  },
+);
+
+function runTests() {
+  const bundlePath = path.join(__dirname, 'tmp.js');
+  const { window } = new JSDOM(``, { runScripts: 'dangerously' });
+
+  window.onerror = function() {
+    process.exit(1);
+  };
+
+  const myLibrary = fs.readFileSync(bundlePath, { encoding: 'utf-8' });
+  const scriptEl = window.document.createElement('script');
+  scriptEl.textContent = myLibrary;
+  window.document.body.appendChild(scriptEl);
+}

packages/browser/test/manual/test-code.js

@@ -0,0 +1,62 @@
+const Sentry = require('../../dist/index.js');
+
+// Init
+Sentry.init({
+  dsn: 'https://[email protected]/42',
+  beforeSend(event) {
+    console.log('Got an event');
+    return null;
+  },
+  beforeBreadcrumb(crumb) {
+    console.log(`Got a breadcrumb: ${crumb.category}`);
+    return crumb;
+  },
+});
+
+// Configure
+Sentry.configureScope(scope => {
+  scope.setExtra('foo', 'bar');
+  scope.setFingerprint('foo');
+  scope.setLevel('warning');
+  scope.setTag('foo', 'bar');
+  scope.setUser('foo', 'bar');
+});
+
+// Breadcrumbs integration
+window.console.log('Console', 'Breadcrumb');
+window.console.error({ foo: 'bar' });
+
+const clickEvent = new MouseEvent('click');
+const clickElement = window.document.createElement('button');
+clickElement.addEventListener('click', () => {
+  // do nothing, just capture a breadcrumb
+});
+clickElement.dispatchEvent(clickEvent);
+
+const keypressEvent = new KeyboardEvent('keypress');
+const keypressElement = window.document.createElement('input');
+keypressElement.addEventListener('keypress', () => {
+  // do nothing, just capture a breadcrumb
+});
+keypressElement.dispatchEvent(keypressEvent);
+
+// Basic breadcrumb
+Sentry.addBreadcrumb({
+  category: 'basic',
+  message: 'crumb',
+});
+
+// Capture methods
+Sentry.captureException(new Error('foo'));
+Sentry.captureMessage('bar');
+
+// Scope behavior
+Sentry.withScope(scope => {
+  scope.setExtra('baz', 'qux');
+  scope.setFingerprint('baz');
+  scope.setLevel('error');
+  scope.setTag('baz', 'qux');
+  scope.setUser('baz', 'qux');
+  Sentry.captureException(new TypeError('bar'));
+  Sentry.captureMessage('baz');
+});

scripts/browser-integration.sh

@@ -6,4 +6,5 @@ yarn
 yarn build
 cd packages/browser
 yarn test:integration
+yarn test:manual