Scenario: I recently ran into a problem where I created a Suitelet that downloaded HTML to include in the page. Next, I wanted to add JavaScript. However, when I went to debug the JavaScript in Chrome it threw an error, but the “Sources” tab in Chrome Dev Tools was blank. I saw the red X, but there was no code. Just the X! Here’s how to fix that.
My Suitelet fetches a couple of files from NetSuite’s file cabinet.
Here’s a snippet from the Suitelet that adds an inline HTML element to my screen and then fetches 2 files from the file cabinet and injects the contents into the inline element. It saves putting all the HTML in the Suitelet.
To be thorough, here’s the code that actually fetches the HTML prior to pushing it into the form. It is completely irrelevant to the problem at hand.
And here’s a snippet from the HTML that I’m injecting into my Suitelet. The only thing of relevance here is the fact that I’m keeping my JavaScript in the same file as the HTML. I wanted to make it easy on myself to find it. And when I’m making changes to HTML and JavaScript, I upload just this one file.
And here’s the big reveal…
When you put this comment into your JavaScript, Chrome will associate what’s in the script tag with this file name. Here the “Sources” tab from Chrome’s Dev Tools screen.
