Prevent multiple browsers installing the same PWA - javascript

I have created a Progressive Web App and it can be installed on many different mobile browsers, be it Chrome (Android), Edge Mobile, or Opera Mobile.
My problem is as such, lets say I have Chrome and Opera on my phone. I installed the PWA from Chrome. Then I visit Opera and it also allows me to install the PWA.
So, how can I detect if the PWA is installed and, if possible, prevent other browsers from installing the PWA if detected?
I know that the getInstalledRelatedApps() can be used to detect if similar native app is installed. But I would like to detect is if similar PWA is installed before, is it even possible?

Related

PWA for IOS on safari and chrome with javascript in html

I managed to create a custom pwa install button in html javascript that works well on an android only based on this documentation:
Android Pwa
My current problem is getting it to work on safari ios and chrome for ios.
I have read from my research that browsers like safari do not support pwa installs.
I would now like to ask if there is at this time an alternative to create a custom "Install ios app" button in my PWA. Thank you for your propositions.

JavaScript Injection using Firefox Mobile

I would like to inject JavaScript into a website on a mobile browser (in this case on android). However, most mobile browsers do not seem to support any kind of plug-ins (except for Firefox, correct me if I am wrong).
Firefox support for mobile plugin development seems to be minimal too, for example one can not install xpi-files by downloading them (I have yet to find out how one can install a plugin that is not hosted on the add-ons for android site)
Why not use existing solutions?
The best way to inject javscript would be Greasemonkey but this is not supported on mobile. Scriptish supposedly is but I could not install it on any device. There are android browsers specifically written to support Greasemonkey scripts (Fat Ape or Tampermonkey or OilCan) but these are not used by many and while they enable JavaScript injection the lack in their support for other browser-features.
What exactly is my question?
My experience in Firefox-Plugin development is minimal so I would like to know: Is there something that would prevent something like this to run on FF-Mobile? Could it be done with other browsers too? I don't actually need the full power of Greasemonkey, injecting the same few lines into any website would probably do.
Update 2
This again needs updating!
The new Firefox (current 95.2) no longer supports this method! But the old version still does! You will have to DL an old version (let's say 68.7). You can get it on ApkMirror. Then to install Greasmonkey either google it and choose the Mozilla page or just visit this link. On that page choose to download the file. When the XPI file will be downloaded it will automatically request to install it and that's it. You now have Greasemonkey installed on your Android device!
Be advised that this is an old unsupported Firefox version full of security holes!
Update
This needed updating!
The new Firefox now has full support for Greasemonkey add-on!
Instructions:
Find and install Firefox on the play store.
Run it and from the menu choose Add-ons and install your favorite add-ons like the ad blocker uBlock origin. Use the search and input Greasemonkey and install it.
Profit! :)
Old
If you want full Greasemonkey with even cross domain / cross site
GM_xmlhttpRequest support then your only option right now is: Opera
Mobile Labs (with Extensions) (link to APK is on that site).
Run Opera Mobile Labs app and visit Violent Monkey's extension
site and install the 1.5.1.1 (OEX version) by clicking on "Add to
Opera" and then choose "OK" (maybe you'll have to restart Opera
Mobile for the extension to work.).
To install an userscript you just need to load it in the browser by
visiting the user.js URL location. If you have userscripts on your
SD card, you can load them thru entering "file://" into the address
bar and navigate to your user.js files and then choose "OK".
If you have a bunch of normal scripts (no GM_ functions) then you
could also use this instructions (it's faster!):
Save your user.js scripts in a folder on your SD card (eg. "/sdcard/js").
Run Opera Mobile app and enter "opera:config" into the address bar and then in the "Quick find" input enter "javascript". Go
down and under "User Prefs" tick the following: "Always Load User
Javascript" and "User Javascript". Under "User Javascript File"
enter the path to the folder with your user.js files (eg.
"/sdcard/js").
At the end don't forget to tap "Save" otherwise your setting will not be saved! Restart Opera!
If you don't want to download the APK file then this second method
also works with Opera Mobile Classic. You can find the app in the
Play Store.
If you can install Google Chrome (Android > 4.0) on your mobile phone you can do remote debugging.
Overview of Google Chrome for mobiles :https://developers.google.com/chrome/mobile/docs/overview
Overview of Remote Debugging: https://developers.google.com/chrome-developer-tools/docs/remote-debugging
Another option for running Userscripts on mobile devices is the Tampermonkey userscript manager.
There are Tampermonkey add-ons for both the Dolphin and UC Android browsers.
Tampermonkey add-on for the Dolphin Web Browser:
https://play.google.com/store/apps/details?id=net.tampermonkey.dolphin
Tampermonkey add-on for the UC Web Browser
https://play.google.com/store/apps/details?id=net.tampermonkey.uc
To use them you first need to have the respective browser installed.

Remote debugging javascript on iPad from a Windows machine possible?

I have an iPad with iOS 6.1 connected to a windows 8 machine. I would like to be able to debug some javascript code running on the iPad.
The safari on iPad has a web inspect option that needs the iPad to be connected by wire to computer and then can be accessed in Safari for desktop's develop menu. I installed Safari 5 for Windows but don't see the iPad detected in the develop menu.
Any other ideas ?
The Firefox Tools Adaptor allows one to use Firefox DevTools for Safari on iOS.
https://github.com/mozilla/valence#debugging-safari-firefox-and-other-webviews-on-ios
For remote debuggin I use Weinre.
Weinre has almost everything you need, but lacks a JavaScript debugger.
It has a WebInspector for DOM manipulations, network traffic, timeline, resources and a console.
Checkout this project on GitHub: weinre-remote-debug to setup weinre locally.
Another option described on this page is jsconsole.com. By appending a <script> tag to your page (or running a bookmarklet on your device) you get access to a JS console.
To start, go to jsconsole.com and run :listen in the prompt. This will give you a unique session ID and a script tag that you insert into your mobile web page.
Now, any console output that your mobile page generates will be streamed to the console open in your desktop web browser, including any errors!
It is certainly no replacement for a full web inspector, but it can get you out of trouble when you don’t have access to a Mac.
Source: https://blog.idrsolutions.com/2015/02/remote-debugging-ios-safari-on-os-x-windows-and-linux/

Javascript on mobile os, android and ipad

Hello
I am trying to do a javascript function compatible on android and ipad, but i notice that android doesnt support ongesture** events?
1.It's really true?
.ongesturestart=function(e){
.ongesturechange=function(e){
.ongestureend=function(e){
2.Since I cant buy niether an Android system nor a Ipad, is there any Android/Ipad simulator for pc/windows/linux around the web? I need them for developenig and simulating web application based on touch/gestures events.
3.Is there possible that google hasnt develop chrome for android platform? and firefox for android/Ipad?
Thanks
1) These are new events added to iOS's version of WebKit. They haven't yet propagated to Android.
2) There is an Android simulator as part of the Android SDK. The iPad simulator is Mac only. But neither will tell you the true performance of your code--you need a device to accurately test your work.
3) Chrome is a desktop browser; Android's built-in browser is roughly equivalent. Firefox is a third-party browser and Google is not responsible for developing it. The very first hit for the Google search "firefox android", however, is a link to a Firefox Android beta. Search engines are your friends.

Best way to debug Javascript on an iPhone app?

I'm doing some rough development on the iPhone. I'm writing a native iPhone app, which uses an UIWebView object to load web sites with javascript. I find very difficult to debug the javascript code on an iPhone.
What are the methods/techniques available for this matter?
Since Safari on the iPhone is using webkit, you could use the debugger built into desktop Safari's web inspector. While there will probably be some quirks that are different between platforms, it will give you a pretty good idea of what's going on in the interpreter.
If you have access to an Android phone, you can debug your application using desktop Chrome's full developer tools and a USB cable (very convenient).
That means the debugger, profiler, HTML inspector, etc, all running on your mobile phone, but accessed through chrome running on your laptop/desktop computer.
Android Chrome and iPhone Mobile Safari are usually more similar to each other than Desktop Safari is to Mobile Safari, the screen format will be similar, the layout similar, and you'll be able to try real touch events, etc.
https://developers.google.com/chrome/mobile/docs/debugging
It'll require Chrome, an Android device able to run the android Chrome app, and a USB cable.
You have to install and use the ADB console command, but once its working, you'll have the full chrome developer tools interface available for debugging mobile.
Similar to Adrian Harris, it is possible to debug any website on the iphone by creating a dummy project in dashcode, clicking on "Mobile Safari" and then "Run"
Once the iPhone Simulator opens and safari opens with the dummy project website, click on the url bar of safari, enter any public url, and when you are at the site, you can click "Pause" and the debugger will pop up after any javascript code runs. At this point, variables can be inspected, breakpoints set, etc.
I know this is an old question, but wanted to update the answers with the latest info ->
The new safari (for mac) has a way to use the web inspector on an actual iphone or ipad in real time if you have the latest software (safari, iOS6, and MacOS) and an attached (with a cable) iDevice.
You access it by enabling it in the "advanced" safari preferences on the iphone, then under the develop menu in safari on the mac. See here for more info: http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/DebuggingSafarioniPhoneContent/DebuggingSafarioniPhoneContent.html#//apple_ref/doc/uid/TP40006515
You can also access the simulators in the same way (installed with xCode).
I agree with pjbeardsley. I would add to use your web page within http://www.testiphone.com/ just so you can see what the dimensions will be like. I would definitely use Safari and the Web Inspector for it as well
I have had mixed success using Dashcode which has a javascript debugger paired with the iPhone Simulator. It is a bit tricky to get working because you can't launch it without opening a project. But as I recall, I posted the project on the web, launched a placeholder project, and then debugged the placeholder project in Dashcode. Then I navigated to my url in the Simulator and was able to set breakpoints. There were probably a few other hoops to jump through, but once it was working, it was like I had a real debugger within Mobile Safari, which was great.
Good luck

Categories

Resources