23.022015

Browsertests Teil 3 - JavaScript Fehlertracking mit Google Analytics

In meinen letzten Beiträgen zu Browsertesting habe ich schon die Vorzüge von Browserstack und das einbinden einer eigenen Debug-Konsole erläutert. Heute möchte ich auf JavaScript-Fehlertracking eingehen. Die User besurfen deine Webseite in den verschiedensten Browsern und Geräten. Je nach Kombination, verhält sich die Seite anders oder sie wird anders gerendert. Ein Testen dieser Device-Browser Kombinationen ist mühsam und es kann schon einmal vorkommen das man eine Kombination vergisst. Falls beim User nun , in irgendeinem "esoterischen" Browser, JavaScript Fehler auftreten bekommen wir als Entwickler dies garnicht oder erst spät mit.

Zu diesem Thema haben sich schon mehrere Leute gedanken gemacht, man kann z.B. kommerzielle Tools wie musculatrack.jssentry oder Qbaka verwenden. Diese bieten z.B. die Unterstützung von automatischen Stack Traces, Sourcemaps, etc.

 

Für große Projekte kann der Einsatz eines solchen Services auch sinnvoll sein, betreibt man Allerdings ein privates oder nicht kommerzielles Projekt steht die Verwendung eines Bezahl-Dienstes wahrscheinlich nicht zur Diskussion. Hier kommt Google Analytics ins Spiel. Google Analytics ist eigentlich dazu gedacht den Traffic, Browserverteilung etc. zu tracken, also wieso nicht auch JavaScript Fehler nach Google Analytics tracken? Um so ein Fehler Event zu Tracken könnt ihr euch an das Error-Event des Browsers hängen:


if (typeof window.addEventListener === 'function') {
	window.addEventListener('error', function(e) {
		var message = e.message + ' ' + e.filename + ' ' + e.lineno;
		 _gaq.push(['_trackEvent', 'JavaScript Error', message, document.URL, true]);
	});
} else if (typeof window.attachEvent === 'function') {
	window.attachEvent('onerror', function(e) {
		var message = e.message + ' ' + e.filename + ' ' + e.lineno;
		_gaq.push(['_trackEvent', 'JavaScript Error', message, document.URL, true]);
	});
}

Nun könnt ihre euch zumindest einen Überblick verschaffen in welchen Browser es unter Umständen zu Probleme kommen kann. Falls euer Code ugly/minified wurde werden euch die Fehlermeldungen nicht besonders helfen, aber ihr wisst schon einmal das überhaupt ein Fehler aufgetreten ist.