airbrake / airbrake-js

Airbrake JavaScript Notifier
https://airbrake.io
MIT License
422 stars 139 forks source link

Uncaught ReferenceError: Notifier is not defined airbrake angularjs #1258

Open madhusudhanv255 opened 2 years ago

madhusudhanv255 commented 2 years ago

๐Ÿž bug report

Affected Package

The issue is caused by package @airbrake/browser ### Description We are trying to upgrade airbrake in our angularjs 1.5.7 project. I have installed @airbrake/browser and included in head of index.html and followed same steps as given in git for angularjs but its giving Uncaught ReferenceError: Notifier is not defined error. Do we need to install any separate library for notifier in angularjs 1.5. We are using "airbrake-js": "^1.6.8" and trying to upgrade to "@airbrake/browser": "^2.1.7" ## ๐ŸŒ Your Environment **@airbrake/\* version:**


"airbrake-js": "^1.6.8"

Anything else relevant?

thompiler commented 2 years ago

Hi @madhusudhanv255,

There might be an error in the instructions. Can you try accessing the Notifier through Airbrake like this?

Example hello world app with Airbrake and AngularJS 1.5.7:

index.html

<!DOCTYPE html>
<html ng-app="app">
<head>
    <meta charset="utf 8">
    <title>Error Bot 2001</title>
</head>
<body>
<h1 ng-controller="HelloWorldCtrl">{{message}}</h1>
<script src="https://code.angularjs.org/1.5.7/angular.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@airbrake/browser"></script>
<script src="app.js"></script>
</body>
</html>

app.js

var module = angular.module("app", []);

module
  .factory('$exceptionHandler', function ($log) {
    var airbrake = new Airbrake.Notifier({ // <-------- Access notifier like this
      projectId: 1234,       // Airbrake project id
      projectKey: 'qwerty123456' // Airbrake project API key
    });

    airbrake.addFilter(function (notice) {
      notice.context.environment = 'production';
      return notice;
    });

    return function (exception, cause) {
      $log.error(exception);
      airbrake.notify({error: exception, params: {angular_cause: cause}});
    };
  });

module.controller("HelloWorldCtrl", function($scope) {
  throw new Error("Uh oh, something happened"); <---- Throw an error

  $scope.message="Hello World";
});