Running geolocation api while PWA is minimized / browser tab is not active - javascript

Is this possible?
I've tried both watchPosition and ( getCurrentPosition with setInterval ) and neither seem to run while the PWA is minimized.
I understand the security implications of why browsers would restrict this behaviour but I have a legitimate reason for tracking the user with these methods.
Are their any workaround to keep them running while the pwa (or browser tab) is not active - but open?
Would the screen wake lock do it? I haven't needed to use this api before, but looks like its just to keep the screen on constantly.
Anyone with any idea or work arounds would be appreciated.

Related

iOS Browsers except Safari Keeps asking camera permission every time I load the page

We are currently developing a qr code scanning system using laravel but when I test it on Chrome or other browser except Safari, it always ask camera permission.
I have already allow camera permission on browser setting on my iPad. Is there other way to permanently allow it or only ask once on Chrome browser like on android that remembers my choice? Or is it possible to do it programmatically like using Javascript?
thank you so much! I really need everyone's help, I couldn't find any related topics on the internet about this 😄
There is no API for the PWA's to change it from "Ask" to "Allow". There is an issue on WebKit around this: https://bugs.webkit.org/show_bug.cgi?id=215884, but what can you do is to change it manually in browser settings, as it was mentioned: https://stackoverflow.com/a/57368061/615393.

How to debug WebSocket / Server Sent Events reconnections on desktop?

I am developing an app that uses Server Sent Events (SSE - basically one-way websockets). If the user uses the site on their mobile chrome browser and then tabs out for about a minute, the SSE connection breaks. If the user then tabs back into the site, it doesn't refresh the page (this is good). But I still need to re-establish the SSE connection so that the server can resume sending messages to them without a refresh.
I'm trying to debug my implementation but having to do it on mobile is very tedious. I have to grab my phone, refresh the page, then tab out, wait 1 minute (so the connection can break), and then tab back in to determine if my code for re-establishing the connection worked properly.
I would much rather be able to debug this on desktop, but I haven't found a way. I have tried the following:
Tried 5 different Chrome extensions for sleeping a tab. Unfortunately, when you navigate back into the tab it just refreshes the page rather than resumes it.
Tried using USB Debugging, but the desktop keeps the tab open at all times even if you tab out on mobile, so the tab never sleeps.
Tried running debugger; in the Chrome Developer Tools console, but even if I let the Javascript sit with its execution frozen for 5+ minutes, it never breaks the SSE connection, so I can't test if reconnecting works.
Tried using an extension to kill the internet for Chrome, but miraculously, this still maintains the active websocket/SSE connections. Apparently Google engineers have deprioritized this effort?
Basically, I am looking to simulate the behavior that happens on mobile when you tab out of your web browser, wait a minute, and then tab back in (the Javascript execution is frozen, the SSE connection is broken after a minute or so, and then tabbing back in resumes Javascript and attempts to reconnect the SSE connection).
Is this possible?
I think that best change you have by emulating your android device. You can do so by installing android studio from https://developer.android.com/studio and then here you have all you need to start and manage your virtual android env https://developer.android.com/studio/run/managing-avds
This it the way I debug my whole mobile development
The most obvious solution to me would be to attach a listener that tracks the events related to tab activation and build some custom solution upon that.
Simply:
window.onfocus = () => {
// Restore SSE session
};
window.onblur = function () {
// Inactive
};
Just for info, SSE is a different protocol from websockets.
In case you are interested in using websockets implementation, I suggest the following library which works very well in my experience: https://www.npmjs.com/package/#stomp/stompjs
Stomp is an abstraction over the websocket protocol, but it also means you would need to implement this on the server side as well.
You can use the chrome://discards to freeze your tab.
You should close and restore the connection based on the Page LifeCycle events.
You Can Try to use pause execution
goto:
Chrome javascript console (Ctrl+Shift+J) > sources > pause script (press f8)
This simulates like a mobile tab switching so you can debug easily
I think this is the simple and easy solution. thanks

Chrome extension's chrome.history not synced across devices?

Trying to write a chrome extension using the chrome.history api. I'm seeing the history reported by chrome.history doesn't contain links visited on other devices (although those links do appear in the chrome://history page on the same device).
Is there an alternative to chrome.history I could use? Is there something else than an extension I could build that could access the full cross device history?
Or is there a reason for the discrepancy between chrome://history and chrome.history?
My end goal would be to highlight links that have been visited cross devices on current pages.
Thanks for any help!
You can check out this answer on Super User which
Reset Sync by going to the Google Dashboard.
Log out of Chrome on all your devices (PC, Mac, smartphone, etc)
Quit Chrome (kill Chrome process if necessary)
Run Chrome again and you should be asked to sign in to your account.
Once all accounts are signed in, the history should sync across all devices
This will re-sync all your devices.
By the way, extensions usually are synced to all devices if users enable the feature, and this means that your app will still show the visited links since it will have access to the device it's installed on's history.
As for the synced data, not event the Chrome browser itself can highlight the data as visited. Google.com usually highlights visited sites, but I just checked my history and the sites I visited on other sites aren't showing.
To solve your issue, you can have users create Premium accounts that gives them access to cross browser link marking. This of course has to be implemented by you.

Is it possible to bypass popup blocking on Safari latest (currently: 10.1.2) when using window.open?

Based on some very useful replies here (like this), I built some code to deal with popup blocking that works fine on other browsers (like Chrome), but not on Safari - loader and target page are just samples, they will be internal documents in the production version:
//redirecting user to a temporary page displaying some loader
test=window.open('https://codepen.io/jackrugile/full/ejsbf/', '_blank');
//setTimeout to simulate some API call
setTimeout(function() {
//this part does not work on Safari to change the new page to target page
test.location.replace('http://google.com');
}, 3000)
I am well aware that popup are evil, they are blocked for a reason and more, but consider I am developing a tool to be accessed and used exclusively inside a given corporate environment, the popup is in the requirements of the company itself and no, we are discussing about too many devices and people with too little technical prowess to think about just disabling the blockers for our own app.
Any tip to make it work on Safari, provided it is possible at all? I might consider dropping the window.open() part, but we need to have a reliable check to verify whether the document was successfully opened or not.

Is it possible to Blink alert "client browser" when new notification came in JSF?

I am working on JSF with primefaces, i have been assigned a task to notify the browser when new message arrived in client desktop, its like Message alert.
I found some concepts p:poll, and p:notificationBar, p:growl but those are happeniing inside the browser window itself, when browser is minimized the user can't get notify the new message arrival.
My question is:
Is it possible to do it in JSF with the help of Javascript?
I don't know whether it is possible to notify to the client?
How can i enable notifications for window minimised state as well?
You can make the title bar flash and on some platforms, even get the user's attention.
Make browser window blink in task Bar
Possible to flash a Browser window using Javascript?
This question shows part of your possible answer.
You should then use a to watch for the notification change. You could use the push framework, but that could be a bit of overkill on the network / connectivity side.
There are some solutions that work for only specific browsers. If you are doing this for your company intranet environment and everyone uses chrome or IE, there might be better solutions. Nonetheless, you should strive to do something that works on all compliant browsers (w3c compliant, that is).
There are some boundaries you should observe, regarding web apps in browser windows and what is the expected behavior. The user expects a minimized / offline browser window to sit quiet. If you are in a corporate environment, this could be waived, but for an app for the general public on the web, some people could (I would) be annoyed by this attention-seeking behavior (on a browser game, for example).

Categories