Problem running a jQuery application? - javascript

I'm developing a jQuery mobile application. The application is developed in JavaScript, jQuery, and HTML. When I debug the application in browser using Firebug (in Firefox) it's working fine, but it doesn't run normally? Is there a reason it's running in debug mode only?

Your question is worded somewhat confusingly so I'm not quite sure what you mean but I think you might be running into a problem with console.XXX() statements in your JS - on a browser that doesn't have console defined (like IE) or a Firefox installation that doesn't have Firebug, console will be undefined and your JavaScript code is likely to fail if you have forgotten to comment out your logging statements. You can verify if that is the problem by commenting out all calls to console (or by watching the console and looking for log output).
A long term solution might be to define the console object when your JavaScript initially loads if it finds that the console doesn't exist - this way, even if you forget to comment out calls to console and someone who doesn't have Firebug installed or is using a different browser tries to use your code, they won't run into this issue. Take a look at this blog post

Related

Where is the Javascript Console/window?

I'm looking for "Javascript Console/window" where code is evaluated and printed back within VSCode and can't find it. My Udemy Prof just starts testing on it. I'm wondering if it's an extension I need to download, or if I'm just overlooking it? Is Console only found in older versions of VSC?
Browser side JavaScript, the JavaScript that is used to edit html documents, does not run on a console app/window. It runs on a browser. Nodejs, On the other hand, runs inside of a console app. Since you are using JavaScript with Html, I will explain how you can view the results of your code that way. If you haven't already, make sure all of your files are in one folder. Open the folder. Right click on the Html file (in your case index.html), and go to open with. You should see an option that says open with Google Chrome (or whatever browser you choose to use). If you are using Google Chrome, it will have an inspect element option. Inspect element has useful development tools such as a console, a network tracker, and sources. The console will tell you the errors that you need to know.

How can I hit breakpoints (and see error line numbers) when debugging javascript on Android?

I'm trying to follow these instructions for debugging android javascript.
I am aware of How can I debug javascript on Android?, but it's not clear to me how (or if) I can hit breakpoints - either using Chrome on the Android device, or the Android browser.
I can see and 'inspect' the device OK:
But breakpoints don't get hit, nor can I see line numbers on the errors in the console:
Between these two problems, I'm not getting much useful information from the debugging experience! I have tried going to 'about:debug' in the android browser, and do see the debug options appear.
I will add that the js I am debugging works fine in the latest Chrome on the same Android device.
First off, it seems like there are a bunch of syntax errors that may be preventing mustache.js from executing at all - see if you can take care of those first.
I'd try setting a breakpoint on the next line down - line #9 - to see if anything in that IIFE is running at all.
Assuming you are using a module bundler (such as Webpack) in development (based on port 8080 in your screenshot), most likely the code you're trying to debug is executed via eval. In which case by the time you can see it in the devtools, it has already run.
You can either use the debugger statement in your code, or running in production mode - where there's a real script file being executed. In both cases, you should attach the remote debugger first, and only then navigate to your page (or refresh it).
I have now tried the same thing again, and this time didn't experience the problem. Unfortunately I can't put my finger on what the problem was exactly, as due to my dev machine dying I am running a new windows 10 installation, and potentially a different version of the Android SDK and ADB. The phone and android browser haven't changed.
Anyway, I can now set and hit breakpoints as I'd expect:
I also get better error descriptions and line numbers:
FWIW, the only problem that needed fixing was changing some 'let' declarations to 'var'.

Is there a js console emulator that provides access to the browsers 'real' javascript console?

Does anyone know of any console emulator (preferably made in javascript or jquery) that would allow me direct access to the browsers javascript console that would be found in the developers tools in chrome for example? I have been using jq-console but that only emulates a terminal, very useful so far. However it only emulates a terminal and doesn't provide access to the browsers js console. I need this so that users have a front-end web based access to the console without having to open the developer tools or something similar, so they have access to the variables and objects available in the browsers js console. I had thought of loading the data into the memory of the jq-console instance however i think this would be a cumbersome process and i don't really know how to go about doing it without the information being directly entered into the jq-console instance. any help or guidance would be greatly appreciated. thanks in advance!
direct access to the browsers javascript console
No. Not without opening the console manually, and also you cannot do much more than logging messages. Any emulator will not use the native console.
web-based front end console at CodeAcademy.com
Have you looked at their source code? You can write such one yourself, too. Or have a look at EloquentJavaScript's console script (using Mochi and Codemirror).
a browser console
…is not possible without only emulating it. However, you can use FirebugLite for that, which promises the same look-and-feel as the native Firebug. Also, Opera's Dragonfly is written in JS, and it is released as open source so you might adapt (parts of) it.

Turning on error reporting for a JavaScript segment?

I haven't worked in JS since 1999, so I'm quite rusty. I remember working in it in the past, and I was able to enable some kind of error reporting. Right now, when I have a syntax error in a script, no error is reported in the browser. Is there a directive or something to enable error reporting in a JS file?
Most scripts in the wild are so full of crass errors that browsers don't bother complain about them any more.
In IE by default the error indicator in the left hand side of the status bar can be used to display the error. Or you can turn error alerts back on from Internet Options -> Advanced -> Browsing -> Display a notification about every script error, but that will make the rest of the internet unusably annoying.
In Firefox, Tools -> Error Console will bring back the familiar JavaScript console.
It's impossible to over-recommend the Firebug plugin for Firefox. It's become the de-facto standard for writing and debugging javascript. In the console panel of firebug, you'll find lots of errors and warnings you can toggle. In addition it allows inspecting dom elements, watching network timing, ajax calls, modifying html/css/and even adding code to live pages, in addition to a plugin system which allows a host of third-party utilities built on Firebug.
Browsers generally report errors in a non obtrusive way (probably because first JavaScript code written by amateurs was very buggy, plus end users (besides devs) don't know what to do with an error anyway).
Firebug for Firefox is great, and so is Web Inspector for Webkit. They both have a console you can print to using something like
console.log(str);

Permission denied to call method Location.toString

I'm using YUI,
and sometimes I'll see this "Permission denied to call method Location.toString" error,
It's reported in connection.js,
I didn't find any clue why this error occur yet.
Very strange
If you are dealing with any Flash through a cross-domain iframe, then it is quite possible that you are seeing a bug in Adobe's Flash Player that occurs with FF2 and FF3.
The bug is in Adobe's public JIRA here: http://bugs.adobe.com/jira/browse/FP-561
There seems to be no motivation to get it fixed, unfortunately.
If the script is executed from a different domain, or you are trying to access the contents of a frame/window/iframe of a different domain, you will see this error. Safari's behavior was a little different, at least in the v1-2 era (iirc), so you will probably want to test in that as well.
If you are including scripts via a different domain, you need to make sure your actual triggers/events are tied in and executed from inline scripts, or from a script file loaded from the same domain as your html for best results.
Hi I've answered a similar question
why/where the error “Permission denied for to call method Location.toString”.
This is caused by firebug showing errors from other windows in your console. In short, these errors will probably be nothing to do with your code at all.
If you want to test this theory, you can close all other windows in firebug, clear your console and test just your site.
Are you seeing this in Firebug, by any chance?
I'm getting the same thing in Firefox, off-and-on, after adding jQuery to my site. I'm calling the jQuery js from another site (different domain completely), which I figure isn't much different than calling it from Google's servers.
I have no code using jQuery at all as of the moment. And, while Firebug reports this as an error, it doesn't do so all the time. While I have it turned on, I'm seeing no errors in IE.
While there are different libraries involved, my guess is that Firebug is generating a false-positive.
Now if you're not using Firebug when you see this ... are you using YUI hosted on your own server? What browser are you using? Etcetera.
~James

Categories