I was trying the Geolocation example from the below link.
http://docs.phonegap.com/en/1.7.0/cordova_geolocation_geolocation.md.html#Geolocation
I copied the entire content from the first 'Full Example' and saved that file as an HTML. When I opened it in Chrome (desktop) and Android phone inbuilt browser(default), I got the following three alerts on both chrome and android phone.
gap:["Device","getDeviceInfo","XXXXXXXXXX"]
gap:["NetworkStatus","getConnectionInfo","XXXXXXXXXX"]
gap:["App","show","XXXXXXXXXX"]
I clicked 'Cancel' first time and even tried 'Ok' but, nothing happens. If I click 'OK' on all three alerts on my Android Phone, the page goes all white.
So I googled it and found couple of answers on Stack Overflow suggesting:
To remove the Cordova JS file for the desktop browser
Add android specific JS from the Cordova.
So I tried both but none of them worked. Latest, I tried the following solution.
I downloaded the Cordova package (3.0.0), there was a cordova-android.zip which had the cordova.js file at the following path.
/cordova-android/framework/assets/www/cordova.js
So, now my script element looks like this:
<script type="text/javascript" charset="utf-8" src="/cordova-android/framework/assets/www/cordova.js">
After modified the <script> element as above, I don't get alerts in Chrome, but I still get following NEW alerts on my Android phone.
gap:["PluginManager","startup","Plugin ManagerXXXXXXXXXX"]
gap:["App","show","XXXXXXXXXX"]
Code: 1, message: User denied Geolocation.
So, now I have following questions:
How do I solve this problem (to run the HTML page without alert on all devices/browser)?
Any idea on why did my alerts change after changing the cordova.js file?
Regards,
Rumit
Your problem is that you're using cordova.js as if it's a JS library like jQuery, but Phonegap (Cordova) is a hybrid framework not a mobile browser framework (see here for clarification). It's not intended to be used as a standalone JS library in a webpage, but in conjunction with a native Phonegap library in order to build a native application. If you created your page as a Phonegap app and built it for Android, you would be able to (and need to) allow the app permission to use geolocation.
Phonegap apps are implemented via a native WebView and in the case of the Geolocation API, Phonegap will use only use its own implementation if the device doesn't already have a native W3C implementation (which Android does).
So the point is: either create a proper Phonegap app for Android by following the platform guide or simply don't use the Phonegap JS at all since you can call the Android browser's geolocation API (navigator.geolocation) directly from Javascript in your webpage - you don't need Phonegap's JS file to allow you to do this (have a look at the answer to this question).
Related
This question is related to my earlier question How to Debug Javascript in IOS Action App Extension. Basically, I am developing an mobile safari extension, and part of the work is to develop a javascript (operating on top of "document" provided by mobile safari) to run inside the app extension.
However, I have not found a way to debug a javascript file inside an app extension. Now, I am trying to ask the question a bit differently - given mobile safari on a page, can I somehow run an external javascript on that page and debug this external javascript? I suppose that Safari Web Inspector could help with that? Thanks.
(This is a slightly customized answer from your other question)
The official documentation for this is [here][1].
It's not too hard, although recently I've had an issue with the page showing up when connected to the iOS simulator. In that case I just ended up using my phone directly. (Apparently you need to start desktop Safari after the iOS Simulator has started to inspect "remote" Simulator sessions)
Ensure that on the device Settings->Safari->Advanced->Web Inspector is on.
(Make sure you've Trusted the computer from the device)
Start MobileSafari on your device.
Start Safari on your desktop, make sure Show Develop menu in menu bar is on in Preferences.
In the Develop menu you will see your device name, say 'BSharer's iPhone'.
select the page name underneath your device name, say 'en.m.wikipedia.org - Wikipedia'.
You are now debugging that device's page on your desktop. The developer page will open and you can debug as if it was running on the desktop machine. You should now see all the JavaScript that is available to that page and set breakpoints.
(The app extension requires the debugger; statement because we don't see the javascript files injected by the app extension. You can still use the debugger statement but it's not usually necessary.)
i am trying to build a mobile app, but i need some jQuery functions to make it function. at first i thought nothing was wrong since i am debugging it using ionic serve on firefox and everything seems to function. all interface runs smooth and jquery commands executing properly. but when i compiled the app and installed it on my android device. the jquery functions seems to not respond.
i embedded a CDN for the jQuery
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"> </script>
i hope somebody can help me out here.
Since you have used a CDN for jQuery the application makes a http request to retrieve the js file when its run. This happens in background when you run the application on the browser with ionic serve. But when you run it on a mobile device it needs to have special permissions configured to make the required http requests.
White listing the domain using the cordova-plugin-whitelist will solve the issue.
Hello I am new to Weinre and I need to debug my website which seems to act strange when opened using an IOS platform.
So I am using Weinre to debug it. I installed the tool and tested it running with the demo targets in the server itself.
Now I need to add my website as a target and run it with an iphon (or ipad) and debug it with Weinre. I don't know how to add my website as a target, I cannot manually add the
<script src="http://123.456.7.89:8080/target/target-script-min.js#anonymous"></script>
script (do not have permission to manually change the page). so How can I do my debugging with Weinre?
Thanks
You can try using a bookmarklet. The main weinre server page actually has a bookmarklet in it, for itself, that you should be able to use directly, if you can figure out how to set up a bookmarklet for your device. This seems to change release-release for mobile browsers, so you might want to do a google search on "bookmarklet" and your device's name or the OS release, to see if anyone has any tips.
we are shipping a Cordova WebApp for tablets with minified source using uglify2-compressor via grunt-contrib-requirejs. We generate source-maps for debugging which work flawlessly using the chrome desktop browser via remote Debugging on a KitKat Android Tablet.
Now we like to send error reports from our customers to our server. The Android WebView does not seem to care about our source maps. Therefore we get error message like "line 1, char 1231231" - not very helpful...
The Question is: Is it possible to use source-maps with the Android (and iOS) Webview maybe using a Cordova plugin or do we have to wait for an update (Chrome and Firefox Desktop are able to parse the maps...) and ship un-minifies code so that we are able to get the line number of the occurred error?
From Chromium discuss topic
DevTools downloads source maps using the front-end browser, not the one that runs the inspected page. So file://android... is never going to be accessible. You need to point to the files on your development box instead.
I have seen several posts that talk about remote debugging of javascript code on Android, but they all miss the point of what I am trying to do.
I have a Nexus 7 and I want to use it as a remote development environment when I am away from my desktop. I have created a chrooted debian distribution to run apache and php and git (via ssh). This chrooted environment mounts a subdirectory of the /sdcard directory from outside the chroot environement. Apache document root of a virtual host is pointing at a directory within this. Before leaving the desktop I can git push the latest release to the tablet. When I return git pull can get what I have done back again.
I then (when away from home and NOT connected to any network) can edit the code using an Android editor (using the 920 text editor), but then run the browser to look at what I have developed using localhost the apache virtual host picks this up and displays it.
The application I am developing IS NOT FOR ANDROID - it is ultimately for the desktop. But I want to be able to debug it like I was on the desktop. Breakpoints and single stepping are the prime thing, but also I tend to use the html section in firebug to adjust my CSS before editing it.
Is there a way to get either the chrome developer tools or firebug add on for firefox to load into a browser that will run in android?
I use Firebug lite bookmarklet for iPhone and iPad, never tried on Android, check this out http://martinkool.com/post/13629963755/firebug-on-ipad-and-iphone it must be similar on Android.
To activate it use this steps:
Create a new bookmark or bookmark a page
Rename the bookmark to “Firebug”
Copy the textarea link:
javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?Fi+'NS':Fi;Er;Er;Er;(Fe[0]||Fe[0]).appendChild(E);E=new%20Image;Er;})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');
Edit the Firebug bookmarklet, remove the URL and paste the
bookmarklet
Choose “Done” (on the virtual keyboard) and you’re all set
Hitting that bookmarklet should give you a fully functioning Firebug at the bottom of your mobile device.
At least not for Firefox Mobile, because all the devtools are still partially based on XUL, where the Firefox Mobile is using Native UI.
I don't think there is any plan in the close future to change this situation; it's not a common scenario.
However, you should be able to do something using the Debugger API, creating an add-on for Firefox Mobile. But I don't know if it's worthy.