I'm trying to debug a Phonegapp app on my Android tablet running via the Phonegap developer app.
According to this post, and Google's own remote debugging docs, Phonegap should show up as a tab in DevTools > remote devices because Cordova is basically just a WebView (as I understand it.) The device is connected via USB and is successfully detected. Alas, this is all I see when my app is running on the device:
If I open Chrome on the tablet, and go to a page, it does show up, so it seems it's only the app it won't show. What am I doing wrong?
[Update:
I also found this post, which makes the process sound decidedly more complicated. However, it's 3 years old and talks about modifying a file (AndroidManifest.xml) that I don't have in my PG build, so I assume it's outdated.]
Related
I want to get my hands dirty with app automation so I've been playing around with learning Appium (if anybody has any good tutorials send em my way!). I have an app on my local machine that I'm wanting to use for testing purposes.
The app is one I've created with c# and Xamarin Forms so I have all the files and the .apk locally.
I found a video that said you could use the chrome://inspect page to view apps in an emulator and even inspect them. When my app is running (starting it via Visual Studio) I can see it pop up in the device list but I don't have the option to inspect it.
I'm not sure how people feel about pictures but I don't really have any code to post so I'll just show you that the app is, indeed, running and what I see on the chrome devices page.
Here is my app running
And here is the device list from chrome. You can see the emulator there but I can't do anything with it
What am I missing here?
Chrome://Inspect is a part of Chrome Dev Tools that lets you see port forwarded web views from the mobile in a desktop browser. This is because we cannot inspect elements in Chrome mobile (something we do in desktop browser with CTRL+SHIFT+I) and we have to forward the chrome mobile window to chrome desktop.
To inspect element, if you're working on a web page or web application, just simply right click on that page and choose Inspect
And in your case, for inspecting Android application (apk), you should use UiAutomatorViewer, AppiumStudio, Katalon mobile spy, etc...
Here is my answer to similar question: https://stackoverflow.com/a/58204262/7302505
I have been struggling to figure out how to debug a webpage on mobile. Previously I have had no difficulty with this, but the last time I tried was maybe a year ago and some things have changed. I have an Android device with version 9 installed and Chrome stable 80. On the connected laptop I'm trying to use to debug, I have Ubuntu 19.10 and Chrome stable 80 installed.
The first thing I notice that's different is the disapearance of the remote devices tab in DevTools. Instead I am directed to chrome://inspect/#devices This is not documented in the relevant guide from google (an issue has already been filed). As such I don't know if the functionality is identical and therefore not part of my problem of if the move represents an important change that I am failing to understand in trying to debug my webapp.
Second. I go to the new devices page and find my device listed, great! The problem is that I can't figure out how to do anything with it. In the old remote devices tab there was a way to show the currently active webviews and chrome tabs and debug them. Now I see nothing of the sort.
I want to know what to do to get access to my browser on the device to debug. I have usb debugging active and connected. adb devices reports:
$ adb devices
List of devices attached
a6f8aef4 device
I have searched far and wide on the internet with no luck. This question is very similar but is in the context of Android 4.0 and trying to debug an APP instead of a chrome tab.
What am I missing?
I created a simple Xamarin ANDROID App. I set up my phone to development mode and deployed my app to the phone via USB.
The app continues to work on the phone as a regular app.
I then created a Xamarin MOBILE App which was more complex. I deployed it to my android phone via Visual Studio debug mode as with my previous app and it ran perfectly. But when I attempt to run the app directly from my phone, it won’t run. The first screen partially loads without anything on it and then disappears. My phone puts a message up saying that my app keeps stopping and would I like to close the app. I make use of a file placed in Assets. Might this be an issue when not debugging from the computer?
Might there be a difference between deploying a xamarin android app and a xamarin mobile app.
A minor thing is that it has added the name ‘.droid’ to the name of my app which I would like to get rid of.
I am new to deploying apps to a phone
I have solved it thanks to your helpful prompts.
I looked at the error logs and the error was ‘FATAL’ in a mono dll. This was indirectly helpful in that I knew it wasn’t the logic in my code.
I also made the discovery that running my app directly in the emulator also failed in the same manner as on my phone. I also ruled out that it might be an issue with transferring an asset -a file the my app uses- as I bypassed using the asset.
(Running my app via visual studio in both the emulator and my phone worked perfectly.)
I then decided to re-house my forms and classes in a new template as I suspected it was corruption in some xml configuration setting that didn’t bother Visual Studio. This worked great and the app now runs stand alone on the phone (and emulator).
I am developing a cordova Android application and want to remote debug it.
When I start my app on my Android phone thats connected to my Mac I can see the device and the inspectable app webview on Chrome's
chrome://inspect/#devices - page.
But whenever I click on the 'inspect' link a window opens and at once closes again.
I double checked the android:debugable-flag is set to true in AndroidManifest.xml application element and my device is set to be able to use USB-debugging. I use cordova version: 3.5.0-0.2.6.
Really don't know what went wrong.
Any help is appreciated.
I just found the answer today after searching the web again. I got to the following document:
Google remote debugging webviews
I just had to make sure I use:
Chrome Canary browser for debugging
instead of the normal Chrome browser. I test it and debugging works like a charme.
Just posted this answer for those which got a similar problem since nobody answered me.
We can use the inspect element/mobile device emulator in Chrome to add/edit CSS on live sites and see how the site behaves. Is it possible to do the same directly on an android phone or tablet, somehow?
I have been asked to improve a site (but I don't have server access) but have noticed that its navigation behaves differently in the Chrome emulator and on my Android devices. (It might be a javascript that interferes or does something on the phone that is not picked up in the emulator)
If you're running a modern version of Chrome, you can use the Remote Debugging feature for Android devices. This require:
Chrome 32 or later installed on your development machine.
A USB cable to connect your Android device.
For browser debugging: Android 4.0+ and Chrome for Android.
For app debugging: Android 4.4+ and a WebView configured for debugging.
The full details are documented at the linked page from Google's documentation, but the process essentially consists of connecting the device to your computer, enabling ADB debugging, and navigating to chrome://inspect in Chrome on the computer. From there, you'll be able to use the inspector on the Desktop Chrome instance to debug into your pages within the mobile Chrome instance.