fetch-progress

library1.3.0jsnpmunverified

A lightweight JavaScript library that adds progress tracking (percentage, speed, ETA, transferred bytes) to the standard fetch API. Current stable version is 1.3.0, released irregularly. Key differentiator: simple wrapper around fetch that provides real-time progress without replacing the native fetch. Ships TypeScript types. Suitable for browser and Node environments with fetch support. No dependencies, zero-config.

storage

npm install fetch-progress

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · FETCH-PROGRESS

fetch-progress

storagejavascriptv1.3.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

fetchProgress

✓ import fetchProgress from 'fetch-progress'

✗ import { fetchProgress } from 'fetch-progress'

Default export only; named import will fail.

fetchProgress

✓ const fetchProgress = require('fetch-progress')

✗ const { fetchProgress } = require('fetch-progress')

In CommonJS, default export is the whole module.exports object.

ProgressOptions

✓ import type { ProgressOptions } from 'fetch-progress'

TypeScript type import; available in versions >=1.0.0

Shows how to wrap a fetch call to track download progress with percentage and ETA.

import fetchProgress from 'fetch-progress'; const url = 'https://example.com/large-file'; const onProgress = (progress) => { console.log(`Downloaded ${progress.percentage}% - ETA ${progress.eta}s`); }; fetch(url) .then(fetchProgress({ onProgress })) .then(response => response.blob()) .then(blob => { console.log('Download complete, blob size:', blob.size); });

Debug

Known issues

gotchafetchProgress must be called on the promise before using response methods (e.g., response.json()). If you chain .json() before fetchProgress, progress will not be tracked.

fix

Ensure fetchProgress() is applied immediately after fetch, before any .then that reads the body.

affects: *

gotchaThe progress object does not include a 'percentage' key for responses with unknown content-length (e.g., chunked transfer encoding without Content-Length header).

fix

Check for progress.total !== undefined before using percentage.

affects: *

deprecatedThe 'onError' callback option is deprecated. Errors should be handled via standard promise .catch() instead.

fix

Remove onError option and use .catch() on the fetch promise.

affects: >=1.2.0

gotchafetchProgress only tracks HTTP response body progress, not request upload progress. It cannot be used for upload tracking.

fix

Use XMLHttpRequest or another library (e.g., axios with onUploadProgress) for upload progress.

affects: *

Errors

Common errors & fixes

TypeError: fetchProgress is not a function

Named import instead of default import.

fix

Use 'import fetchProgress from "fetch-progress"' (no curly braces).

Uncaught TypeError: Failed to execute 'json' on 'Response': body stream already read

fetchProgress reads the body stream to track progress, so subsequent body methods fail if called after progress is consumed.

fix

Use response.clone() before calling fetchProgress, or restructure your code to read body after progress completes.

Cannot read property 'total' of undefined

Using progress.total when Content-Length header is missing.

fix

Guard with if (progress.total !== undefined) before accessing progress.total.

Upgrade

Version history

1.3.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

32 hits · last 30 days

node

Amazon

OpenAI (training)

Resources

githubhttps://github.com/samundrak/fetch-progress ↗

packagefetch-progress ↗

homepagehttps://github.com/samundrak/fetch-progress ↗