Ionic View not recognized in chrome://inspect - angularjs

I want to debug my hybride application via the Ionic View App, using the chrome://inspect tab of my desktop chrome browser. I connected my device (Nexus 4) and can open the console for all other opened webpages in Android's chrome-browser. As described in the ionic.io documentation (http://docs.ionic.io/v1.0/docs/chrome-inspector), I should also see the Ionic View App appear in the inspect menu but that isn't the case... Am I doing something wrong? I installed the right driver for my device and can see and inspect other mobile webpages.

Make sure that you've built the app without --release flag, and also that cordova console is installed.
cordova plugin add cordova-plugin-console
ionic build android

Have you configured your device?
Steps
On your device: enable USB Debugging.
Connect your device via USB.
In Chrome in the 'inspect' tab (chrome://inspect) check the option Discover USB Devices.
Check the Chrome docs for more information, maybe you are missing something.

Related

How can I test and debug at chrome for Android App

I have made a simple android app using ionic and AngularJs and I run this app then it works in a a browser while I run app in Emulator then it is not working.So I want to find issue what is reason that it is not working so for this purpose I want to do testing and debugging
I have made a simple android app using Ionic and AngularJS and whenI run this app then it works in a browser while I run this app in Emulator then it is not working.
Please tell me how can I test and debug in a chrome for android app.And also tell me detail with step.
You can build the app in debug mode and then connect your computer to your Android phone that you want to test the app. After that, you install the app via the .apk that you just generated then start the app. Now that your app is running in your phone that is connected to your computer, you can debug via Google Chrome by inspecting it. Here is how to do so in details.

How to debug a react native mobile app using chrome inspect

The chrome inspect device doesnot list out the mobile application developed using react native.
I tried the react native chrome extensions but it didnt worked for me.
chrome://inspect/#devices
Is there any steps to that has to followed to inspect the react native apps?
You should active Remote JS Debugging from Developer Menu. to access Developer menu:
You can access the developer menu by shaking your device or by selecting "Shake Gesture" inside the Hardware menu in the iOS Simulator. You can also use the ⌘D keyboard shortcut when your app is running in the iOS Simulator, or ⌘M when running in an Android emulator on Mac OS and Ctrl+M on Windows and Linux. Alternatively for Android, you can run the command adb shell input keyevent 82 to open the dev menu (82 being the Menu key code).
I would recommend using React Native Debugger, which gives you a Chrome inspector but it is built specifically with features for React Native.
https://github.com/jhen0409/react-native-debugger

Chrome Netbeans Plugin only shows blank page

I'm learning AngularJS at the moment and thought I would install netbeans as it supports debugging in chrome via a plugin. Or claims to at least...
I have followed the user guides and tutorials that I've found and always seem to falter at the same point:
Install Netbeans
Install chrome plugin
Create a simple sample project
Set the default web browser to Chrome with Plugin
Click run
At this point I always see a blank page loaded in Chrome. I suspect that this is a bug as all of the resources online seem sure that I should be able to see the default index.hmtl page in my browser...
I'm running on a MAC:
And my plugin version is:
My Netbeans version:
My Default Browser in Netbeans:
Does anyone know of any issues with running this configuration? No matter what I do I just see a blank page with a mangled URL like so when I hit run:
http://file:///private/var/folders/4l/3gq9477n6_952q1ztvz5ngdckcdyx4/T/blank2587611836421039861.html
When I open this file in VI I see one line in it:
<html :netbeans_temporary="true"></html>
This seemed to work as a workaround for me:
Open the project configuration and change the browser from Chrome with netbeans connector to Chrome
Run the project (the correct page should come up in Chrome)
Click on the Netbeans Connector in the upper right corner of the Chrome window
Select "Debug in Netbeans" (You should get the yellow information notice across the top of the window)
Go back to Netbeans and click on the 'debug main project' button.
My configuration is os/x High Sierra, Netbeans 8.2

Codenameone Bluetooth APIs not working on android

I have downloaded BluetoothDemo from https://github.com/chen-fishbein/bluetoothle-codenameone. I created APK file using codename one build server and install it on my android mobile. Its not working. Is there any way to fix it?
Can I run the same from netbeans using AVD manager or something similar to that so that I can debug it myself?
If I started bluetooth manually, following is error on mobile phone on click of initialize or start scan option-
Error snapshot attached
You need to also add the https://github.com/shannah/CN1JSON/ cn1lib and install it using the codenameone-refresh cn1libs action
If you are running Android 7.x. you will also need to make sure that 'Location' is enabled in the App settings, otherwise the behaviour will be exactly the same as described in the question. See this comment. Codenameone provides a setting for permissions in their build hints with ACCESS_COARSE_LOCATION but that does not seem to work on my Nexus 6P with Android 7.1. I had to enable it manually.

Ionic Framework app works with "ionic serve" but not in Ionic View app

I have a very small Ionic app I've been working on (just a couple angular routes/views). When I run it using "ionic serve", the app loads in my browser as expected. However, when I upload it using "ionic upload" and view it in the Ionic View app, it appears as though none of my javascript works, or my routes are not working.
How can I debug this issue? Are there build tools to detect errors or anything along those lines?
As #Keval says if you're running Android you can debug on-the-fly using Chrome
enable Developer options on your device (Settings > About, then find Build number and keep tapping it...yes really!)
In Developer options, enable USB debugging checkbox
plug in with a USB cable
run your app on the device.
At some point your device will then show a popup requiring you to accept debug commands from the remote computer, click Accept. If it doesn't appear the first time, unplug and replug usually fixes it
head to chrome://inspect in desktop Chrome, and click inspect under your device
A new Chrome window will open with all the juicy abilities you need - inspect code, set breakpoints, look at network speeds, access the console and so on
You can also do this on iOS via Safari http://developer.telerik.com/featured/a-concise-guide-to-remote-debugging-on-ios-android-and-windows-phone/
I had the same issue recently. The problem was that I stored my Ionic views NOT in /templates folder.
Please, check, maybe my answer will be useful for you.

Resources