debugging javascript

[Ian Petersen]

On Sun, Aug 31, 2008 at 9:48 PM, Paul King <sciguy-Ja3L+HSX0kI at public.gmane.org> wrote:
> OK, the change is made. However, isn't javascript the default in
> Firefox? I understand I should get away with just
> <script>
> //code here
> </script>
> and Javascript is understood.

That could be.  I was just grasping at straws trying to explain to
myself why the script doesn't seem to execute at all in my Firefox
(2.0.0.14) or Seamonkey (1.1.9).  With the Venkman debugger, my
breakpoints in checkMenu() are never tripped.  I have to admit,
though, I didn't expect that changing the <script> tag would fix
anything.

> getData() is definitely called, since it successfully executes
>         XMLHttpRequestObject.open("GET", dataSource);
> inside the function. This is verified by firebug. It even shows me the
> contents of the file retrieved. Problem is, it is not parsed into a list
> for the dropdown menu.

When I tried debugging a local copy from a file:// URL, the open()
method did succeed, but the send(null) failed.  In my case, since the
send() failed, the onreadystatechanged function was never invoked
because the ready state never changed.  Have you verified that
send(null) works for you?

> Now that I look at it, if I make
> this.e = e;
> (supposing e exists), then would it not be understood that therefore
> this.e.pageX already *has* e.pageX? That is, assigning e to this.e
> should assign the properties and methods of e to this.e with just one
> assignment, shouldn't it?

You might be subtly wrong here, depending on what, exactly, you mean
by "assigning e to this.e should assign the properties and methods of
e to this.e".  Saying "this.e = e" in Javascript creates a new
name-value pair in "this".  The name is "e" and the value is e.  When
I say the value is e, I mean it's exactly the same object.  There's no
copying, just an assignment of a reference to e.  Later on, if you
mutate e, then the changes will be reflected in this.e.  If you know
C++, your Javascript function MouseEvent is (relative to this.e) doing
roughly this:

class MouseEvent {

public:
  Event* e;

  MouseEvent(Event* e) : e(e) {};
};

You'll have to pardon any errors in the above code--my C++ is pretty rusty.

Anyway, you ask "would it not be understood that therefore
this.e.pageX already *has* e.pageX?"  If I've been clear so far, then
you should know the answer is "yes, sort of".  It's subtly wrong to
say this.e.pageX "has" e.pageX because this.e.pageX _is_ e.pageX.  I
think, though, that the reason for assigning e.pageX to this.x is
that, depending on conditions in the browser, this.x might be either
e.pageX or e.clientX.  Or, at least, that's how it would work if you
were referring to this.e rather than e as I recommended in my previous
post.

I think you want something like the following:

function MouseEvent(e) {
   if (e) {
      this.e=e;
   } else {
      this.e=window.event;
   }

   this.x = this.e.pageX || this.e.clientX;
   this.y = this.e.pageY || this.e.clientY;


   if (e.target) {
      this.target=e.target;
   } else {
      this.target=e.srcElement;
   }
}


> But Holzner (the author of the code) has stated in another part of the
> book (Ajax Bible), that the first "if" is whether an "e" is to be passed
> at all; the second and subsequent "if" statements test to see whether
> the event occurred in the client area of the browser. If it does, then
> it should have "pageX" and "pageY" properties. If it doesn't then it
> falls back to the window object for the assignment.
>
> Therefore, success of the first "if" does not guarantee the success of
> the subsequent "if" statements. OTOH, failure of the first "if", as you
> say, will cause everything else to fall through also.
>
>> I noticed you're generating debug output with document.write().  You
>> probably don't want to do that.  If you ever manage to execute a
>> document.write(), the argument will replace the contents of the
>> current document, rather than appending to it, so you'll lose
>> everything.  It would be better to have a <div> with an id like
>> "debug" that you append to using the DOM.  (ie.
>> document.getElementById("debug").appendChild(document.createTextNode("debug
>> comment here"));)
>>
>> Finally, you may want to start out making your code work in either
>> Firefox or IE and then add cross-browser compatibility code later.
>> Some of your confusion may come from your attempts to make the code
>> work in standards-compliant browsers and IE simultaneously.
>
> All good suggestions, thanks for your help.
>
> Paul
>
>>
>> Ian
>> --
>> The Toronto Linux Users Group.      Meetings: http://gtalug.org/
>> TLUG requests: Linux topics, No HTML, wrap text below 80 columns
>> How to UNSUBSCRIBE: http://gtalug.org/wiki/Mailing_lists
>> �
>
> --
> The Toronto Linux Users Group.      Meetings: http://gtalug.org/
> TLUG requests: Linux topics, No HTML, wrap text below 80 columns
> How to UNSUBSCRIBE: http://gtalug.org/wiki/Mailing_lists
>
--
The Toronto Linux Users Group.      Meetings: http://gtalug.org/
TLUG requests: Linux topics, No HTML, wrap text below 80 columns
How to UNSUBSCRIBE: http://gtalug.org/wiki/Mailing_lists