CODEWITHSUNDEEP
javascriptgoogle-chrome-devtoolsfirefox-developer-toolsfirefox-developer-edition
Rami
Rami

Reputation: 520

How do I debug JavaScript written within a script tag in the HTML

I am attempting to debug external JavaScript within a tag on an iframe on a website that I do not have access to the source code. I am able to debug all of the javascript files directly but not the javascript embedded within the HTML.

I have attempted to search for the code within the sources tab and I am unable to come up with it. I have attempted to use firefox developer edition as well as chrome dev tools

issue I am trying to debug:

<iframe>
   <html>
     <head>
       <script> javascript I want to debug </script>
     <body>
     </body>
   </html>
</iframe>

I would like to place breakpoints anywhere within the code to debug it.

Upvotes: 0

Views: 7125

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1073998

In Chrome's devtools:

  1. Open the Sources tab
  2. Click the Show Navigator icon if the navigator isn't already showing
    enter image description here
  3. Find the name of the frame's HTML file in the navigator tree
    enter image description here
  4. Expand it, which will show the domain the frame is from, then expand it again to find frame's HTML file (again)
    enter image description here
  5. Click on that file to see its source
    enter image description here
  6. Within the script, click in the line number gutter to the right of the line where you want to set a breakpoint
    enter image description here

Upvotes: 5

Steffen G&#246;rg
Steffen G&#246;rg

Reputation: 372

Just a picture to visualize what Crowder wrote above. obove is the correct answer

Upvotes: 0

Related Questions