Why isn't Firebug stepping into my script when I say "Step In"?

Go To StackoverFlow.com

1

I'm trying to generate a page where the basic data to be shown can be interpreted different ways. So I've got a data format, and a few different JS scripts to generate HTML from the data. Each script contains a function called BuildView that inputs the data, parses it, and uses document.write to output HTML. The server-side scripts insert the right data and a script-include for the appropriate view into the page. Pretty straightforward, right?

Except nothing's showing up in the page. So I decided to try and debug it with Firebug. Here's the basic structure of the page:

<!DOCTYPE blah blah blah>
<html>
<head>blah blah blah</head>
<body>
<script type="text/javascript" src="/view.js"></script>
<div id='main-page'>
  <h1 align="center">TITLE</h1>

  <p align="left"><strong>Data: </strong>
    <div id="data-view">
      <script type="text/javascript">
        BuildView('data from server');
      </script>
    </div>
  </p>
</div>
</body></html>

Nothing shows up inside the data-view div. I loaded Firebug, switched to the script tab, put a breakpoint on the call to BuildView, and reloaded the page. It stopped at the breakpoint, and I hit F11 (Step Into), hoping to find myself inside the BuildView script to look around and see what's going on. Instead... I got nothing. It just stepped over it and finished rendering the page. No errors are reported, but nothing's actually happening.

If you can't tell, I haven't used Firebug before. What am I missing? How do I get the script debugger to actually debug into this script?

2012-04-04 16:44
by Mason Wheeler
Have you tried a breakpoint inside BuildView? You should also try google chrome's debugger. Also, why use document.write? Make it less obtrusive by having BuildView set the innerHTML of "#data-view", then you can dynamically change the contents.. - Juan Mendes 2012-04-04 16:48
I suggest trying a simpler, static test page with the javascript, then when that's working have the server include it dynamically. If the static page doesn't work, share it with us in a jsfiddle - AlexMA 2012-04-04 16:57
@Juan: I can't put a breakpoint inside BuildView because it isn't showing up in Firebug. It's in an external file, and for whatever reason, that's not showing up in the script tab - Mason Wheeler 2012-04-04 17:04
@MasonWheeler Did you try my suggestions in my answer? See http://stackoverflow.com/questions/797159/dont-see-any-scripts-in-firebug-script-menu als - Juan Mendes 2012-04-04 19:12


1

  1. Make sure the script is actually loading.
  2. Put a console.log() or alert() in the function to make sure it is actually firing.
  3. The <script></script> tag in the div, move to the end of the </body> tag.
  4. Try running BuildView() from the console to see if it works after the page has loaded.

Let me know how those go.

2012-04-04 17:02
by Trevor Norris
Using alert statements helped me track down the problem. There was a syntax error in my BuildView (which for some reason, nothing ever complained about to me) and once I fixed that, I got it to work - Mason Wheeler 2012-04-04 23:17


1

Try Google chrome's debugger. Firebug has issues with displaying files that were loaded dynamically.

Another thing to try is to set firebug to show eval scripts also. From the button right next to the play/pause button

enter image description here

2012-04-04 17:21
by Juan Mendes
Ads