How do you turn off JavaScript in Chrome using Developer Tools for debugging purposes?

General Discussions
, ,
1

I’m trying to test how a website behaves when JavaScript is disabled. Specifically, I want to simulate this directly in Google Chrome DevTools. What’s the best way to do this? I’m looking for a reliable method that answers how to turn off JavaScript in Chrome without affecting the whole browser permanently.

2

I’ve been working with DevTools for over 6 years now, and yeah, disabling JavaScript temporarily is super handy for debugging or testing fallbacks. You can do it directly in Chrome DevTools without affecting the whole browser. Here’s how I usually do it:

  1. Open DevTools (F12 or right-click → Inspect).
  2. Click the three-dot menu (top-right) → Settings.
  3. In the sidebar, go to Preferences, scroll to Debugger.
  4. Check Disable JavaScript.
  5. Refresh the page.

This disables JavaScript only for that tab, so you don’t mess with global settings. Handy when testing how your app behaves when a javascript time function doesn’t fire properly. Just uncheck it to turn JS back on. :repeat:

3

Totally agree with @Ambikayache been using DevTools this way for accessibility audits and fallback testing for about 4 years. Just to build on that, there’s an even quicker way I use via the Command Menu:

  1. With DevTools open, press Ctrl+Shift+P (or Cmd+Shift+P on Mac).
  2. Start typing: Disable JavaScript.
  3. Select the option and hit enter.
  4. Refresh the page.

This is super fast if you’re jumping between tabs or testing how features fail gracefully. Especially useful when checking if something like a javascript time function fallback (like a countdown or delay) degrades correctly when JS is off. :no_entry_sign::stopwatch:

4

I’ve been doing front-end testing for nearly 8 years now, and if you’re thinking about longer-term JS disabling—maybe across sessions or for specific testing environments—you can go a step further:

Head over to: chrome://settings/content/javascript → Set JavaScript to Blocked by default, then whitelist sites where you want it enabled.

This is ideal when you’re stress-testing a site or simulating environments with JS restrictions—say, you’re checking how a javascript time function-based feature like lazy loading or timeout-triggered UI reacts when JavaScript is unavailable. But yeah, for one-off tests? DevTools is the fastest route.