Network failures result in different `err` param passed to `onError`

Aperta
#271 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
45/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Ferma
Stack tecnologico
javascript, react
Ambito
frontend

Direzione di ricerca

Inizia in request.js confrontando il gestore xhr.onerror con il percorso di errore di xhr.onload e la chiamata a getError mostrata nell’issue. Riproduci l’upload bloccato nell’esempio semplice, quindi verifica che gli errori di rete passino a onError un errore con un messaggio visibile all’utente coerente con gli errori del server.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Steps to reproduce

  1. Go to https://react-component.github.io/upload/examples/simple.html
  2. Upload a file
  3. Notice that as outlined in the example code
      onError(err) {
        console.log('onError', err);
      },

a error message is printed. This error message could be used to show some diagnostics to the user. The error message is assembled via this function in request.js

  xhr.onload = function onload() {
    // allow success when 2xx status
    // see https://github.com/react-component/upload/issues/34
    if (xhr.status < 200 || xhr.status >= 300) {
      return option.onError(getError(option, xhr), getBody(xhr));
    }

    return option.onSuccess(getBody(xhr), xhr);
  };

This is all well and correct.

  1. Now in the Network tab of DevTools right click on the previous upload.do request and Block it from the menu (to simulate a network failure).
  2. Upload a file - will be marked as Blocked in the Network tab.
  3. console.log(err) in onError now outputs a different error object without a message. This is totally different from the previous err parameter and not usable for printing to the user anymore

Looking at the stacktrace this code now comes from

  xhr.onerror = function error(e) {
    option.onError(e);
  };

also in request.js just above xhr.onload

Expected results

Network failures should also pass the same err object to the onError prop as there would be a server message failure, so that it is easier to show such errors to the user.

Lingua principale
TypeScript
Stelle
804
Fork
323
Merge medio
12m
PR unite (30g)
1

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di react-component/upload

Tutte le issue di react-component/upload

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.