2014-03-01 18:22:06 +00:00
|
|
|
## Bowser
|
2011-04-27 23:25:55 +00:00
|
|
|
A Browser detector. Because sometimes, there is no other way, and not even good modern browsers always provide good feature detection mechanisms.
|
2011-04-27 22:14:35 +00:00
|
|
|
|
2018-07-05 18:18:04 +00:00
|
|
|
[![bowser ci](https://secure.travis-ci.org/lancedikson/bowser.png)](https://travis-ci.org/lancedikson/bowser/)
|
2014-02-22 21:34:00 +00:00
|
|
|
|
2017-10-18 08:47:53 +00:00
|
|
|
# Contents
|
2018-07-08 09:41:10 +00:00
|
|
|
- [Overview](#overview)
|
|
|
|
- [Use cases](#use-cases)
|
2018-07-08 10:21:54 +00:00
|
|
|
- [Advanced usage](#advanced-usage)
|
2018-07-08 09:41:10 +00:00
|
|
|
- [How can I help?](#contributing)
|
2011-04-27 22:14:35 +00:00
|
|
|
|
2017-10-18 08:47:53 +00:00
|
|
|
# Overview
|
|
|
|
|
|
|
|
The library is made to help to detect what browser your user has and gives you a convenient API
|
|
|
|
to filter the users somehow depending on their browsers.
|
|
|
|
|
|
|
|
# Use cases
|
|
|
|
|
2018-07-05 18:18:04 +00:00
|
|
|
First of all, require the library:
|
2017-10-18 08:47:53 +00:00
|
|
|
|
|
|
|
```
|
2018-07-08 09:41:10 +00:00
|
|
|
const bowser = require('bowser');
|
2017-10-18 08:47:53 +00:00
|
|
|
```
|
|
|
|
|
|
|
|
## Browser props detection
|
|
|
|
|
|
|
|
Often we need to pick users' browser properties such as the name,
|
|
|
|
the version, the rendering engine and so on. Here is an example how to make it with Bowser:
|
|
|
|
|
|
|
|
```
|
2018-07-08 09:41:10 +00:00
|
|
|
const browser = bowser.getParser(window.navigator.userAgent);
|
2017-10-18 08:47:53 +00:00
|
|
|
|
2018-07-05 18:18:04 +00:00
|
|
|
console.log(`The current browser name is "${browser.getBrowserName()}"`);
|
|
|
|
// The current browser name is "Internet Explorer"
|
2017-10-18 08:47:53 +00:00
|
|
|
```
|
|
|
|
|
|
|
|
or
|
|
|
|
|
|
|
|
```
|
|
|
|
const impression = new Impression();
|
|
|
|
|
2018-07-08 09:41:10 +00:00
|
|
|
const browser = bowser.getParser(window.navigator.userAgent);
|
2017-10-18 08:47:53 +00:00
|
|
|
const browserInfo = browser.getBrowser();
|
|
|
|
impression.brName = browserInfo.name;
|
|
|
|
impression.brVer = browserInfo.version;
|
2011-05-10 16:50:28 +00:00
|
|
|
```
|
2011-04-27 22:14:35 +00:00
|
|
|
|
2017-10-18 08:47:53 +00:00
|
|
|
or
|
|
|
|
|
|
|
|
```
|
2018-07-08 09:41:10 +00:00
|
|
|
const browser = bowser.getParser(window.navigator.userAgent);
|
2017-10-18 08:47:53 +00:00
|
|
|
impression.userTechData = browser.parse();
|
|
|
|
console.log(impression.userTechData);
|
2018-07-05 18:18:04 +00:00
|
|
|
// outputs
|
|
|
|
{
|
|
|
|
browser: {
|
|
|
|
name: "Internet Explorer"
|
|
|
|
version: "11.0"
|
|
|
|
},
|
|
|
|
os: {
|
|
|
|
name: "Windows"
|
|
|
|
version: "NT 6.3"
|
|
|
|
versionName: "8.1"
|
|
|
|
},
|
|
|
|
platform: {
|
|
|
|
type: "desktop"
|
|
|
|
},
|
|
|
|
engine: {
|
|
|
|
name: "Trident"
|
|
|
|
version: "7.0"
|
|
|
|
}
|
|
|
|
}
|
2017-10-18 08:47:53 +00:00
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## Filtering browsers
|
|
|
|
|
|
|
|
You could want to filter some particular browsers to provide any special
|
|
|
|
support for them or make any workarounds.
|
|
|
|
It could look like this:
|
|
|
|
|
|
|
|
```
|
2018-07-08 09:41:10 +00:00
|
|
|
const browser = bowser.getParsers(window.navigator.userAgent);
|
|
|
|
const isValidBrowser = browser.satisfies({
|
2018-07-05 18:18:04 +00:00
|
|
|
// declare browsers per OS
|
2017-10-18 08:47:53 +00:00
|
|
|
windows: {
|
2018-07-05 18:18:04 +00:00
|
|
|
"internet explorer": ">10",
|
2017-10-18 08:47:53 +00:00
|
|
|
},
|
|
|
|
macos: {
|
2018-07-05 18:18:04 +00:00
|
|
|
safari: ">10.1"
|
2017-10-18 08:47:53 +00:00
|
|
|
},
|
|
|
|
|
2018-07-05 18:18:04 +00:00
|
|
|
// per platform (mobile, desktop or tablet)
|
|
|
|
mobile: {
|
|
|
|
safari: '>9',
|
|
|
|
'android browser': '>3.10'
|
2017-10-18 08:47:53 +00:00
|
|
|
},
|
2018-07-05 18:18:04 +00:00
|
|
|
|
|
|
|
// or in general
|
|
|
|
chrome: ">20.1.1432",
|
|
|
|
firefox: ">31",
|
|
|
|
opera: ">22"
|
|
|
|
});
|
2017-10-18 08:47:53 +00:00
|
|
|
```
|
|
|
|
|
2018-07-08 09:41:10 +00:00
|
|
|
Settings for any particular OS or platform has more priority and redefines settings of standalone browsers.
|
|
|
|
Thus, you can define OS or platform specific rules and they will have more priority in the end.
|
2016-05-06 18:29:22 +00:00
|
|
|
|
2018-07-08 09:41:10 +00:00
|
|
|
More of API and possibilities you will find in the `docs` folder.
|
2016-06-30 17:52:55 +00:00
|
|
|
|
2018-07-08 10:21:54 +00:00
|
|
|
# Advanced Usage
|
|
|
|
By default, `require('bowser')` requires the pre-compiled file, which can
|
|
|
|
include useless for you polyfills. In case you don't need that, you can choose
|
|
|
|
using source file requiring bowser like that: `require('bowser/src/bowser`);
|
|
|
|
Then you get ES2015 file, which is not precompiled and can be easier to debug.
|
|
|
|
|
2018-07-08 09:41:10 +00:00
|
|
|
# Contributing
|
2014-03-01 18:22:06 +00:00
|
|
|
If you'd like to contribute a change to bowser, modify the files in `src/`, then run the following (you'll need node + npm installed):
|
2013-12-13 12:17:10 +00:00
|
|
|
|
2014-03-01 18:22:06 +00:00
|
|
|
``` sh
|
|
|
|
$ npm install
|
2018-07-08 09:41:10 +00:00
|
|
|
$ npm test
|
2014-03-01 18:22:06 +00:00
|
|
|
```
|
2013-12-13 12:17:10 +00:00
|
|
|
|
2014-03-01 18:22:06 +00:00
|
|
|
### Adding tests
|
2018-07-08 09:41:10 +00:00
|
|
|
See the list in `test/acceptance/useragentstrings.yml` with example user agents and their expected bowser object.
|
2013-12-13 12:17:10 +00:00
|
|
|
|
|
|
|
Whenever you add support for new browsers or notice a bug / mismatch, please update the list and
|
|
|
|
check if all tests are still passing.
|
2015-07-26 01:55:21 +00:00
|
|
|
|
2017-01-26 16:20:10 +00:00
|
|
|
### Similar Projects
|
|
|
|
* [Kong](https://github.com/BigBadBleuCheese/Kong) - A C# port of Bowser.
|
|
|
|
|
2015-07-26 01:55:21 +00:00
|
|
|
### License
|
|
|
|
Licensed as MIT. All rights not explicitly granted in the MIT license are reserved. See the included LICENSE file for more details.
|