<article><h2>Bowser</h2><p>A Browser detector. Because sometimes, there is no other way, and not even good modern browsers always provide good feature detection mechanisms.</p>
<h1>Overview</h1><p>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.</p>
<h1>Use cases</h1><p>First of all, require the library:</p>
<preclass="prettyprint source"><code>const Bowser = require('bowser');</code></pre><h2>Browser props detection</h2><p>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:</p>
<preclass="prettyprint source"><code>const browser = new Bowser(window.navigator.userAgent);
console.log(`The current browser name is "${browser.getBrowserName()}"`);
// The current browser name is "Internet Explorer"</code></pre><p>or</p>
<preclass="prettyprint source"><code>const impression = new Impression();
const browser = new Bowser(window.navigator.userAgent);
<preclass="prettyprint source"><code>const browser = new Bowser(window.navigator.userAgent);
impression.userTechData = browser.parse();
console.log(impression.userTechData);
// 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"
}
}</code></pre><h2>Filtering browsers</h2><p>You could want to filter some particular browsers to provide any special
support for them or make any workarounds.
It could look like this:</p>
<preclass="prettyprint source"><code>const browser = new Bowser(window.navigator.userAgent);
const isValidBrowser = bowser.compare({
// declare browsers per OS
windows: {
"internet explorer": ">10",
},
macos: {
safari: ">10.1"
},
// per platform (mobile, desktop or tablet)
mobile: {
safari: '>9',
'android browser': '>3.10'
},
// or in general
chrome: ">20.1.1432",
firefox: ">31",
opera: ">22"
});</code></pre><p>As you can see, settings for any particular OS has more priority and redefines settings of <code>any</code> property.</p>
<h3>new Bowser(<code>:Object</code>)</h3><p>Use it to get object with detected flags of your current browser.</p>
<h3>bowser._detect(ua <code>:String</code>)<code>:Object</code></h3><p>Use it to get object with detected flags from User Agent string.</p>
<h3>bowser.check(minVersions<code>:Object</code>, strictMode<code>:Boolean</code>, [ua]<code>:String</code>)<code>:Boolean</code></h3><p>Use it to check if browser is supported. In default non-strict mode any browser family not present in <code>minVersions</code> will pass the check (like Chrome in the third call in the sample bellow). When strict mode is enabled then any not specified browser family in <code>minVersions</code> will cause <code>check</code> to return <code>false</code> (in the sample it is the fourth call, the last one).</p>
bowser.check({chrome: "45"}, true, window.navigator.userAgent); // false</code></pre><h3>bowser.compareVersions(versions<code>:Array<String></code>)<code>:Number</code></h3><p>Use it to compare two versions.</p>
// -1</code></pre><h3>bowser.isUnsupportedBrowser(minVersions<code>:Object</code>, [strictMode]<code>:Boolean</code>, [ua]<code>:string</code>)<code>:Boolean</code></h3><p>Use it to check if browser is unsupported.</p>
// true / false</code></pre><p>See more examples in <ahref="test/test.js">tests</a>.</p>
<hr>
<h2>Bowser Flags</h2><p>Your mileage may vary, but these flags should be set. See Contributing below.</p>
<preclass="prettyprint source lang-js"><code>alert('Hello ' + bowser.name + ' ' + bowser.version);</code></pre><h3>All detected browsers</h3><p>These flags are set for all detected browsers:</p>
<ul>
<li><code>name</code> - A human readable name for this browser. E.g. 'Chrome', ''</li>
<li><code>version</code> - Version number for the browser. E.g. '32.0'</li>
</ul>
<p>For unknown browsers, Bowser makes a best guess from the UA string. So, these may not be set.</p>
<h3>Rendering engine flags</h3><p>If detected, one of these flags may be set to true:</p>
<p>For all detected browsers the browser version is set in the <code>version</code> field.</p>
<h3>OS Flags</h3><p>If detected, one of these flags may be set to true:</p>
<ul>
<li><code>mac</code></li>
<li><code>windows</code> - other than Windows Phone</li>
<li><code>windowsphone</code></li>
<li><code>linux</code> - other than <code>android</code>, <code>chromeos</code>, <code>webos</code>, <code>tizen</code>, and <code>sailfish</code></li>
<li><code>chromeos</code></li>
<li><code>android</code></li>
<li><code>ios</code> - also sets one of <code>iphone</code>/<code>ipad</code>/<code>ipod</code></li>
<li><code>blackberry</code></li>
<li><code>firefoxos</code></li>
<li><code>webos</code> - may also set <code>touchpad</code></li>
<li><code>bada</code></li>
<li><code>tizen</code></li>
<li><code>sailfish</code></li>
</ul>
<p><code>osversion</code> may also be set:</p>
<ul>
<li><code>osversion</code> - for Android, iOS, MacOS, Windows, Windows Phone, WebOS, Bada, and Tizen. If included in UA string.</li>
</ul>
<p>iOS is always reported as <code>ios</code> and additionally as <code>iphone</code>/<code>ipad</code>/<code>ipod</code>, whichever one matches best.
If WebOS device is an HP TouchPad the flag <code>touchpad</code> is additionally set.</p>
<h3>Browser capability grading</h3><p>One of these flags may be set:</p>
<ul>
<li><code>a</code> - This browser has full capabilities</li>
<li><code>c</code> - This browser has degraded capabilities. Serve simpler version</li>
<li><code>x</code> - This browser has minimal capabilities and is probably not well detected.</li>
</ul>
<p>There is no <code>b</code>. For unknown browsers, none of these flags may be set.</p>
}</code></pre><h3>Contributing</h3><p>If you'd like to contribute a change to bowser, modify the files in <code>src/</code>, then run the following (you'll need node + npm installed):</p>
$ make test</code></pre><p>Please do not check-in the built files <code>bowser.js</code> and <code>bowser.min.js</code> in pull requests.</p>
<h3>Adding tests</h3><p>See the list in <code>src/useragents.js</code> with example user agents and their expected bowser object.</p>
<p>Whenever you add support for new browsers or notice a bug / mismatch, please update the list and
check if all tests are still passing.</p>
<h3>Similar Projects</h3><ul>
<li><ahref="https://github.com/BigBadBleuCheese/Kong">Kong</a> - A C# port of Bowser.</li>
</ul>
<h3>License</h3><p>Licensed as MIT. All rights not explicitly granted in the MIT license are reserved. See the included LICENSE file for more details.</p></article>
Documentation generated by <ahref="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Sun Jul 08 2018 12:09:12 GMT+0300 (EEST) using the <ahref="https://github.com/clenemt/docdash">docdash</a> theme.
