Why isn't the JavaScript 'debugger' command working in my code?

Store Design
1

Hello,

I’m trying to debug my JS code, but for some reason, when I add ‘debugger’ command into the code, it doesn’t work on none of the browsers I tested(Chrome and Firefox).

I’m working on boundless theme. I added an alert() just above the debugger to be sure if the code is executed. So my code is like this:

$(document).ready(function() {
  theme.init();
  alert('hey');
  debugger;

The alert windows pops up. So I’m sure the code runs but debugger doesn’t stop at that point. When I checked the JS code of the currently running website, I noticed that the alert() which I had added is there but debugger is not there. Does Shopify remove the debugger command from the JS file? Or is there another problem? Help would be appreciated. Thanks.

2

Hi, I am 100% sure that debugger; is working and it is not removed by Shopify if you add it to a JS code (I use it too often).

There’s should be something else that is missing.

1 Like
3

Hi!

I’m trying to debug my JS code, but for some reason, when I add ‘debugger’ command into the code, it doesn’t work on none of the browsers I tested(Chrome and Firefox)

I can confirm that. I also used it all the time, but this week it stops working. Perhaps it has something to do with the latest update (Shopify now serves minified JavaScript files automatically )?

Is there a way to disable that change for non live themes?

I am wondering Shopify applied that for all themes. I expected that non live themes will be excluded from this minification as the live caching behavior is different between live theme/preview theme (using shopifypreview.com/preview link sharing mechanism) and previewing a theme (using the preview_theme_id parameter).

Is there another workaround to use the debugger statement?

René

1 Like
4

I’m going through the same problem. Is there any way to disable this or some other alternative?

5

Which theme are you using? I’d like to do a test.

6

Hey, guys it happened also to me yesterday, so it is real. The minification now removes

debugger;

lines, but only from pure JS files. Inline JS in liquid files is not minified.

In my case I am just using this trick now. I am defining a public function in theme.liquid and then I call it in the .js files when I need that. This will work.
7

My workaround for the daily development is the usage of

eval('debugger')

instead of

debugger

.

1 Like