Angular 1.6.0: erreur "Rejet éventuellement non pris en charge"

Question

Nous avons un modèle pour la résolution des promesses dans nos Angulaire de l'app qui nous a bien servi jusqu'Angulaire 1.6.0:

    resource.get().$promise
        .then(function (response) {
        // do something with the response
        }, function (error) {
            // pass the error the the error service
            return errorService.handleError(error);
        });

Et voici comment nous sommes le déclenchement de l'erreur dans le Karma:

    resourceMock.get = function () {
        var deferred = $q.defer();
        deferred.reject(error);
        return { $promise: deferred.promise };
    };

Maintenant, avec la mise à jour 1.6.0, Angulaire est soudain de se plaindre de nos tests unitaires (Karma) pour les demandeurs d'promet avec un "peut-être non gérée rejet d'erreur". Mais nous sommes la manipulation de l'refus, dans la deuxième fonction qui s'appelle une erreur de service.

Qu'est-ce exactement Angulaire à la recherche d'ici? Comment veut-il de nous pour "gérer" le rejet?

Answer 1

Essayez d'ajouter ce code à votre configuration. J'ai eu un problème similaire une fois, et cette solution de contournement a fait l'affaire.

 app.config(['$qProvider', function ($qProvider) {
    $qProvider.errorOnUnhandledRejections(false);
}]);
 

Answer 2

Le code vous montrer va gérer un rejet qui se produit avant l'appel à l' .then. Dans une telle situation, le 2ème rappel vous passez .then sera appelée, et le rejet seront traitées.

Toutefois, lorsque la promesse sur laquelle vous appelez .then de réussite, elle appelle le 1er rappel. Si ce rappel à l'déclenche une exception ou retourne le refus de la promesse, cette résultant de rejet ne sont pas traitées, car le 2ème rappel ne gère pas les rejets en cause par le 1er. Ce est juste la façon dont la promesse implémentations conformes aux Promesses/A+ spécification de travail, et de la quantité de promesses sont conformes.

Vous pouvez illustrer cela avec le code suivant:

function handle(p) {
    p.then(
        () => {
            // This is never caught.
            throw new Error("bar");
        },
        (err) => {
            console.log("rejected with", err);
        });
}

handle(Promise.resolve(1));
// We do catch this rejection.
handle(Promise.reject(new Error("foo")));

Si vous l'exécutez en Nœud, ce qui est conforme aux Promesses/A+, vous obtenez:

rejected with Error: foo
    at Object.<anonymous> (/tmp/t10/test.js:12:23)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.runMain (module.js:604:10)
    at run (bootstrap_node.js:394:7)
    at startup (bootstrap_node.js:149:9)
    at bootstrap_node.js:509:3
(node:17426) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): Error: bar

Answer 3

La première option est de simplement masquer une erreur avec le désactiver en configurant errorOnUnhandledRejections $qProvider de configuration comme le suggère Cengkuru Michael

MAIS cela ne désactiver la journalisation. L'erreur elle-même restera

La meilleure solution dans ce cas - la manipulation d'un rejet avec .catch(fn) méthode:

resource.get().$promise
    .then(function (response) {})
    .catch(function (err) {});

LIENS:

• Promesse
• Angulaire:
  • La migration Angulaire de 1,5 à 1,6
  • $http: supprimer obsolète méthodes de rappel: ()/erreur()'

Answer 4

Résoudre le problème en revenant à Angular 1.5.9 et en réexécutant le test. Il s’agissait d’un problème d’injection simple, mais Angular 1.6.0 l’a remplacé en générant l’erreur «Réception probablement non prise en charge», masquant ainsi l’erreur réelle.

Answer 5

Pour éviter de devoir taper des .catch(function () {}) supplémentaires dans votre code à plusieurs endroits, vous pouvez ajouter un decorator au $exceptionHandler .

C'est une option plus verbeuse que les autres, mais vous n'avez qu'à faire le changement à un endroit.

 angular
    .module('app')
    .config(configDecorators);

configDecorators.$inject = ["$provide"];
function configDecorators($provide) {

    $provide.decorator("$exceptionHandler", exceptionHandler);

    exceptionHandler.$inject = ['$delegate', '$injector'];
    function exceptionHandler($delegate, $injector) {
        return function (exception, cause) {

            if ((exception.toString().toLowerCase()).includes("Possibly unhandled rejection".toLowerCase())) {
                console.log(exception); /* optional to log the "Possibly unhandled rejection" */
                return;
            }
            $delegate(exception, cause);
        };
    }
};