browser-report
Advanced tools
Report browser settings like whatsmybrowser.org in a plain-old JavaScript object.
Often, when a visitor to your website reports an issue, it can be difficult or impossible to reproduce the same issue without asking your visitor what software and settings they use.
Lately, in this situation, I ask my visitors to send me the report from whatsmybrowser.org. But then, I realized that most of that information is available, via JavaScript, by parsing the user agent when the visitor is submitting their issue. So I set out to create a script that would provide that information.
Note, this is meant for reporting and not for application logic; your application should use feature detection, not browser detection. Therefore, only the most common browser names and OS names are reported, see the Coverage section below for more details. The full user agent string is always provided and it can help you identify any browser. If you need to report on every browser and OS or other information in the user agent string, then take a look at platform.js and/or UAParser.js.
Package manager support is planned, but for now load this script into a browser and call browserReport() with a callback. Note, some values maybe null if the information is not available.
<script src="browser-report.js"></script>
<script>
browserReport(function (err, report) {
if (err) {
throw err;
}
console.log(report);
});
</script>
Note, the remote client IP address is not available in the synchronous function call.
<script src="browser-report.js"></script>
<script>
var report = browserReportSync();
console.log(report);
</script>
The report object has the following keys and value types.
{
"browser": {
"name": (string),
"version": (string)
},
"cookies": (boolean),
"flash": {
"version": (string)
},
"ip": (string),
"java": {
"version": (string)
},
"lang": (array || string),
"os": {
"name": (string),
"version": (string)
},
"screen": {
"colors": (number),
"dppx": (number),
"height": (number),
"width": (number)
},
"scripts": (boolean),
"timestamp": (string),
"userAgent": (string),
"viewport": {
"height": (number),
"layout": {
"height": (number),
"width": (number)
}
"width": (number),
"zoom": (number)
}
"websockets": (boolean)
}
The goal is to correctly identify all browsers included on caniuse.com according to their browser usage table. As of March 2019, their browser usage table accounts for 98.43% of global usage based on data from StatCounter GlobalStats Browser Market Share.
Browser test coverage, as of v2.2.10, matches at 98.43%
Operating systems are also correctly identified for the top seven operating systems as reported by StatCounter GlobalStats OS Market Share. As of February 2019, the top seven accounts for 94.7% of global traffic.
Operating system test coverage, as of v2.2.11, matches the top seven at 94.7%
The script file size is roughly 4K when gzipped and roughly 2K when minified and gzipped. The synchronous call takes about 4ms on a 2.6 GHz Intel Core i7 with Google Chrome 72. The asynchronous call is largely dependent on how long it takes for ipify.org to respond with the IP address.
In chronological order (oldest first); not in order of priority. Contributions welcome!
2.2.12 – October 21, 2019
2.2.11 – March 25, 2019
2.2.10 – March 21, 2019
2.2.9 – August 13, 2018
2.2.8 – January 18, 2017
2.2.7 – July 11, 2016
2.2.6 — February 4, 2016
2.2.5 — February 2, 2016
2.2.4 — February 1, 2016
2.2.3 – January 29, 2016
2.2.2 – January 29, 2016
2.2.1 – January 29, 2016
2.2.0 – January 14, 2016
2.1.0 – January 13, 2016
2.0.1 - December 21, 2015
2.0.0 – October 26, 2015
browserReport() is now async and expects a callbackbrowserReportSync()1.0.0 — September 11, 2015
This Q&A on StackOverflow is what got me started on creating this.
browser-report is available under the MIT License.
FAQs
Report browser settings like whatsmybrowser.org.
The npm package browser-report receives a total of 251 weekly downloads. As such, browser-report popularity was classified as not popular.
We found that browser-report demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Socket's package search now displays weekly downloads for npm packages, helping developers quickly assess popularity and make more informed decisions.
Security News
A Stanford study reveals 9.5% of engineers contribute almost nothing, costing tech $90B annually, with remote work fueling the rise of "ghost engineers."
Research
Security News
Socket’s threat research team has detected six malicious npm packages typosquatting popular libraries to insert SSH backdoors.