> ## Documentation Index
> Fetch the complete documentation index at: https://launchdarkly.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Requirements and polyfills

<View title="Developer" />

<View title="Federal docs" />

<View title="EU docs" />

This topic explains how to add different types of polyfills in the JavaScript SDK.

Web browsers vary widely in their support of specific features and standards. It is common in JavaScript development to use [polyfills](https://developer.mozilla.org/en-US/docs/Glossary/Polyfill) to ensure the widest possible compatibility. Polyfills are scripts that implement a feature in case it is not built into the browser.

Three features that the LaunchDarkly JavaScript SDK uses that may not be available on every browser are `Promise`, `EventSource`, and `document.querySelectorAll()`.

<Info>
  **Older versions of the JavaScript SDK require the LaunchDarkly EventSource polyfill**

  In the JavaScript SDK, v3.x and earlier, if you use `REPORT`, enable the [`useReport` configuration option](https://launchdarkly.github.io/js-client-sdk/interfaces/LDOptions.html#useReport), and want to use streaming, then you must use the LaunchDarkly EventSource polyfill. This is true whether or not your browser already supports `EventSource`. To learn more, read [EventSource](#eventsource), below.

  The JavaScript SDK v4.x supports `REPORT` directly. If you enable the [`useReport` configuration option](https://launchdarkly.github.io/js-core/packages/sdk/browser/docs/interfaces/LDOptions.html#useReport), no polyfill or additional configuration is required.
</Info>

## Add a polyfill

For each of these features, there are two ways you can provide the polyfill script.

The first way is to load the polyfill script directly from a CDN that hosts the package, with a `<script>` tag within the `<head>` element of your page. You must put the `<script>` tag for the polyfill *before* any scripts that make use of the LaunchDarkly SDK.

Here is how to load a polyfill script directly from a CDN:

<CodeGroup>
  ```html title="HTML" lines wrap theme={null}
  <script src="[URL of the polyfill script]"></script>
  ```
</CodeGroup>

If you are using a package manager such as NPM or Yarn, and using `require()` to load modules at runtime, you would first add the polyfill package to your project:

<CodeGroup>
  ```bash title="Shell" lines wrap theme={null}
  npm install package-name-of-polyfill@package.version.number
  ```
</CodeGroup>

Then, make sure that you `require` the polyfill module prior to initializing the LaunchDarkly client:

<CodeGroup>
  ```js title="JavaScript" lines wrap theme={null}
  require('package-name-of-polyfill');
  ```
</CodeGroup>

You only need to use one of these methods. You do not need to use both a CDN and a package manager.

## Install polyfills for specific features

Three features that the LaunchDarkly SDK uses that may not be available on every browser are `Promise`, `EventSource`, and `document.querySelectorAll()`. This section describes how to install a polyfill for each of them.

### Promise

The JavaScript SDK relies heavily on JavaScript Promises. [Browsers that do not support Promise](https://caniuse.com/?search=Promise) include Internet Explorer and older versions of Microsoft Edge. If you need to support these browsers, you will need to install a polyfill for Promise, such as [es6-promise](https://github.com/stefanpenner/es6-promise).

To install a polyfill for Promise:

<CodeGroup>
  ```html title="HTML" lines wrap theme={null}
  <!-- loading polyfill from CDN -->
  <script src="https://unpkg.com/es6-promise@4.2.4/dist/es6-promise.auto.min.js"></script>
  ```

  ```bash title="Shell" lines wrap theme={null}
  # installing polyfill as a package
  npm install es6-promise@4.2.4
  ```

  ```js title="JavaScript" lines wrap theme={null}
  // loading polyfill as a package
  require('es6-promise/auto');
  ```
</CodeGroup>

### EventSource

The JavaScript SDK uses [`EventSource`](https://developer.mozilla.org/en-US/docs/Web/API/EventSource) to provide a live streaming connection to LaunchDarkly, if you have enabled streaming.

By default, the JavaScript SDK client opens a streaming connection if you subscribe to `change` or `change:flag-key` events. You can also open a streaming connection explicitly by setting the `streaming` configuration option or using the `setStreaming` method. **If you never enable streaming, you do not need `EventSource`.** To learn more, read [`streaming`](https://launchdarkly.github.io/js-client-sdk/interfaces/LDOptions.html#streaming).

EventSource is [widely available in modern browsers](https://caniuse.com?search=EventSource). If you need streaming and the older browser versions you are supporting do not provide EventSource, you can install a polyfill.

In the JavaScript SDK, v3.x and earlier, if you enable the JavaScript SDK's [`useReport` configuration option](https://launchdarkly.github.io/js-client-sdk/interfaces/LDOptions.html#useReport) and want to use streaming, you must install the [LaunchDarkly EventSource polyfill](https://github.com/launchdarkly/js-eventsource) to provide streaming support. This is true whether or not your browser already supports `EventSource`.

The JavaScript SDK v4.x supports `REPORT` directly. If you enable the [`useReport` configuration option](https://launchdarkly.github.io/js-core/packages/sdk/browser/docs/interfaces/LDOptions.html#useReport), no polyfill or additional configuration is required.

To install LaunchDarkly's EventSource polyfill:

<CodeGroup>
  ```bash title="Installing LaunchDarkly's EventSource polyfill" lines wrap theme={null}
  npm install launchdarkly-eventsource
  ```

  ```html title="Loading LaunchDarkly's EventSource polyfill" lines wrap theme={null}
  <script src="/eventsource-polyfill.js"></script>
  ```
</CodeGroup>

### document.querySelectorAll()

The JavaScript SDK uses `querySelectorAll` to support `click` events for Experimentation. **If you never use click conversion metrics, you do not need `querySelectorAll`.** To learn more, read [Clicked or tapped conversion metrics](/docs/home/metrics/click).

`querySelectorAll` is widely available in browsers, [except in old versions of Internet Explorer](https://caniuse.com/queryselector). If you want to support these, and you need Experimentation support, you can install a polyfill such as [polyfill-queryselector](https://github.com/cobbdb/polyfill-queryselector).

To install a polyfill for `querySelectorAll`:

<CodeGroup>
  ```html title="HTML" lines wrap theme={null}
  <!-- loading polyfill from CDN -->
  <script src="https://unpkg.com/polyfill-queryselector@1.0.2/querySelector.js"></script>
  ```

  ```bash title="Shell" lines wrap theme={null}
  # installing polyfill as a package
  npm install polyfill-queryselector@1.0.2
  ```

  ```js title="JavaScript" lines wrap theme={null}
  // loading polyfill as a package
  require('polyfill-queryselector');

  ```
</CodeGroup>
