Develop Reference

How to test if the browser support <input capture />

How could I test if the current browser support the feature of mobile browsers to use the device camera to take a picture?
https://addpipe.com/html-media-capture-demo/
Capture is basically ignored in all desktop browsers: https://caniuse.com/#feat=html-media-capture
How could I detect if I can use capture (and that it won't show an open file dialog, but will actually open the picture application)?

You can create an input element in JS and test for the capture property. It will be undefined if unsupported.
var el = document.createElement('input')
var supported = el.capture != undefined
console.log('capture supported: '+supported)
Here's what it looks like in the iOS simulator

You can use the following function:
function supported(attribute) {
var i = document.createElement('input');
i.setAttribute(attribute, true);
return !!i[attribute];
}
And you can call it, like supported('capture'), or if you want to test for the accept attribute supported('accept')
Source: http://anssiko.github.io/html-media-capture/

Alert when page opened not in Chrome

I'm trying to get an alert to pop up when the user opens my webpage in a browser other than Chrome. I have this:
if (/what to put here to make the below show only if the browser is not Google Chrome?/) {
alert( "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome." );
}
Found this here as a possible condition: navigator.userAgent.search("Chrome"), but can't make it work. Please advise. :-)

As the comments above point out by referencing questions you can test for chrome in the userAgent. But you would want to reverse that:
let notChrome = !/Chrome/.test(navigator.userAgent)
let alertMessage = "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome."
if(notChrome) alert(alertMessage)
This will solve the problem unless the user is spoofing their userAgent. This is unusual though. To fully check you should also check for a feature chrome has AND the userAgent:
let notChrome = !/Chrome/.test(navigator.userAgent) && !("webkitAppearance" in document.body.style)
let alertMessage = "Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome."
if(notChrome) alert(alertMessage)

This should to it.
var isChrome = !!window.chrome; // "!!" converts the object to a boolean value
console.log(isChrome); // Just to visualize what's happening
/** Example: User uses Firefox, therefore isChrome is false; alert get's triggered */
if (isChrome !== true) {
alert("Please use Google Chrome to access this site.\nSome key features do not work in browsers other than Chrome.");
}

Disable alert sound for notifications in Firefox

I am using the following code to show Notification in Firefox:
var options = {
body: 'Do you like my body?',
silent: true
}
var n = new Notification('Test notification',options);
In Chrome it works as expected i.e the notification is silent but in Firefox the sound still comes. Can you let me know what I am missing?
I want the Notification to be silent with code only instead doing some external setting in Browser.

Taking a look at the Browser compatibility table on MDN, the silent option is still not available in Firefox.
noscreen, renotify, silent, sound, and sticky options: No support
Note that silent option is available from Chrome 43.

Possible to run userscript in IE11

I have a custom userscript that I'm running in Chrome and Firefox using Tampermonkey/Greasemonkey.
Is there any way of using this script in IE11? Or is there any plugins for IE11 that does what Tampermonkey/Greasemonkey does?

TrixIE WPF4.5 claims to emulate Greasemonkey on IE11.
Unfortunately, the original Trixie and IE7Pro stopped working around IE8-ish.

I use localStorage to make it work, which is supported by IE8 or later.
Steps:
Run the following code in IE's developer tool when the current window is in the domain where you want the script to run in:
var scriptName = 'Hello world';
function scriptBody(){
//---userscript starts--->
document.body.innerHTML = '<h1>Hello world!</h1>';
//---userscript ends--->
}
var script = scriptBody.toString()
.split('//---userscript starts--->')[1]
.split('//---userscript ends--->')[0];
localStorage.setItem(scriptName, script);
Create a bookmark and modify the URL into:
javascript:(function(){eval(localStorage.getItem('Hello world'));})()
Advantages:
No additional plugin needed.
Almost no script text length limit.
Disadvantages:
Need a user to click on a bookmark to run the script.
Need a reinstall if a user clears the browser cache.

A simple Google Search (I searched "greasemonkey for IE") yields various alternatives available for other browsers:
http://en.wikipedia.org/wiki/Greasemonkey#Equivalents_for_other_browsers
For Internet Explorer, similar functionality is offered by IE7Pro,[19] Sleipnir,[20] and iMacros.

Fiddler supports modifying the response of http requests.
We can use this feature to load userscript in any browser, include IE8.
This is an example:
static function OnBeforeResponse(oSession: Session) {
if (m_Hide304s && oSession.responseCode == 304) {
oSession["ui-hide"] = "true";
}
// match url
if (oSession.fullUrl == "http://apply.ccopyright.com.cn/goadatadic/getR11List.do") {
oSession.utilDecodeResponse();
var script = System.IO.File.ReadAllText("C:\\GitHub\\#selpic\\P660_printer\\Printer\\scripts\\form-save-load.js")
oSession.utilReplaceOnceInResponse("</body>", "<script>"+script+"</script></body>", true);
}
}
doc: Modifying a Request or Response

Just open Developer tools (press F12) and paste your script to Console, and then run it (Ctrl + Enter).

javascript user agent redirect by browser version number

We have a chat program that works with only a couple of browsers right now. So, I'm inserting a user agent redirect to manage the messaging to inform the user why they can't chat with their unsupported browser.
The issue I'm having is only Firefox 3.1 and under, for example, is supported for FireFox., but my custom script below is enabling all Firefox versions compatible. What's the solution to have only Firefox 3.1 be compatible?
Note: I don't plan to send them to the actual browser websites as seen in my example. I just put those URLs in for example purposes only. I plan to have custom redirect pages with friendly messaging on them...
Demo of existing code:
http://jsfiddle.net/evanmoore/4xr77/
Code is below:
<script type="text/javascript">
if ((navigator.userAgent.indexOf('Firefox') != -1) || (navigator.userAgent.indexOf('MSIE') != -1))
{
// Your browser is supported for live chat
document.location = "http://www.livechatinc.com/";
}
else if(navigator.userAgent.indexOf("Safari") != -1)
{
// Your Safari browser is not supported for live chat
window.location = "http://www.apple.com";
}
else if(navigator.userAgent.indexOf("Chrome") != -1)
{
// Your Chrome browser is not supported for live chat
window.location = "http://www.google.com/chrome";
}
else
{ // All others... Your browser is not supported for live chat
window.location = "http://www.gofetch.com";
}
</script>

Based on Asad's comment, I found the different browser strings here which gave me the ability to control the version number like so... I think this should do the trick!
if ((navigator.userAgent.indexOf('Firefox/3.1') != -1)

Try checking if the functionality exists, not the version of the browser.
e.g. if (typeof foo != 'undefined') will check if foo exists
You can find more info here