0

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.
Rami
  • 490
  • 7
  • 22

2 Answers2

4

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
T.J. Crowder
  • 1,031,962
  • 187
  • 1,923
  • 1,875
  • 1
    well I am attempting to debug an appscripts iframe and I am unable to find the code this way, Maybe it is being built dynamically or there is something the way they sandbox the iframes. – Rami Jul 28 '19 at 15:01
0

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

Steffen Görg
  • 372
  • 1
  • 5
  • I've added step-by-step pictures now. (BTW, to improve/add to an answer, it's perfectly fine to use "edit" on it, even if it's someone else's answer. :-) ) – T.J. Crowder Jul 28 '19 at 13:35
  • Oh, thank you :) didn´t realize that I have this option. I´ll remember it for the next time. – Steffen Görg Jul 28 '19 at 13:43