Add Sentry error reporting

Author: stevenmirabito

conditional/__init__.py

@@ -1,25 +1,30 @@
 import os
 import subprocess
-from flask import Flask, redirect, request
+from flask import Flask, redirect, request, render_template, g
 from flask_sqlalchemy import SQLAlchemy
 from flask_migrate import Migrate
 from csh_ldap import CSHLDAP
+from raven import fetch_git_sha
+from raven.contrib.flask import Sentry
+from raven.exceptions import InvalidGitRepository
 import structlog
 
 app = Flask(__name__)
 
-config = os.path.join(os.getcwd(), "config.py")
+config = os.path.join(app.config.get('ROOT_DIR', os.getcwd()), "config.py")
 
 app.config.from_pyfile(config)
 app.config["SQLALCHEMY_TRACK_MODIFICATIONS"] = False
 
-app.config["GIT_REVISION"] = subprocess.check_output(['git',
-                                                      'rev-parse',
-                                                      '--short',
-                                                      'HEAD']).decode('utf-8').rstrip()
+try:
+    app.config["GIT_REVISION"] = fetch_git_sha(app.config["ROOT_DIR"])[:7]
+except (InvalidGitRepository, KeyError):
+    app.config["GIT_REVISION"] = "unknown"
+
 db = SQLAlchemy(app)
 migrate = Migrate(app, db)
 logger = structlog.get_logger()
+sentry = Sentry(app)
 
 ldap = CSHLDAP(app.config['LDAP_BIND_DN'],
                app.config['LDAP_BIND_PW'],
@@ -51,7 +56,6 @@
 app.register_blueprint(slideshow_bp)
 app.register_blueprint(cache_bp)
 
-from conditional.util.flask import render_template
 from conditional.util.ldap import ldap_get_member
 
 @app.route('/<path:path>')
@@ -67,16 +71,38 @@ def default_route():
 @app.errorhandler(404)
 @app.errorhandler(500)
 def route_errors(error):
-    username = request.headers.get('x-webauth-user')
-    member = ldap_get_member(username)
     data = dict()
-    data['username'] = member.uid
-    data['name'] = member.cn
-    code = error.code
-    return render_template(request=request,
-                            template_name='errors.html',
-                            error=str(error),
+    username = request.headers.get('x-webauth-user')
+
+    # Handle the case where the header isn't present
+    if username is not None:
+        member = ldap_get_member(username)
+        data['username'] = member.uid
+        data['name'] = member.cn
+    else:
+        data['username'] = "unknown"
+        data['name'] = "Unknown"
+
+    # Figure out what kind of error was passed
+    if isinstance(error, int):
+        code = error
+    elif hasattr(error, 'code'):
+        code = error.code
+    else:
+        # Unhandled exception
+        code = 500
+
+    # Is this a 404?
+    if code == 404:
+        error_desc = "Page Not Found"
+    else:
+        error_desc = type(error).__name__
+
+    return render_template('errors.html',
+                            error=error_desc,
                             error_code=code,
+                            event_id=g.sentry_event_id,
+                            public_dsn=sentry.client.get_public_dsn('https'),
                             **data), int(code)
 
 @app.cli.command()

conditional/templates/errors.html

@@ -1,15 +1,19 @@
 {% extends "nav.html" %}
-{% block title %}
-{{ error_code }}
-{% endblock %}
+{% block title %}Error {{ error_code }}{% endblock %}
 {% block body %}
 <div class="container main error-page align-center">
     <div class="col-xs-12">
         <img src="/static/images/material_attention.svg" alt="Attention!">
         <h1>Congratulations or I'm Sorry...</h1>
         <h2>Something has gone terribly wrong!</h2>
-        <h3>The following error has been reported:</h3>
-        <p>{{ error }}</p>
+        <h3>{{ error }}</h3>
+        {% if event_id %}
+        <p>The error identifier is: {{ event_id }}</p>
+        {% endif %}
     </div>
+    {% if event_id %}
+    <button type="button" class="btn btn-primary" data-module="errorReport" data-event="{{ event_id }}">Report this Error</button>
+    {% endif %}
 </div>
+
 {% endblock %}

config.sample.py

@@ -1,7 +1,9 @@
 import os
+from raven import fetch_git_sha
 
 # Flask config
 DEBUG = True
+ROOT_DIR = os.path.dirname(__file__)
 HOST_NAME = 'localhost'
 APP_NAME = 'conditional'
 IP = '0.0.0.0'
@@ -12,6 +14,13 @@
 LDAP_BIND_DN = 'cn=conditional,ou=Apps,dc=csh,dc=rit,dc=edu'
 LDAP_BIND_PW = ''
 
+# Sentry config
+# Do not set the DSN for local development
+SENTRY_CONFIG = {
+    'dsn': '',
+    'release': fetch_git_sha(ROOT_DIR),
+}
+
 # Database config
 SQLALCHEMY_DATABASE_URI = 'sqlite:///{}'.format(os.path.join(os.getcwd(), "data.db"))
 ZOO_DATABASE_URI = 'mysql+pymysql://user:pass@host/database'

frontend/javascript/app.js

@@ -1,3 +1,15 @@
+// Install Raven to send errors to Sentry
+import Raven from 'raven-js';
+Raven
+    .config('https://[email protected]/133175')
+    .install();
+
+// Capture unhandled exceptions in promises
+window.addEventListener('unhandledrejection', (err) => {
+    Raven.captureException(err.reason);
+});
+
+// Load the rest of the modules
 import "jquery";
 import "bootstrap";
 import "./modules";

frontend/javascript/modules/errorReport.js

@@ -0,0 +1,19 @@
+import Raven from 'raven-js';
+
+export default class ErrorReport {
+    constructor(btn) {
+        this.btn = btn;
+        this.eventId = this.btn.dataset.event;
+        this.render();
+    }
+    
+    render() {
+        this.btn.addEventListener('click', () => this._invokeRavenModal());
+    }
+    
+    _invokeRavenModal() {
+        Raven.showReportDialog({
+            eventId: this.eventId
+        });
+    }
+}

frontend/stylesheets/pages/_errors.scss

@@ -20,17 +20,16 @@
   }
 
   h2 {
-    margin-bottom: 80px;
+    margin-bottom: 50px;
     font-size: 30px;
   }
 
   h3 {
-    margin: 0;
     font-size: 25px;
   }
 
   p {
-    font-size: 20px;
+    font-size: 15px;
     font-weight: lighter;
   }
 }

frontend/stylesheets/partials/_global.scss

@@ -1,3 +1,7 @@
+.navbar-fixed-bottom, .navbar-fixed-top {
+  z-index: 900;
+}
+
 .sub-header {
   border-bottom: 1px solid #eee;
   padding-bottom: 10px;
@@ -68,7 +72,7 @@ tr {
 .footer-version {
   display: block;
   opacity: .3;
-  margin: 10px auto 20px;
+  margin: 50px auto 20px;
   text-align: center;
   color: #000;
   font-size: .9em;

package.json

@@ -89,6 +89,7 @@
     "object-assign": "4.1.0",
     "open": "0.0.5",
     "pretty-hrtime": "1.0.2",
+    "raven-js": "^3.9.2",
     "require-dir": "0.3.0",
     "sinon": "1.17.4",
     "sinon-chai": "2.8.0",

requirements.txt

@@ -10,3 +10,4 @@ flask_sqlalchemy
 flask_migrate
 pylint
 psycopg2
+raven[flask]