Sentry-javascript: Événement : Rejet de promesse sans erreur capturé avec les clés : currentTarget, isTrusted, target, type

Nous avons également commencé à les voir au cours des deux dernières semaines. Je viens juste de commencer à y réfléchir donc je n'ai pas plus de détails sur la cause.

Idem ici, maintenant sur Sentry v5.15.5.

Quelqu'un peut-il fournir un lien vers ce type d'événement capturé dans Sentry ? Cela ressemble à une erreur de chargement de script (notez le target lequel cet événement a été déclenché)

@kamilogorek pouvez-vous m'envoyer l'e-mail de votre entreprise ? Je peux partager des exemples d'événements.

@Santas [email protected]

Si vous avez besoin de plus d'exemples, je peux également en envoyer à @kamilogorek -- faites-le moi savoir.

@sheelah oui, s'il

@sheelah , pour être honnête, nous ne pouvons pas améliorer grand-chose. JS ne nous donne pas plus d'informations que nous fournissons déjà. Chaque fois qu'une instance d'un objet de promesse est rejetée, elle déclenche l'événement onunhandledrejection (il en va de même pour onerror dans la description de l'OP).

https://developer.mozilla.org/en-US/docs/Web/API/Window/unhandledrejection_event

Cependant, il n'y a rien qui empêcherait quiconque de passer des trucs aléatoires là-dedans.
Ainsi, un code comme celui-ci Promise.reject("whatever") ou Promise.reject(jQueryBecauseWhyNot) est un code JS totalement valide.

Chaque fois que nous rencontrons quelque chose qui n'est pas une valeur primitive, un objet qui contient la trace de la pile (par exemple Error ) ou une exception DOM interne, nous devons nous rabattre sur une simple sérialisation d'objets et essayer d'extraire toutes les informations que nous pouvons de celui-ci. Vous pouvez voir le fichier eventbuilder.ts pour une liste des chemins possibles que cette "toute valeur aléatoire" transmise au gestionnaire d'événements peut emprunter - https://github.com/getsentry/sentry-javascript/blob/master/packages/ navigateur/src/eventbuilder.ts#L17 -L80

Malheureusement, je ne sais pas si nous pouvons le rendre plus générique pour gérer plus de types d'entrée.
Si quelqu'un a des commentaires concernant ce processus, je suis totalement ouvert aux suggestions.

(répondu ici au lieu de votre e-mail, pour garder la conversation publique pour tout le monde)

De mes observations :

• Ne se produit que dans diverses versions récentes de Safari sur mobile ou ordinateur de bureau ;
• J'ai quelques bibliothèques installées dans mon application Web telles que ZXing et browser-image-compression , mais aucun script de suivi tiers ;
• Cela semble se produire exactement au même moment qu'un appel d'API échoue avec une erreur réseau (code 0).
• Dans mon cas, il s'agit plus précisément d'un ProgressEvent , pas seulement d'un événement - qui semble faire partie de la bibliothèque de requêtes HTTP (j'utilise axios).

ADDITIONAL DATA

__serialized__ | {
    currentTarget: [object Null],
    isTrusted: [Circular ~],
    target: [object FileReader],
    type: error}
-- | --

Je viens également de recevoir un rapport avec « Rejet de promesse sans erreur capturé avec la valeur : null ». Semblable à ce que @anton-bot a mentionné ci-dessus, l'utilisateur concerné utilisait Safari 13.1.2 sur Mac OS X 10.15.6.

J'ai regardé dans mon code d'application compilé pour les appels reject( où un objet éventuellement null est fourni, mais je n'en ai pas trouvé, alors je me demandais s'il pouvait s'agir d'une extension de navigateur ou d'un troisième scénario de fête. Comme il n'y a pas de trace de pile ou de chapelure, il est assez difficile de savoir ce qui s'est exactement passé.

Je le constate également depuis deux semaines. Sur notre site, nous ne l'avons vu que sur des pages qui utilisent l'API javascript de Google Maps, j'ai donc le sentiment que cela pourrait être lié à cela. Quelqu'un d'autre a-t-il vu cela sur des URL utilisant Google Maps ?

Edit : Jusqu'à présent, nous avons vu le problème sur iOS et Android

Modifier : Données supplémentaires :

{
  currentTarget: [object Null], 
  isTrusted: [Circular ~], 
  target: head > script[type="text/javascript"], 
  type: error
}

@asbjornh non je n'ai pas Google Maps sur ma page

@kamilogorek Les données supplémentaires d'OP (et les miennes) seraient-elles causées par quelque chose comme ça Promise.reject(new Event("error")) ? Ou les événements Sentry pour cette situation auraient-ils toujours des charges utiles qui ressemblent à des événements de navigateur ?

@asbjornh oui, cela passerait ensuite par ce flux - https://github.com/getsentry/sentry-javascript/blob/caff9e7b308f99f04443d57d990c252a51a153bf/packages/browser/src/eventbuilder.ts#L97 -L107

je reçois aussi la même erreur

Cette erreur vient d'épuiser ma capacité de quota.

nous avons 289 événements de cela au cours des dernières 24h - et notre page n'est même pas encore en ligne ..

{
currentTarget: [object Null], 
isTrusted: [Circular ~], 
target: head > link, 
type: error
}

Nous utilisons next.js

pareil ici avec cra 😅

Il semble que ce problème soit causé par quelque chose à peu près comme ceci :

new Promise((resolve, reject) => {
  const script = document.createElement('script');
  script.src = src;
  script.onload = resolve;
  script.onerror = reject;
  document.body.appendChild(script);
});

Le hook onerror recevra en fait un objet Event , au lieu d'une instance Error , ce qui cause les problèmes mentionnés ci-dessus. Cela peut être évité en enveloppant le Event avec un Error comme suggéré par https://developer.mozilla.org/de/docs/Web/API/HTMLScriptElement :

new Promise((resolve, reject) => {
  const script = document.createElement('script');
  script.src = src;
  script.onload = resolve;
  script.onerror = event => {
    reject(new Error(`Failed to load ${event.target.src}`));
  };
  document.body.appendChild(script);
});

Dans mon cas, c'était le mécanisme de préchargement 9.5.2 Next.js qui le provoquait sur Firefox, juste au cas où quelqu'un aurait un cas similaire. (peut-être ici ? https://github.com/getsentry/sentry-javascript/issues/2546#issuecomment-697771381) C'est le problème : https://github.com/vercel/next.js/pull/16757 et peut être résolu en passant à 9.5.3 ou Canary.

L'erreur est cependant beaucoup plus détaillée dans le navigateur :

Uncaught (in promise) 
error
bubbles: false
...
...
as: "fetch"
assignedSlot: null
attributes: NamedNodeMap(3
0: href="/_next/data/wmQYPCwvbuBulJfEwTMRf/smartwatches/fitbit-ionic.json"
1: rel="prefetch"
2: as="fetch"
as: as="fetch"
href: href="/_next/data/wmQYPCwvbuBulJfEwTMRf/smartwatches/fitbit-ionic.json"
length: 3
rel: rel="prefetch"
...
...
​
isTrusted: true
originalTarget: <link href="/_next/data/wmQYPCwvbuBu…tches/fitbit-ionic.json" rel="prefetch" as="fetch">
returnValue: true
srcElement: <link href="/_next/data/wmQYPCwvbuBu…tches/fitbit-ionic.json" rel="prefetch" as="fetch">​
target: <link href="/_next/data/wmQYPCwvbuBu…tches/fitbit-ionic.json" rel="prefetch" as="fetch">
timeStmp: 25366
type: "error"
...

Comment pouvons-nous faire en sorte que Sentry capture ces données ?

@Turbo87 OUI ! C'est exactement pourquoi nous ne le voyons que sur les pages utilisant @googlemaps/js-api-loader . Ils font exactement ce que vous décrivez ici

Merci!!