console.log browser in android emulator

How to see 开发者_开发知识库console.log messages of a website using android emulator?

---

From Rich Chetwynd's short article "Javascript debugging on Android browser".

You can log javascript errors and console messages from your Android device or emulator. To do this you first need to install the Android SDK and USB drivers and enable USB debugging on the actual device.

To check if the device is connected correctly you can run the following cmd from your Android SDK tools directory and you should see a device in the list

c:\android sdk..\platform-tools\adb devices

You can then use the Android Debug Bridge to filter debug messages so that you only see browser related messages by running the following cmd.

c:\android sdk..\platform-tools\adb logcat browser:V *:S

By default the log is written to stdout so you will see any Javascript errors or console.log messages etc written to the cmd window.

Further details: Logcat CLI tool docs.

---

If you have started the emulator from Eclipse with the ADT plugin, you will see all JavaScript console logs directly under the LogCat view :

Window -> Show View -> Android -> LogCat

---

If you are using Android Studio; you can open your Logcat (Alt+6) and filter for: :CONSOLE

Filtering for only :CONSOLE (rather than INFO:CONSOLE) will display all types of console messages (including ERROR, WARN, etc).

---

You could add some JavaScript temporarily like...

var console = {
    log: function(msg) { alert(msg); }
};

Ugly as hell, but it works.

---

I hijacked the console.log using this code:

function logManager() {
    var self = this;

    self.init = function () {
        console.log('logmanager initialized');
        var old = console.log;
        self.logger = document.getElementById('log');
        console.log = function (message, options) {
            if (typeof message == 'object') {
                self.logger.innerHTML = (JSON && JSON.stringify ? JSON.stringify(message) : message) + '<br />' + self.logger.innerHTML;
            } else {
                self.logger.innerHTML = message + '<br />' + self.logger.innerHTML;
            }
        }
    }
    self.toggleLogVisibility = function () {
        return $(self.logger).toggle();
    };
}

And consume it like so in your html with your own styling (absolute top right is what I used)

<div id="log" class="log">
    Application loaded...
</div>

And in your jscript (run this on page loaded as the log element has to exist)

document.lmgr = new logManager();
document.lmgr.init();

---

Open this url on your chrome

chrome://inspect

---

Command - get log from the emulator

adb -e logcat 

adb.exe can be found at $your_installation_path$\android sdk\platform-tools

more detailed https://learn.microsoft.com/ru-ru/xamarin/android/deploy-test/debugging/android-debug-log?tabs=windows

---

If you're hear and cannot run adb logcat browser:V *:S because of zsh, you need to run noglob adb logcat browser:V *:S. Rationale: https://github.com/ohmyzsh/ohmyzsh/issues/2901