@stardazed/streams-polyfill

@stardazed/streams-polyfill

This package provides a full polyfill for the Web Streams Standard for use in browsers, including patching the built-in fetch and Response types to support the body field for both downloading and uploading.

This uses the fully compliant Stardazed streams implementation and the streams fetch adapter to connect the implementation to the current environment.

💡 NB: if you have your own ReadableStream replacement — including mocks or modifications of the built-in type — and want to use it with fetch, you can use the fetch adapter to have your code work with fetch transparently.

Supported Environments

The core streams functionality requires ES6 classes, Symbol, Promise and typed arrays to be implemented. Testing has only been done on current browsers but it should work with Safari 9+, Edge 13+, Firefox 45+ and Chrome 42+. IE is not supported.

Adapting fetch to work with streams requires that the browser has native fetch and Proxy objects. This comes down to: Safari 10.1+ (iOS 10.3+), Edge 14+, Firefox 52+ and Chrome 54+.

I have not tested older browsers with a fetch polyfill. It may work, it may not. If you try it out, ensure the fetch polyfill loads before this one.

Node

Node (as of July 2018) has no built-in fetch or web streams support. I did not do extensive tests but this polyfill, when require()d, will install all streams types in Node's global object and they then work as expected. Like with browsers, cooperation with any fetch polyfills available has not been tested.

In general, polyfills are not used in Node. If you want to use web streams in Node, consider using the Stardazed streams package directly and optionally wrapping any fetch implementations you use with the streams fetch adapter.

Node versions >= 7 should be sufficient.

Usage

There are two ways to use this package, as a simple <script> include or as an import with side effects.

Direct include

Use your favourite CDN supplier or host the file yourself. Make sure to have the polyfill load before any code that uses ReadableStream, fetch or Response. To be safe have it load as the first script.

<script src="//unpkg.com/@stardazed/streams-polyfill/dist/sd-streams-polyfill.min.js"></script>

Importless import

First add this package to your project with your package manager of choice.

pnpm install @stardazed/streams-polyfill
npm install @stardazed/streams-polyfill
yarn add @stardazed/streams-polyfill

Then import it in your index.js/ts file, at application startup. Like with the include method above, make sure this code runs before everything else.

import "@stardazed/streams-polyfill";

All stream types are available globally after that point, no further actions are needed.

API Usage

See the following resources for more info on using the Streams standard.

• The Web Streams Standard Specification for documentation, examples, etc.
• Mozilla's Streams API site for a guide through the APIs with examples.

Copyright

© 2018 by Arthur Langereis - @zenmumbler

License

MIT