Debug Sencha App in Mobile Browser - android

Good Day!
I am a newbie to the mobile tech. I have a question hope you can give me some tips or help.
My problem right now is i have a sencha app. I try deploy it using android eclipse.
1.How can i debug it from mobile?
Note: I already installed a chrome dev tools from my laptop, but the problem is that when the application launch in my mobile it doesn't use a browser.
2. How can i call my sencha app in the chrome browser mobile.
Thank you in advance.
Sincerely yours,
Jhon

Are you mainly trying to access the same dev tools that the Chrome browser gives you? If so, there are a few solutions out there. For Android you can use weinre for remote debugging:
http://people.apache.org/~pmuellr/weinre/docs/latest/
In fact, PhoneGap had a hosted instance of this online a while ago, last I remember (quite a while ago) it was down for a long time, but I just checked and it appears functional:
http://debug.phonegap.com/
It will probably run slower than your own weinre, but it saves you the trouble of dealing with setting up on your own server.
If you are working on iOS there is actually a rather nice way built-in to iOS/OSX. You need a machine with OSX on it, plug in your iOS device or run the iOS simulator, and then open Safari on your laptop/desktop. Safari has a develop menu, allowing you to open debugging tools (inspector, console, etc) for your remote devices.

Related

Web development on Android tablet - no dev tools?

Suppose you wanted to do web development on an Android tablet. There are some options available for code editors etc. One thing I can't get around is that Chrome for Android doesn't have dev tools. It doesn't even allow to disable the cache. Are there any other browsers that have the basic console and inspect element functionalities?
Please note that it doesn't have anything to do with remote debugging. I'm looking for a way to develop with an Android tablet only.
The only thing that comes to mind is BrowserStack, but it would be slow as hell especially on a mobile device.
Look at these features requests for both Firefox and Chrome. Sadly, nobody seems to really care, given that remote debugging solves the problem when you have a computer next to your tablet.
https://bugs.chromium.org/p/chromium/issues/detail?id=817837&q=&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified
https://bugzilla.mozilla.org/show_bug.cgi?id=1434065
In the meantime, you can :
use a service like Browserstack with the devices (ex. Galaxy S9) that offer native debugging (the devtools are on your side, communicating with the remote mobile device)
use that modified version of chromium and the accompanying hack : https://github.com/laem/chromium. Building a stable and fast version of Chrome is time and resource consuming, any help appreciated !
The best solution would obviously be to build Chromium with the devtools integrated, but I don't have enough knowledge : is it just an "if (!android) import DevTools" line to remove ? Or would it need lots of adaptations to work ? It's all HTML and JS as far as I know, so it shouldn't be that hard to get the console, debugger and inspector to work.

How to debug and view HTML ans CSS source code for Android default browser?

I always have issue with the CSS styling in the default Android browser while building my responsive website. What I usually do was doing trials and errors on pc until the problem was solved.
There is a tool for chrome browser:
https://developer.chrome.com/devtools/docs/remote-debugging
but chrome usually display fine for me just that I need a debugging tool for the default Android browser. Is there any solution for this?
I'm not aware of any way to test on the old android browser using remote debugging, as new devices nowadays (Anything post 4.0) have chrome installed by default on Android.
One method you can use to help with testing responsive/mobile sites is using Chrome's mobile emulation tool
Either select a device on that list, or fake out the user agent with something from this page http://www.useragentstring.com/pages/Android%20Webkit%20Browser/

cordova VS mozilla open web app

I'm working on the idea of a project that has to run as well online (via a remote server) and offline, on desktop (Linux/Mac OS X / Windows) and Firefox OS / Android mobile devices (Windows Phone and IOS is not a need).
This project have to be open, and I want to be as close to standards as possibles. I know a little about both Cordova and Mozilla Open Web App, and both seems to be really great on this aspects.
So, my question is : Which, between Mozilla Open Web App and Cordova, seams the closest to the future standards of web apps, and which can really respond to the need of running the app as well online and offline.
PhoneGap is a good choice if you target only mobile devices: you would have been able to use their APIs to create Firefox OS as Android applications. Since you need to target all desktops, Mozilla Open Web App is the choice.
By creating a Firefox OS applications, using HTML, CSS, and JavaScript, you will of course have an application running on Firefox, but you will also be able to run it on Android if you have Firefox installed. Last, but not least, you will be able to make the application run on the desktop, again, by having Firefox installed.
As for the offline support on your application, you can either use IndexedDB or create a packaged app.
When it comes to the Web Standards, Firefox OS is using the standard you know. On top of that, WebAPI is available, so you can access to the hardware, and create a better experience with the platform. Those APIs are not part of the standard right now, but we are working with the W3C to make that happens. Note that if the standard change to something we did not have, we will make the change to be standard compliant.
P.S.: Full disclosure, I'm working for Mozilla.

How can I debug HTML elements and javascript in Android and iOS?

I have been working on a project which uses SVG animation.
I works perfectly on PC browsers but it doesn't work in iOS safari and chrome.
And it partially works in android stock browser.
Please help me how to debug it.
The mobile Chrome browser has a remote debugging interface.
If i remember correctly, mobile Safari has a debugging console. It's not quite as comprehensive as the remote debugging, but it's okay for rough debugging. If you are on OSX, then xcode might have a more comprehensible debugging tool for mobile websites.

How to debug a website on Android?

I don't have an Android phone or tablet, and it seems that on some Android devices using stock browser my website is stuck for half a minute until it loads.
I've been testing with various emulators found online like BrowserStack, etc. The browser is just stuck for a while. That's not the case for iPhone or desktop.
How can I debug this issue? How can I see a developer console or errors or figure out what's causing the slowness?
You can use Remote Debugging with Chrome for Android if the problem happens on this browser (which is the default browser on recent Android versions)
How to use Remote Debugging with the emulator
If the issue only occurs with the legacy Android browser, you might be able to get some information by monitoring the http requests with Fiddler
How to use Fiddler with Android
These links will help you debug code in general without having a physical android.
Android studio user guide on debugging: Start, Projects and Tools.
Google developers page.

Categories

Resources