We Keep Coding

Chrome Web Extension stops because of "Disable developer mode extensions" Chrome popup

I wrote a Web Extension which starts surfing specified websites automatically (to simulate/train user profiles by "collecting" website cookies) after the Chrome browser is opened.
I know that you can disable the popup by whitelisting it for your own Web Extension:
Disable developer mode extensions pop up in Chrome
But: My Web Extension has to run automatically on 8-16 virtual machines on Linux without a GUI and i don't know whether it is possible and how to do it.
My Extension opens the first URL as expected, but then the popup comes into play and stops further surfing. If i open another tab per hand it continues to work, but opening a tab via Javascript doesn't do the trick. My code usually doesn't have to handle multiple tabs, because everything is done with one tab. Maybe i'm executing the code at the wrong time. The code works perfectly, when the popup doesn't come.
My code without tab opening:
background.js
var shouldMessageBeSent = true;
chrome.windows.onCreated.addListener(function() {
chrome.tabs.update({url:"https://stackoverflow.com/"}); // placeholder URL
});
chrome.webNavigation.onCompleted.addListener(function() {
if (shouldMessageBeSent == true) {
chrome.tabs.query({"currentWindow": true}, function(tabs) {
shouldMessageBeSent = false;
chrome.tabs.sendMessage(tabs[0].id, {txt: "newURLvisited"}, function(response) {});
});
}
});
chrome.runtime.onMessage.addListener(gotMessage);
function gotMessage(message) {
if (Array.isArray(message)) { // It's an array in my code
linksToVisit = message;
}
visitLinks(linksToVisit); // visits all the given links (the links are filtered in my code)
}
Content.js (highly simplified)
chrome.runtime.onMessage.addListener(gotMessage);
function gotMessage(message) {
if (message.txt === "newURLvisited") {
var allLinks = document.getElementsByTagName("a");
chrome.runtime.sendMessage(allLinks);
}
}
Any ideas what to fix? It may have to do something with active window/tab focus.

Apparently you can install a policy for Chrome, provided as a template from Google, which you can edit to your taste before that; I suppose you can do a similar thing on Mac and Linux just in a JSON editor.

iOS9: Try to open app via scheme if possible, or redirect to app store otherwise

My question is about iOS9 only!
I have an HTML landing page, and I try to redirect the user to my app via URL scheme if the app is installed, or redirect to the Appstore otherwise.
My code is:
document.addEventListener("DOMContentLoaded", function(event) {
var body = document.getElementsByTagName('body')[0];
body.onclick = function () {
openApp();
};
});
var timeout;
function preventPopup() {
clearTimeout(timeout);
timeout = null;
window.removeEventListener('pagehide', preventPopup);
}
function openApp(appInstanceId, platform) {
window.addEventListener('pagehide', preventPopup);
document.addEventListener('pagehide', preventPopup);
// create iframe
var iframe = document.createElement("iframe");
document.body.appendChild(iframe);
iframe.setAttribute("style", "display:none;");
iframe.src = 'myscheme://launch?var=val';
var timeoutTime = 1000;
timeout = setTimeout(function () {
document.location = 'https://itunes.apple.com/app/my-app';
}, timeoutTime);
}
The problem is that the iframe trick doesn't work in Safari iOS9.
Any idea why?
My iframe trick based on this answer.

The iframe trick no longer works -- my guess is that Apple knows it will encourage more developers to implement Universal Links, more quickly.
You can still set window.location='your-uri-scheme://'; and fallback to the App Store after 500ms. There is a "dance" between popups if you take this approach, as we do at Branch (we do as a fallback if Universal Links don't work).
window.location = 'your-uri-scheme://'; // will result in error message if app not installed
setTimeout(function() {
// Link to the App Store should go here -- only fires if deep link fails
window.location = "https://itunes.apple.com/us/app/myapp/id123456789?ls=1&mt=8";
}, 500);
I wish I had a better answer for you. iOS 9 is definitely more limited.
For a helpful overview of what's needed for Universal Links should you go that route, check out my answer here or read this tutorial

As already mentioned setting window.location on iOS 9 still works. However, this brings up an Open in App dialog. I've put an example on https://bartt.me/openapp that:
Launches Twitter when the Open in Twitter app is clicked.
Falls back to the Twitter app in the App Store.
Redirects to Twitter or the App Store without the user selecting Open in the Open in App dialog.
Works in all browsers on iOS and Android.
Look at the source of https://lab.bartt.me/openapp for more information.

Maybe try giving you app support to Universal Links
Idea:
Avoid custom (JavaScript, iframe) solutions in Safari, replace you code with a supported Universal Link.
Example
<html>
<head>
...
</head>
<body>
<div class"app-banner-style">
In app open
</div>
...content
</body>
</html>
if you app support Universal Links (e.g. yourdomain.com), you muss configure your domain (and path) and iOS9 should be react to it link opening you App. That is only theory, but I guess should be work :)
https://developer.apple.com/library/prerelease/ios/documentation/General/Conceptual/AppSearch/UniversalLinks.html#//apple_ref/doc/uid/TP40016308-CH12

iframe hack doesn't work in ios9 anymore. Possible solution is use two buttons.
Example:
$('#goToStoreBtn').text( "go to store" ).click(function(event){
event.preventDefault();
event.stopPropagation();
window.location = storeUrl; // https://itunes.apple.com/...
});
$('#goToAppBtn').text( "go to app" ).click(function(event){
event.preventDefault();
event.stopPropagation();
window.location = appUrl; // myApp://...
});

This is relatively old thread, but I have created a library that supports deeplinking on most of the modern mobile browsers. But this requires separate deeplinking page which needs to be hosted in different domain to support universal linking in ios9 facebook browser.
https://github.com/prabeengiri/DeepLinkingToNativeApp

Redirect Safari To Chrome

I'm trying to redirect user's of my mobile webapp to use Chrome rather than Safari. I tried using the following:
<script>
javascript:location.href="googlechrome"+location.href.substring(4);
</script>
However this constantly opens tabs in Chrome in a loop. Do you know how I can successfully do this?
Cheers,
Dara

This will cause the page to open every time the webpage is loaded, regardless if you are in Safari or Chrome. This is also very poor User Experience to just forward the user to another browser without their input.
It would be better to have some way for the user to open your site in Chrome and also to have an explanation why it is needed.
There are other schemes for https and callbacks: https://developer.chrome.com/multidevice/ios/links#uri_schemes
<p>This webapp is best viewed in Google Chrome</p>
<button type="button" onclick="openInChrome()">Open in Chrome</button>
<script>
var openInChrome = function() {
if (/^((?!Chrome).)*(Safari)+.*$/.test(navigator.userAgent)) {
var protocol = location.href.substring(0,location.href.indexOf(':'));
var url = location.href.substring(location.href.indexOf(':'));
if (protocol === "http") {
location.href = "googlechrome" + url;
}
else {
location.href = "googlechromes" + url;
}
}
}
</script>
Edit:
Added a check to verify they are in Safari.

Well, the reason is pretty obvious; Chrome is instructed to open Chrome too. You just want a userAgent conditional.
if (navigator.userAgent.indexOf("CriOS") == -1) {
location.href="googlechrome"+location.href.substring(4);
}
I would go on my standard rant about user agent checking being bad, but I trust what you're saying about this being a private webapp. Since iOS doesn't let you change your default browser, I guess this is a fair workaround.

How can I create a "view to desktop version" link on mobile site without it looping back to mobile version when it resolves?

I've recently created a separate mobile skin for a website. The site serves the mobile version of a page based on the screen size of the device it is being viewed on using the following code.
<script type="text/javascript">
if (screen.width <= 600) {
window.location = "mobile/";
}
</script>
I'd now like to add a "view desktop version" link at the bottom of the page. Naturally, with the above code in the header of each page, it just detects the screen size again and loops back.
Could someone please suggest how I could get around this. I suspect this will be a session or a cookie but I'm very new to java and don't know how to set these up.
thanks in advance for any advice.

This should be handled by the viewport in the metatag of your website. The use of jquery can allow users to opt out of responsive design:
var targetWidth = 980;
$('#view-full').bind('click', function(){
$('meta[name="viewport"]').attr('content', 'width=' + targetWidth);
});
See this link for more clarification.

To detect if link was clicked you can:
Add a specific query parameter (like ?forceDesktop=true) which should be removed if returned to mobile
Use media queries and single skin (see bootstrap)
Maybe look for more elaborate version to detect mobile (link)
Chrome for Android has option to request desktop site (How to request desktop

I've managed to come up with another solution using local storage which is really simple for a beginner like me. It's probably an amateurish way of doing things but it certainly works for my purposes.
So updated the code on the desktop version of the site to:
var GetDesk = 0;
var GetDesk = localStorage.getItem('GetDesk');
//check screen size is less than 600
if (screen.width <= 600) {
//check if there's anything in local storage showing the users requested the desktop
if (GetDesk == 0 ) {
window.location = "/mobile.html";
}
}
then added code to the mobile version of the site to check if the user has previously requested the desktop version:
var GetDesk = localStorage.getItem('GetDesk');
if (GetDesk == 1 ) {
window.location = "/desktop.html";
}
Then at the bottom of the mobile version added the button:
<!-- onclick set the value of GetDesk to 1 and redirect user to desktop site -->
<button onclick="localStorage.setItem('GetDesk','1'); window.location.href = '/desktop.html';">View desktop</button>
As I say, perhaps not the best way but it certainly works and is easy for beginners.

Is there a way to launch a popup for mobile device browser ONLY if App not already installed?

I am looking for a way to launch a popup when a website is viewed via a mobile browser, asking the user if they would like to install our App. But I only want the popup prompt to appear if the App is not already installed.
I have used the following JavaScript (which will work for Apple devices:
<script type="text/javascript">
if( /iPad|iPhone/i.test(navigator.userAgent) ) {
var url=confirm("Would you like to download our mobile application?");
if (url==true)
{
var url = window.location.href = 'http://www.itunes.com';
url.show();
}
else
{
}
}
</script>
As has been discussed here: App notification popup mobile device web browser
However, this popup launches on iOS regardless. I understand you can check for an app url scheme (and so find out if the App is installed) here: How to launch apps (facebook/twitter/etc) from mobile browser but fall back to hyperlink if the app isn't installed
Can I accomplish this by incorporating these two techniques?

You can use this if your app has a custom URL scheme:
<script type="text/javascript">
function startMyApp()
{
document.location = 'appCustomScheme://';
setTimeout( function()
{
if( confirm( 'Install app?'))
{
document.location = 'http://itunes.apple.com/us/app/yourAppId';
}
}, 300);
}
</script>
and call the function startMyApp() on page load, or if you need to bind it to some javascript event (click, etc.).

If you are trying to detect whether twitter or Facebook is installed in your device you can use this in your script.
var url = window.location.href = 'fb://';
for twitter
var url = window.location.href = 'twitter://';
If it does not work, try taking out the //. The above statements will open the twitter or facebook app, you can use that in a if loop or something to detect whether a app is installed on the device.