How to Disable JavaScript in Google Chrome Developer Tools

Alex Dulcianu Feb 02, 2024
  1. Disable JavaScript in Chrome Manually From the Settings Panel
  2. Disable JavaScript in Chrome via the Command Menu
How to Disable JavaScript in Google Chrome Developer Tools

Google Chrome developer tools are a great way to debug web apps, especially when it comes to JavaScript. The console allows you to view any errors that arise when code is executed on the page you are trying to access, and you can also view the source code for HTML and CSS files.

You can also view JavaScript scripts in full. There’s even an option to rearrange code more easily if the original file has been minified for optimization purposes.

However, sometimes you might want to check how your website or web app looks if the users have JavaScript disabled. If you don’t want to install third-party browser add-ons, you can disable it from the Chrome developer tools.

Disable JavaScript in Chrome Manually From the Settings Panel

First, you can go through the Settings panel and manually search for the Disable JavaScript option.

Open the Developer Tools Inside the Desired Tab

To open the developer tools, you first activate the desired tab. Keep in mind that every tab is its process in Chrome, which means that you have to open the developer tools manually in every tab.

Opening the developer tools can be achieved in two ways:

  1. By pressing the three dots on the far right of the Chrome window and selecting More tools > Developer tools from the menu.

Chrome Settings Menu

  1. By using the Ctrl+Shift+I hotkey. F12 also works if you want a shorter hotkey.

Open the Developer Tools Settings Panel

Once the developer tools are open, your tab will be split into two parts, with the developer tools on the right. There are again two methods to open the Settings panel:

  1. Click on the gear icon as seen in the image below.

Developer Tools Settings Button

  1. Use the F1 hotkey. Make sure your developer tools section is active first by clicking somewhere; otherwise, F1 will open the Google Chrome Help page.

Disable JavaScript by Clicking on the Disable JavaScript Checkbox

Once the Settings panel is open, ensure the Preferences tab is selected in the left menu. There’s a long list of options at your disposal, and the one we need is right at the bottom.

As such, make sure to scroll down until you see the Debugger submenu. After that, all you need to do is click on the Disable JavaScript checkbox.

Developer Tools Disable JavaScript Checkbox

Disable JavaScript in Chrome via the Command Menu

The second method you can employ to disable JavaScript is the Command Menu, a special tool that allows users to search for specific settings using a search bar. Granted, you have to know what to search for for the Command Menu to make sense, so this method is for more experienced users.

Hence, here is what you have to do:

  1. Open the Developer Tools inside the desired tab. This step is the same as the previous method.
  2. With the Developer Tools in focus, press Ctrl+Shift+P on Windows/Linux or Command+Shift+P on Mac. It will open the Command Menu and its associated search bar.
  3. Type in JavaScript to show the relevant settings.
  4. Click on the Disable JavaScript option in the list.

Developer Tools Command Menu

Once you do this, the page in question will no longer interpret JavaScript scripts. Remember that this will only work in the current tab, and the change won’t persist if you close the tab and open it again.