debugging solutions for opera and internet explorer - javascript

Searching for solution or methods of debugging my jquery script under the Opera/IE browser. Seems that its not send ajax $.post() request or send it to incorrect address or something similar. There is no problems at Firefox. Maybe somebody know addons or other hacks to check what actual data send by the browser at buckground (request headers, answers)?
Where is something similar to Firefox Javascript Console at Opera and Internet Explorer?

Opera has a developer-tool called Dragonfly. Simply rightclick anywhere on your page and select "Inspect element". Here you have console, inspector mode, NET and so on. Everything you need.
IE also has a developer tool. You access this by hitting F12.
Based on what you need, these tools should be enough.

I use fiddler2, its brilliant and will work with all browsers as it is a standalone application.
Fiddler2 Web debugging proxy

As OptimusCrime says there is a developer tool in IE.
It's worth mentioning that IE (7 and 8) will throw an error if the tool is disabled and there is any reference to the console in your code.

Related

Intercept HTTP request via Internet Explorer extension

I need your help.
I'm developing an IE extension and it must get information about every outcome HTTP request done from the IE. Is it possible?
For example, in Chrome it can be achieved with chrome.webRequest, in Firefox - with httpObserver, but I have not found a way to do it in IE extension.
Is it possible?
Thanks!
I think what you are looking for is
HttpListener
There is more to read about it on MSDN:
https://msdn.microsoft.com/en-us/library/system.net.httplistener(v=vs.110).aspx

Open link from IE to Chrome

Hi maybe this is too easy to ask but i am just thinking if this is possible.
For example i have a button that im a using Internet Explorer then i want its link to Open using Google Chrome? Is this possible? I am using the code below. From Internet Explorer to Chrome browser
$("#myBtn").click(function(){
window.open('https://facebook.com');
});
I have tried the above code using Internet Explorer but as expected the link open in same Internet Explorer. I want to open it in chrome
Nope, not possible.
You can't specify what program to use in either HTML or JavaScript, to open an url.
Technically, in IE ActiveX Objects could open a certain program, assuming ActiveX isn't blocked, and you know the exact path to the application.
So, that still wouldn't work in most cases.

Why won't Visual Web Developer act as my Javascript debugger for IE7?

I need to debug some JS that isn't working in IE7, so I installed Visual Web Developer 2010 Express into my IE7 virtual machine, with the intention of using it to debug whatever I want. But when I get a Javascript error in IE7, I only get the generic "problems with this website" message, and no debugger:
"Disable script debugging" is off in Internet Options and "Display a notification about every script error" is on. I have tried resetting the default settings for both IE and Visual Web Developer, and disabling all add-ons for IE.
Anybody know what gives?
Make sure your default browser is set to the browser you're trying to test against (in this case, IE 7). When you start debugging your empty project in Visual Wed Developer, it should open the default browser.
Not sure about the nature of it, but some magic happens behind the scenes that enables the script engine in IE to be exposed to the developer through the IDE.

Is there a way to use Webkit Inspector Remote Debugging in iPad?

I have an iPad and I am wondering if I can remote debug it from the desktop using Webkit Inspector? As I understand it, it requires you to launch the browser with a command line switch. I do not think that's possible to do in iPad, but I may be wrong.
What about iPad2? Or Android powered tablets?
See weinre
Here's an excerpt:
It's a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it's designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone.
If you aren't familiar with FireBug or Web Inspector, weinre isn't going to make too much sense to you. weinre reuses the user interface code from the Web Inspector project at WebKit, so if you've used Safari's Web Inspector or Chrome's Developer Tools, weinre will be very familiar.
Now you can debug using Safari 6 and the new Web Inspector straight on the iPad/iPhone simulator http://encoreptl.tumblr.com/post/31512516711/web-inspector-debugging-for-iphone-and-ipad-from-mac-os
Also a new blog post out using private apis that makes this very easy -- see http://atnan.com/blog/2011/11/17/enabling-remote-debugging-via-private-apis-in-mobile-safari/
For the iPad Emulator (Xcode 4.2) you can use iWebInspector to comfortably enable the remote console:
http://www.iwebinspector.com/
Your question mentions Android tablets. With Chrome for Android (4.0), you can debug web pages remotely in Chrome for the desktop over USB. I use this and it works very well. See https://play.google.com/store/apps/details?id=com.android.chrome&hl=en and https://developers.google.com/chrome/mobile/docs/debugging.
Edit: weinre, mentioned in the accepted answer above, also reports that it works in the Android browser.
Paul is correct, weinre is great. In addition, in http://css-tricks.com/14727-five-questions-with-paul-irish/ Paul Irish hints that this will be (is?) possible with the Chrome Developer Tools/Webkit Inspector:
I'm very excited about the work the team has done on remote debugging as that is now available to all mobile WebKit ports, which means you're able to profile, view network detail, and edit the CSS live on your device.
I have yet to see an example on how to do this with iOS Safari, however.
You can also use this to activate Firebug on your device. Worked for me on Windows
http://martinkool.com/post/13629963755/firebug-on-ipad-and-iphone
Safari allows you to debug and inspect the elements in the mobile browser. Also many remote consoles like www.farjs.com or jsconsole.com also allow that.
www.farjs.com used with a debugging proxy like Charles also allows you to debug a web-views in native apps.
If you are not tied in to Webkit-based debuggers and can also debug using Firefox's Inspector, using Firefox Developer Edition might be your answer.
This version of Firefox includes WebIDE and Valence, which together make it very easy to debug Safari on iPad. Here are the steps to follow:
Enable the 'Web Inspector' on Safari in your iPad: go to Settings > Safari > Advanced > Web Inspector and make sure it's on.
Open the page that you want to debug.
Connect the iPad to your machine with its USB cable.
Open Firefox Developer Edition in your machine.
Click on the WebIDE add-on in Firefox (you might have to look for it under the main menu)
Select 'Safari on iOS' as the Runtime
Click on 'Open App' and you'll see the page that you opened on Safari listed there.
Select it. A FF dev tools window will appear.
Debug away!

Debugging javascript on Android tablets/phones?

How do I enable the debug view like I can in Safari on iOS? I simply need to see if a Xoom that I'm testing a page on is generating javascript errors. I was trying to find how to enable the dev tools in the Android browser like I do for iOS but can't seem to locate it.
I've worked on an Android app in the past where the java developer set it to alert JavaScript errors - caught an extra bug that we didn't catch in the iOS version because of it. So, if you have access to the java layer, I'd check that out. I asked him what he did specifically and he said:
"There's a callback from the WebView class that lets me know when the JS code throws an error. I implemented that callback to display an android dialog."
There's two solutions other ideas on top of this that I use for debugging (ios/android). These are especially useful for embedded web views in games where you don't have access to the built-in console:
1) Weinre a still beta, but functional, remote debugger. It'll give you a faux inspector on your desktop that you can query / see errors on your remote device with. Has a whole dom inspector and anything. The guy that develops it is pretty responsive, too.
2) I write a javascript log function that hits my servers error log. Just tail your log file and you're good to go. My javascript function looks something like this:
function hlog(){
var s = Array.prototype.slice.apply(arguments).join('ΒΆ');
document.createElement('img').src = 'http://yourdevbox/debugger/?m=' + encodeURIComponent(s);
}
That way I can take any number of arguments.
My php page that recieves this request looks like this:
# ensure this can't be used in production
if (strpos($GLOBALS['HTTP_HOST'], 'devboxhostname') < 0) die(':(');
error_log($_GET['m']);
Hopefully in the future, mobile devs will have way better debugging tools.
Android doesn't (currently) have a WebInspector like Chrome/Chromium does.
You can still look at any console.log() messages fired under window.console in logcat.
Source: http://developer.android.com/guide/webapps/debugging.html
Also, whilst Firefox 4 is available for Android, Firebug currently isn't supported on the mobile version of the browser.
type about:debug into the url field and validate, a javascript console will then be available (same method to remove it)
a bit more on this page: https://android.stackexchange.com/questions/5999/android-browsers-aboutdebug-what-do-those-settings-do
The best you can do is use console.log() (like firebug), and then install a log viewer on your phone, filter based on browser, and you can see all the console messages. (source)
Try
Weinre: Web Inspector Remote / Watch demo
"Weinre is a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it's designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone. "
You may have a look some other remote debugging tools: jsconsole or
Aardwolf
Opera mobile has remote debugging:
http://dev.opera.com/articles/view/remote-debugging-with-opera-dragonfly/
The Android default doesn't seem to have a debugger, although you can debug on chrome/chromium on a pc, which uses the same webkit rendering. (There's even a emulate Android option, but it doesn't have all the quirks of Android tablets, image/memory constraints etc.)
Firebug Lite is also a possibility:
http://getfirebug.com/firebuglite
You don't have to install any software or try to debug in your tiny mobile screen.
First enable USB debugging in your device in the "Developer settings" and then use your desktop chrome to connect and debug the mobile browser.
I found the easiest way is to enabled USB debugging on the phone/tablet and in your desktop navigate chrome to
chrome://inspect/#devices
Enable discover usb devices and then on the list of apps click "Inspect"
Voila! Remote debugging! Now you can debug your phone from the comfort of your desktop

Categories

Resources