# `ensure-browser` package

A simple script to be included in Medmain web applications, to ensure that the browser is supported.

If the browser is not supported, an error message is displayed and the React application is not rendered.

## How to use it

### Step 1

In `index.html`:

- Include a `<script>` tag to load it from a CDN
- Call `ensureBrowser(browsers)` function to specify the supported browsers.

```html
<script
  crossorigin
  src="https://unpkg.com/@medmain/ensure-browser@0.1.0/dist/browser/ensure-browser.js"
></script>
<script>
  window.IS_SUPPORTED_BROWSER = window.ensureBrowser([
    {name: 'firefox', version: '10'},
    {name: 'chrome', version: '20'}
  ]);
</script>
```

Optional: in addition of the `name` property, specify a `displayName` to customize the way the supported browsers are displayed in the error message.

### Step 2

In `src/index.js`, don't render the application if the browser is not supported.

```jsx
if (window.IS_SUPPORTED_BROWSER === false) {
  throw new Error('Your browser is not supported!');
}

(async () => {
  let element;
  try {
    await app.initialize();
    element = (
      <BaseRoot app={app}>
        <Root />
      </BaseRoot>
    );
  } catch (err) {
    console.error(err);
    element = renderError(err);
  }

  ReactDOM.render(element, document.getElementById('main'));
})();
```

## Available browser names

The `name` property of the supported browsers can be one of the following values:

- `chrome`
- `chrome mobile`
- `electron`
- `firefox`
- `firefox for ios`
- `ie`
- `microsoft edge`
- `phantomjs`
- `safari`
- `seamonkey`
- `silk`
- `opera mini`
- `opera`

This list was extracted from [Platform.js v1.3.5](https://github.com/bestiejs/platform.js) code. All names were converted to lower case.