I am trying to debug the features of a website when users disable their JavaScript. I was wondering how do you disable JavaScript for a page from the Google Chrome DevTools?
21 Answers
Update August 2020
- Developer Tools (F12)
- Click the Gear icon
- Should open the Preference tab
- Disable Javascript option is on the far right
Original answer
- Developer Tools (F12)
- Three vertical dots in upper right
- Settings
- Under the "Preferences" tab on the left
- There will be a "Debugger" section with the option (probably on far right)
Official documentation: Disable JavaScript With Chrome DevTools
There's now a command menu built into DevTools that makes it easier to disable JavaScript. This has been around as of April 2016 or so.
- Open DevTools.
- Press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux) to open the Command Menu. Make sure that your cursor's focus is on the DevTools window, not your browser viewport.
- Type
Disable JavaScript
(or some version of that... it's a fuzzy search) and then press Enter.
Use the Enable JavaScript
command when you want to turn it back on.
This extension makes it faster (I am the author) : Quick Javascript Switcher
It is open source: https://github.com/maximelebreton/quick-javascript-switcher
On Mac OS X:
- Preferences
- Show advanced settings
- Press the "content settings" button
- Scroll to the "JavaScript" section
- Check the checkbox in front of "Do not allow any site to run JavaScript"
The Chrome Quick JavaScript Switcher extension is a lot easier though :-)
- Go to options (Windows: three vertical dots in the top right) -> Settings, or hit F1.
- In the General section you find "disable JavaScript"
The gear icon is no longer part of developer tools. Since Chome 30.0 it is not even possible to bring it back (In Google Chrome Developer Tools, the toolbar icons disappeared. What gives?)
Full and fast instructions for Chrome browsers (Opera incl.)
The first way
- If Developer Tools aren't open then press F12 key on keyboard to show the Developer Tools. In Opera browser you have to use key combination Ctrl + Shift + i on keyboard to open it.
- To show the settings just press F1 key on keyboard. The Developer Tools window must be focused when you are doing it. Or if you want to open the settings with the mouse then you have to click on
⋮
button in the top right corner of the Developer Tools, then clickSettings
in the menu.
Then you have to scroll down the settings window to bottom and then you will see the checkbox for disabling JavaScript like follows:
Just click on this checkbox and push esc key on keyboard for hide the settings. If you want to enable it then you have to do the same way again.
The second way
- If Developer Tools aren't open then open it like in the first way is described.
- Press the key combination Ctrl + Shift + P (for Windows or Linux) or Cmd (⌘) + Shift + P (for Mac) to open the Command Menu. Be sure that the focus is on the DevTools window.
- Type there "Disable JavaScript" and then press Enter or click it with the mouse. If you want to turn back the enanled JS then open the Command Menu again and type there "Enable JavaScript" and then press Enter or click it with the mouse. You could also write just only "JavaScript" or "Java" there and then choose it with the mouse.
If all this does not work
For some reason it is possible that it does not work. I this case open a new empty site in "Incognito Mode" and do all this there.
The quickest way
In Chrome Web Store or on Opera Addon site you can find and install extensions which do it per one click. Just search "Javascript Switcher"
: