react-fetch-component
react-fetch-component copied to clipboard
Support aborting
Now that fetch
supports aborting using AbortController
via a signal
, it would be nice if we did as well. Currently we track whether the component is mounted and not call setState
, but properly cancelling the fetch request would be better, especially since it's considered an anti-pattern
Some details:
- https://developers.google.com/web/updates/2017/09/abortable-fetch
- https://developer.mozilla.org/en-US/docs/Web/API/AbortController/abort
- https://github.com/whatwg/fetch/issues/447
- https://stackoverflow.com/questions/31061838/how-do-i-cancel-an-http-fetch-request
It's only supported in recent green browsers (Chrome, Firefox, Edge, Safari (desktop) and not IE, iOS Safari (currently) so we will need to support opting in / polyfiling.
A quick search returned this polyfill, and Netflix's yetch
(which you should be able to pass to the fetchFunction
prop
- https://github.com/mo/abortcontroller-polyfill
- https://github.com/Netflix/yetch
Maybe this is an opt-in via cancellable
prop, and we continue to track mounted otherwise.
Hook implementation that might be worth looking at: https://github.com/mauricedb/use-abortable-fetch
Not sure if fetch-mock supports testing aborting, or if this is ultimately just handled by node-fetch