How can I remote debug a PWA that has been "added to homescreen" on Android? - google-chrome-devtools

I have installed a PWA on my Android device and I want to remotely debug it in Chrome on my desktop. When I connect to my device in Chrome dev tools, all I see are the tabs open in Chrome on my Android device. I do not see the instance of the PWA that has been installed - "added to homescreen" Is there any way to debug the installed instance?

You have to open your developer tools using Ctrl+Shift+I
Then go to More Tools -> Remote Devices
In Remote devices, you can see your available online device and click on that(either online device can be emulator or it can be attached mobile device), also you can Add Rule if you want to run in localhost from mobile device.
Click on Inspect button, available in right side
Now you can see virtual device is created and you can see all logs that comes from device will display in Console tab

I was having the same problem. Turns out that PWAs that were open before you connected remote debugger will not show up. Simply close the app and start it after connecting the debugger.

Related

How to use chrome remote debugging with ionic framework?

So I'm reading in this link and it says we can use chrome for remote debugging an app which seeems great but they don't explain how to do it. When I click in the link they provide which has some android documentation, I just see java code. As a non java-developer I wonder how can I use remote debugger in chrome for ionic framework?
To access remote debugging of a webview on your phone, plug your phone into your pc and go to chrome. then type: chrome://inspect into the url bar. open your app on your phone and it should show your device on the inspect dashboard.

Nexus 5 doesn't show in eclipse

I have some problems to connect nexus 5 with eclipse.
I am using windows 8.1 and I have installed the nexus drivers from google_usb->http://developer.android.com/sdk/win-usb.html
I can see my device in ADB(using adb -devices) and in DDMS on eclipse, but I can't send apps to debbug it, just nexus doesn't appear in target in eclipse.
In Device Manager my nexus appear like Android Composite ADB Device
I have the developer options enabled and USB debugging too.
http://www.htcmania.com/attachment.php?attachmentid=607751&stc=1&d=1414926573
EDIT:
I only just tested with android studio and it works, but I don't understand why in eclipse doesn't work
Make sure it says connected as a media device. If it says connected as a camera, tap to change the USB options and check the "connect as a media device" check box.

Troubleshoot Android 4.3 webview within an app that requires up-to-date Google Play services

I need to troubleshoot an issue happening in a webview running within my app. This issue only occurs on Android versions lower or equal to 4.3. My app requires an up to date version of Google Play services.
In order to troubleshoot my webview, I usually can run my app under the Android Emulator (with the latest version of Android), then connect to the web view via Chrome (using chrome://inspect) - the web view appears in Chrome and I'm able to browse the DOM and debug.
To run the app under 4.3, I've created (under AVD) a new device from an existing device definition,
then picked the target Google APIs (Google Inc.) - API Level 18. I've then installed my app, but when trying to run it, I get the error message "This app won't run unless you update Google Play services.". There's an "Update" button on the previous dialog, but nothing happen when clicking on it.
I then tried to debug my issue using Genymotion. I've created a device under 4.3, followed these instructions to flash my device with the latest Google Play services and installed my app. I can now run the app and reproduce the issue within this simulated environment.
The trick now is to be able to connect to the web view from my local Chrome browser. I've enabled remote debugging as described here. Now my device appears in Chrome, but the web view is not showing up in the inspector. Similarly, if I open a new tab under the native browser, it won't show up in the remote inspector. If I open a new tab under Android Chrome though, I can see it showing up under my remote Chrome inspector.
I can see two way moving forward and successfully accessing to the DOM of my webview:
Fixing the "Update" issue under the Android Emulator running 4.3
Or
Connecting to my web view from my Chrome inspector while running the app under Genymotion
Any idea on how to solve one of these two problems?
I have been using weinre for sometimes. it's a pretty good tool to debug webview for android 4.3 and lower. It provides almost same interface as chrome debugger.
All you need to do are:
Install weinre
sudo npm -g install weinre
Client side:
Insert the following code to your webpage <head> section.
Note: it's better to put it at end of <head> section, otherwise there will be some strange errors and debugger won't show up.
<script src="http://<your server ip here>:8081/target/target-script-min.js"></script>
Server side
weinre --boundHost -all- --httpPort 8081
Debugger
open the debugger tool from weinre from your desktop browser:
http://localhost:8081/client/
Finally,
select any target in Targets part and then start debugging.
Remote debugging web views only works on devices with android 4.4 and above.
have a look at this :
https://developer.chrome.com/devtools/docs/remote-debugging

How to view logs in Samsung Smart TV log viewer

In the Samsung Smart TV menu there is an option to "Start receiving Smart TV logs". It's "OFF" by default.
When I clicked it I received a prompt to "Check the Console View". I opened the console view and ran the app on emulator, but i couldn't see any logs there.
I know that when the emulator is launched, a separate window showing all the alert(".."); logs is also launched.
I want to know how to use of this option of viewing logs via Console View. I'm new to Eclipse and Smart TV SDK. Is there anything that I'm missing?
How is this different from the logs that are already being shown with the emulator
The console log is used for debugging in real devices.
Emulator already have it's own debugger console window so the emulator not sending anything to eclipse.
If you want to work with real devices this feature is very useful. Do app sync from TV to your workstation and enable the log receiver. When your synced apps run in the real devices (TV/BDP) the alert from application will sent to eclipse's console window
The app will send its logs back to an active eclipse console on the system from which it downloaded the app.
I'm working with eclipse on windows, so I gave my pc a static ip address and installed the Apache 2.2 web server. After uploading my app, I enable the console and open the console view as you did. Then, I start my app, and I see all the log information in the console.
I find this log information essential, because some services return an error in the emulator, but actually execute successfully on the tv. Many of these services are interacting directly with the tv hardware, and there is no other way to debug them.

How to sync Android device with eclipse

I have a Android device. How to sync with Eclipse for execute code directly in mobile not in emulator.
Just simply connect your phone via USB cable to your computer and run your application. Window pops up and you can choose then between connected devices. Make sure you enabled debugging mode in your device.