Safari User Guide

  • Get started
  • Go to a website
  • Bookmark webpages to revisit
  • See your favorite websites
  • Use tabs for webpages
  • Import bookmarks and passwords
  • Pay with Apple Pay
  • Autofill credit card info
  • View links from friends
  • Keep a Reading List
  • Hide ads when reading
  • Translate a webpage
  • Download items from the web
  • Add passes to Wallet
  • Save part or all of a webpage
  • Print or create a PDF of a webpage
  • Interact with text in a picture
  • Change your homepage
  • Customize a start page
  • Create a profile
  • Block pop-ups
  • Make Safari your default web browser
  • Hide your email address
  • Manage cookies
  • Clear your browsing history
  • Browse privately
  • Prevent cross-site tracking
  • See who tried to track you
  • Change Safari settings
  • Keyboard and other shortcuts

mac safari debug menu

Use the developer tools in the Develop menu in Safari on Mac

If you’re a web developer, the Safari Develop menu provides tools you can use to make sure your website works well with all standards-based web browsers.

If you don’t see the Develop menu in the menu bar , choose Safari > Settings, click Advanced, then select “Show features for web developers.”

Open Safari for me

How-To Geek

How to turn on the develop menu in safari on mac.

The Develop menu lets you view page source in Safari on Mac.

Quick Links

How to enable the develop menu in safari on mac, how to view page source in safari on mac.

When you right-click on any web page in Safari on Mac, it doesn't reveal the Show Page Source and Inspect Element buttons. To see these, you need to enable the Develop menu---we'll show you how to do that.

Once you've enabled the Develop menu, right-clicking a blank space on any website will reveal the Inspect Element and Show Page Source buttons. These allow you to take a look at the source code of any website, which is useful for things like downloading images from websites and debugging code or finding out what it looks like behind any site (for website designers).

You can easily turn on the Develop menu in Safari by following a couple of steps. Open Safari on your Mac and click the "Safari" button in the menu bar.

Next, select "Preferences." Alternatively, you can use the keyboard shortcut Command+, (comma). This will also open up Safari preferences.

Go to the "Advanced" tab.

Check the box for "Show Develop Menu in Menu Bar."

Now the Develop menu will appear between Bookmarks and Window at the top.

Apart from being able to view the page source, this will allow you to access developer-focused features, such as disabling JavaScript on any website.

Once you've enabled the Develop menu, there are a couple of ways to view the page source in Safari.

Open any website in Safari and right-click the blank space on the page. Now, select "Show Page Source." You can also get to this menu by using the keyboard shortcut Option+Command+u.

If you're looking for images or other media elements from any web page, Safari makes it easy to find these. In the left-hand pane, you will see various folders such as Images, Fonts, etc. Click the "Images" folder to quickly find the photos that you need.

After selecting an image, you can view its details easily by opening up the details sidebar. The button to open this is located at the top-right of the console, just below the gear icon. You can also open this with the shortcut Option+Command+0.

Click "Resource" at the top of the details sidebar to view details, such as the size of the image and its full URL.

You can change the position of the page source console easily, too. There are two buttons at the top-left of this console, right next to the X button. Click the rectangle icon to move the console to a different side within the browser window.

If you'd like to open the page source console in a separate window, you can click the two-rectangles icon. This will detach the console and open it in a separate window.

To check out the code for any specific element on the page, you can right-click that element and select "Inspect Element." This will take you directly to the code for the element that you selected.

Whenever you're done looking at the code, click the X button to close the page source console and return to browsing on Safari. You can also check out how to view a website's page source in Google Chrome  here.

Related: How to View the HTML Source in Google Chrome

  • Accessories
  • Meet the team
  • Advertise with us

iGeeksBlog

Safari browser on Mac OS X has a hidden debug menu. It is more for developers who wish to carry advanced level operations on Safari browser. The menu consists of features like sampling, JavaScript error logging, stress and load test, and much more. Don’t worry if you didn’t understand these terms, they are designed for developers and advanced users.

Having debug menu is not as simple as clearing cache , it’s slightly tedious to get. As said earlier, the menu is more focused on developers but there are few features that can be used by a normal user. So it’s good to know how to enable the debug menu. We have covered a step-by-step process, have a look.

How to Enable Safari Debug Menu in Mac OS X

Step #1. In almost every guide, we ask you to launch some or the other app in the first step. But here the things are different; if you have Safari opened then you’ll have to quit it first.

Step #2. Now launch the Terminal from Spotlight.

Launch Terminal on Mac

Step #3. Type in the following command exactly as it is given, better copy and paste it.

defaults write com.apple.Safari IncludeInternalDebugMenu 1

Step #4. Now hit Enter to execute the command.

Get Debug Menu in Safari on Mac

Step #5. You can now launch Safari and you’ll see a new menu “ Debug ” listed.

Step #6. This is an optional step, in case you wish to disable Debug menu. Simply, copy paste the following command again in the Terminal.

defaults write com.apple.Safari IncludeInternalDebugMenu 0

Congrats! You have now got the idea of enabling and disabling Debug menu. Even though there aren’t any risk involved, we would still suggest to not to mess with the Debug features. The ultimate disaster could be weird web pages on your Safari browser, nothing worse can be expected than that.

Jignesh

Jignesh Padhiyar is the co-founder of iGeeksBlog.com, who has a keen eye for news, rumors, and all the unusual stuff around Apple products. During his tight schedule, Jignesh finds some moments of respite to share side-splitting content on social media.

View all posts

🗣️ Our site is supported by our readers like you. When you purchase through our links, we earn a small commission. Read Disclaimer .

  • Enable Debug Menu

LEAVE A REPLY Cancel reply

Save my name, email, and website in this browser for the next time I comment.

Related Articles

Why is apple watch stuck on apple logo and how to fix it, how to block a number on iphone (ios 17 updated), how to factory reset mac (the ultimate guide), how to change apple watch face in watchos 10.

Enabling the Debug menu in Safari 14 on Big Sur and Catalina

Written by Dave Mark

Back in March, Dan Moren wrote an excellent post on macOS Safari, and switching tab behavior , so new tabs open at the end, instead of immediately after the current tab.

This involves enabling the Debug menu (not to be confused with the Develop menu, which is exposed in Safari Settings > Advanced).

In a nutshell, to enable the Debug menu, hop into Terminal and type:

defaults write com.apple.Safari IncludeInternalDebugMenu YES

Relaunch Safari, and take a look at the last two submenus in the newly appearing Debug menu: Tab Ordering and Tab Features. Good to know.

Interested in some under the hood details of the Defaults mechanism, and moving Prefs files? Check out this writeup from Jeff Johnson .

Six Colors

by Jason Snell & Dan Moren

This Week's Sponsor

By dan moren.

September 21, 2020 8:48 AM PT

Enabling the Debug menu in Safari 14 on Big Sur and Catalina

Note : This story has not been updated since 2020.

Update 9/22: After further testing, it seems the standard defaults write command does continue to work in macOS Catalina with Safari 14, though the Big Sur beta may require the method mentioned below.

Update 2 9/22: Oh, what a tangled web we weave… It turns out it’s a little more complicated than the post below makes it sound. Developer Jeff Johnson has written a great blog post explaining exactly what’s going on here: it involves a combination of macOS sandboxing and System Integrity Protection. In certain cases you can use defaults write in Big Sur—if you’ve granted Terminal access to your disk in the Security & Privacy pane in System Preferences.

With new Apple software updates come new questions, and reader Martin has one related to an old tip of mine:

Thanks for the great tip on fixing tab behavior . However, the directions on how to get the debug menu no longer seem to work with Safari 14. Any idea on how to enable nowadays?

Great question! The tip in question deals with making new Safari tabs open at the end of the window rather than next to the active tab, a behavior that many users prefer. Thus far you’ve been able to change that setting in Safari’s hidden Debug menu, but Martin’s right that Safari 14 adds some additional complications.

It seems that the trusty defaults write command does no longer allows users to enable Safari’s Debug menu. So I enlisted my pal, dicemaster, and developer extraordinaire James Thomson to help me figure out this puzzle.

First, just to note: it seems that, having already had the Debug menu enabled on my iMac running Catalina, it’s persisted with the update to Safari 14. But if you want to newly enable it in Safari 14 on Catalina (or on the Big Sur beta), you’ll need to use the following process.

So, with the Safari 14 update, the preferences file that you need to edit to enable the Debug menu no longer resides in the Preferences directory of your library 1 , and the defaults command thus can’t edit it. However, it’s still possible to make the Debug menu show up—it’s just a little more complicated.

You’ll want to navigate to ~/Library/Containers/com.apple.Safari/Data/Library/Preferences/ —note that if you’re trying this on the Big Sur beta and you’re using the Finder and not Terminal, the path is ~/Library/Containers/Safari/Data/Library/Preferences/ . 2

No matter how you get to that folder, open the com.apple.Safari.plist file in it using your favorite text editor—I’d, naturally, recommend BBEdit, but TextEdit should work too.

Scroll down or search the file to find the phrase IncludeDevelopMenu —this isn’t the key that you want to edit, but it’s handy to keep things organized. Above that entry (which should start with <key> ), paste the following two lines:

<key>IncludeInternalDebugMenu</key> <true/>

Save the file, reboot Safari, and voilà, the Debug menu should appear, allowing you to once again set your tab behavior to that which is undeniably correct. Happy tabbing!

  • That clearly made too much sense.  ↩
  • It’s the same directory, but in Big Sur it displays differently in the command-line and the GUI for…reasons?)  ↩

[ Dan Moren is the East Coast Bureau Chief of Six Colors. You can find him on Mastodon at @[email protected] or reach him by email at [email protected]. His latest novel, the supernatural detective story All Souls Lost, is out now . ]

If you appreciate articles like this one, support us by becoming a Six Colors subscriber . Subscribers get access to an exclusive podcast, members-only stories, and a special community.

Search Six Colors

OS X Daily

Tips & Tricks

Troubleshooting, enable safari hidden debug menu in mac os x.

Debug menu in Safari

Safari has a hidden “Debug” menu that offers some additional features for debugging the browser, including stress and load tests, sampling, javascript error logging, the ability to intentionally crash a page, and more. Intended for Safari developers, the Debug menu is different from the Developer menu , which is geared more at web developers, although there are a few options in the Debug menu that general web developers would find useful as well, notably advanced cache choices and CSS animation controls. If this sounds confusing, just enable both of them and poke around and you’ll quickly see the differences.

Here’s how to enable the hidden Debug menu in Safari for Mac OS X with the assistance of a defaults command string in the terminal.

How to Enable Safari’s Hidden Debug Menu on Mac

This works in all versions of Safari in nearly all versions of macOS / OS X, from all modern releases to most prior versions as well:

  • Quit Safari on Mac
  • Launch the Terminal from /Applications/Utilities/ and enter the following defaults write command exactly:

defaults write com.apple.Safari IncludeInternalDebugMenu 1

  • Hit return, then relaunch Safari

The “Debug” menu will be visible to the far right in Safari’s menubar choices.

Safari debug menu in MacOS X

If you want to disable the menu, go back to the Terminal and type:

defaults write com.apple.Safari IncludeInternalDebugMenu 0

Again you will need to relaunch Safari for changes to take effect.

We’ve poked around in the Debug menu before to stop auto-refreshing in Safari by disabling multi-process windows, that is no longer necessary with the latest version of Safari, however.

Safari's hidden Debug menu

Generally aimed at developers, Safari debugging, and web workers, the Debug menu has many features that can be useful to more advanced Safari users as well. If you’re a tinkerer and like to mess around with settings, you’ll find plenty to keep you busy and explore.

Enjoy this tip? Subscribe to our newsletter!

Get more of our great Apple tips, tricks, and important news delivered to your inbox with the OSXDaily newsletter. 

You have successfully joined our subscriber list.

.

Related articles:

  • Enable the Safari Debug Console on iPhone & iPad
  • Enable Mac App Store Hidden Debug Menu
  • How to Enable a Hidden Debug Menu in Photo Booth for Mac OS X
  • How to Stop Autoplay Video in Safari for Mac

» Comments RSS Feed

[…] can enable similar debug menus in a variety of default apps, including Safari (by far the most useful), Reminders, Calendar, Contacts, Apple Remote Desktop, the Mac App Store, […]

I just tried this four times and it didn’t work. I have never used Terminal before. After I type in the command, do I close Terminal? I tried closing it, and keeping it open, and neither time did the Debug menu appear. I have Safari 5. Thanks.

so what do I need to disable so that safari won’t refresh every time I go back on my browsing history. This is so damn annoying and a waste of time. Where is your efficiency and productivity apple???

[…] and resolve issues with webpages while on the go. While not as in inclusive as the desktop Safari debug and developer tools, it’s still useful and is easy to enable or disable on the iPhone and […]

This is so crappy annoying. Good there is a way to change it.

[…] the iCal menu is probably not quite as useful as the Safari debug menu but it’s still interesting to take a peak at. Great little trick from MacGasm, who used it to […]

Sorry to disagree with you, a true expert on OS X. I have the latest version of Lion and the latest version of Safari, and if I do not use your trick of disabling the multi-process windows, my Mac is slower than a snail on crutches. Am I the only one?

[…] Via | OSXDaily […]

Leave a Reply

Name (required)

Mail (will not be published) (required)

mac safari debug menu

Subscribe to OSXDaily

Subscribe to RSS

  • - How to Find a Misplaced Apple Watch with iPhone’s Ping My Watch
  • - How to Install VMWare Tools in Windows on VMWare Fusion for Mac
  • - How to Change the Voice of ChatGPT on iPhone, Mac, iPad
  • - How to Confirm Before Closing Windows with Multiple Tabs in Chrome, Edge, Brave
  • - How to Search the Web (Minus AI Junk & Clutter) with Google on Safari for Mac
  • - PSA: Updating to MacOS Sonoma or iOS 17 May Enable iCloud Keychain
  • - iOS 17.5.1 & iPadOS 17.5.1 Update Released to Fix Reappearing Deleted Photos Bug
  • - MacOS Ventura 13.6.7 & macOS Monterey 12.7.5 Updates Available
  • - iOS 16.7.8 & iPadOS 16.7.8 Updates for Older iPhones & iPads Available
  • - iOS 17.5 & iPadOS 17.5 Updates Released with Bug Fixes

iPhone / iPad

  • - How to Use ChatGPT for Mac Right Now, Bypassing the Waitlist
  • - How to Factory Reset Mac (MacOS Sonoma & Ventura)
  • - How to Fix the Apple Watch Squiggly Line Screen
  • - What Does the Number Badge Mean on Microsoft Edge Icon?
  • - How to Hide iPhone Keyboard When It’s Covering Buttons & Won’t Go Away
  • - What’s a PXM File & How Do You Open It?

Shop on Amazon to help support this site

About OSXDaily | Contact Us | Privacy Policy | Sitemap

This website is unrelated to Apple Inc

All trademarks and copyrights on this website are property of their respective owners.

© 2024 OS X Daily. All Rights Reserved. Reproduction without explicit permission is prohibited.

  • The Lowdown on Meta AI
  • What's the Difference? PS5 Slim vs. PS5

Add More Features by Turning on Safari's Develop Menu

Some of Safari's best features are hidden away

Tom Nelson is an engineer, programmer, network manager, and computer network and systems designer who has written for Other World Computing,and others. Tom is also president of Coyote Moon, Inc., a Macintosh and Windows consulting firm.

In This Article

Jump to a Section

Display the Develop Menu in Safari

Using the develop menu, additional develop menu items, what to know.

  • Select Safari > Preferences > Advanced > Show Develop menu in menu bar .
  • To use Develop, go to the Safari menu and select Develop , between Bookmarks and Window.
  • Most useful Develop options: Open Page With, User Agent, and Empty Caches.

This article explains how to display and use the Develop menu in your Safari (versions 8 through 12) web browser.

Before you can use the Develop menu, you must first make the hidden menu visible. This is an easy task, much easier than revealing the Debug menu that—prior to Safari 4—contained all the commands that are now in the Develop menu. However, don't think that the older Debug menu is no longer relevant; it still exists and contains many useful tools.

Launch Safari from the Dock or the Mac Application folder.

Open Safari's preferences by clicking Safari in the menu bar and selecting Preferences in the drop-down menu.

Click the Advanced tab in the preferences screen.

Select Show Develop menu in menu bar .

Should you ever want to disable the Developer menu, remove the check mark in the Safari > Preferences > Advanced screen.

The Develop menu appears on the Safari menu bar between the Bookmarks and Window menu items. The Develop menu is particularly handy for web developers, but casual users may also find it useful.

Some of the Develop menu items that you're likely to find the most useful include:

  • Open Page With : Lets you open the current web page in any browser you have installed on your Mac. If you ever visit a website that doesn't work correctly with Safari, use this command to quickly pop over to the same web page in another browser.
  • User Agent : The user agent is a string of text the browser sends to the webserver hosting the web page. If you've ever visited a web page that proclaimed that Safari wasn't supported, this is how the site knew what browser you were using. In most cases, not supported is nonsense, and using this menu item, you can change the user agent to mimic one from a different browser. You may be amazed at how many times a web page that doesn't work suddenly does, just by changing the user agent.
  • Empty Caches : Safari keeps a cache of recently accessed sites. The data stored away in this cache includes all the elements of a page, which can be used to quickly render a website when you return to the page. Sometimes the cache can be old or corrupt, causing a web page to display incorrectly. Emptying the cache can fix these issues and can even help speed up Safari .

Most of the remaining menu items are probably more useful to web developers, but if you're interested in how websites are constructed, then the following items may be of interest:

  • Show Web Inspector : This opens the Web Inspector at the bottom of the current page. With the Web Inspector, you can examine the elements that went into creating the page.
  • Show Page Source : This displays the HTML code of the current page.
  • Show Page Resources : This opens the Resource Inspector sidebar in the Web Inspector. It provides an easy way to see which images, scripts, style sheets, and other elements are used on the current page.
  • Start Timeline Recording : If you want to see how a web page loads and runs, try the Start Timeline Recording option. This creates a graph showing network activity and how each site element is loaded and used. It makes for an interesting display, but don't forget to turn off the feature by selecting Stop Timeline Recording . Otherwise, you are using your Mac's resources on nonproductive tasks—unless you're a web developer.
  • Enter Responsive Design Mode : Another tool for web developers is the built-in simulator that allows you to preview how your web page will look at different screen resolutions or with different devices, such as the iPad or iPhone. Simply load the page you are interested in and select Enter Responsive Design Mode to preview the page. You can try the page rendering using various devices or select a screen resolution to use. When you're done, return to the Develop menu and select Exit Responsive Design Mode .
  • Experimental Features : If you're feeling brave, you can try a few of the features that may find their way into future versions of the Safari browser.

With the Develop menu visible, take some time to try out the various menu items. You'll probably end up with a few favorites that you'll use often.

Get the Latest Tech News Delivered Every Day

  • How to Activate and Use Responsive Design Mode in Safari
  • How to Reset Safari to Default Settings
  • How to Activate the iPhone Debug Console or Web Inspector
  • How to Enable Safari's Debug Menu to Gain Added Capabilities
  • How to Use Web Browser Developer Tools
  • How to View HTML Source in Safari
  • How to View Internet Explorer Sites on a Mac
  • How to Clear Internet Cache in Every Major Browser
  • Speed Up Safari With These Tuneup Tips
  • What Is a Home Page?
  • How to Manage Cookies in the Safari Browser
  • 8 Best Free HTML Editors for Windows for 2024
  • How to Inspect an Element on a Mac
  • What Is Safari?
  • How to Change Settings in iOS Dolphin
  • How to Manage the Top Sites Feature in Safari

The Tech Edvocate

  • Advertisement
  • Home Page Five (No Sidebar)
  • Home Page Four
  • Home Page Three
  • Home Page Two
  • Icons [No Sidebar]
  • Left Sidbear Page
  • Lynch Educational Consulting
  • My Speaking Page
  • Newsletter Sign Up Confirmation
  • Newsletter Unsubscription
  • Page Example
  • Privacy Policy
  • Protected Content
  • Request a Product Review
  • Shortcodes Examples
  • Terms and Conditions
  • The Edvocate
  • The Tech Edvocate Product Guide
  • Write For Us
  • Dr. Lynch’s Personal Website
  • The Edvocate Podcast
  • Assistive Technology
  • Child Development Tech
  • Early Childhood & K-12 EdTech
  • EdTech Futures
  • EdTech News
  • EdTech Policy & Reform
  • EdTech Startups & Businesses
  • Higher Education EdTech
  • Online Learning & eLearning
  • Parent & Family Tech
  • Personalized Learning
  • Product Reviews
  • Tech Edvocate Awards
  • School Ratings

Types of Engineering: Everything You Need to Know

Things to consider before buying a desktop pc, sherpa guide kami rita sets record for most times scaling mount everest, top un court orders israel to halt military operation in rafah, here’s why you won’t see much of the royal family for the next 6 weeks, young missionary couple from u.s. among 3 killed by gunmen in haiti’s capital, family says, egypt agrees to send u.n. aid trucks through israeli crossing to gaza — but impact is unclear, israeli airstrike kills dozens of palestinians in rafah, medics say, uvalde families sue meta, call of duty maker on second anniversary of school massacre, nicki minaj detained at amsterdam airport for allegedly carrying drugs, how to enable safari’s debug menu to gain added capabilities.

mac safari debug menu

Safari is one of the most popular web browsers in the world, and it comes with a lot of features that many users may not be aware of. One of these features is the debug menu, which gives users access to additional capabilities that are not available in the standard version of Safari.

Enabling Safari’s debug menu is a relatively simple process, and it can be done in just a few steps. Here’s how to do it:

Step 1: Open Safari

Launch Safari on your Mac by clicking on the Safari icon in the Dock or by searching for it using Spotlight.

Step 2: Access Terminal

Open Terminal on your Mac by going to the Applications folder, then to the Utilities folder, and finally clicking on Terminal.

Step 3: Enter the Command

In the Terminal window, type the following command:

defaults write com.apple.Safari IncludeInternalDebugMenu 1

Then press Enter.

Step 4: Relaunch Safari

Quit Safari and then relaunch it. You should now see the debug menu in the menu bar.

Step 5: Explore the Debug Menu

Click on the debug menu to explore the additional capabilities that it provides. Some of the features that you can access from the debug menu include:

1. Inspecting elements on a web page

2. Disabling cache

3. Debugging JavaScript

4. Modifying user agent strings

5. Enabling experimental features

It’s important to note that some of the features in the debug menu are intended for developers and may not be useful for the average user. However, there are still plenty of features that can be useful for anyone who wants to get more out of Safari.

In conclusion, enabling Safari’s debug menu is a simple process that can give users access to additional capabilities that are not available in the standard version of Safari. By following the steps outlined above, you can start exploring the debug menu and taking advantage of its features.

How Forgiveness Separates The Good Education Leaders ...

Best classic arcade games of 1980.

' src=

Matthew Lynch

Related articles more from author.

mac safari debug menu

How to Watch Movies on iPhone

mac safari debug menu

How to Set Up Your Epic Games Account and Play Cross-Platform

mac safari debug menu

What is JavaScript (JS)?

mac safari debug menu

How to View Saved Wi-Fi Passwords on Android

mac safari debug menu

Bash printf Function: Examples for Linux

mac safari debug menu

What Is a Selfie?

  • Apple Watch
  • Accessories
  • Digital Magazine – Subscribe
  • Digital Magazine – Info
  • Smart Answers
  • 11th-gen iPad
  • New AirPods
  • Best Mac antivirus
  • Best Mac VPN

When you purchase through links in our articles, we may earn a small commission. This doesn't affect our editorial independence .

Add a Debug menu to Safari 4

With the advent of Safari 4, it seemed that the Debug menu was gone, replaced by the new Develop menu. As it turns out, that’s not the case at all; the Debug menu is still available in Safari 4, but it’s now activated with a new command.

While the debug menu contains a number of commands that are of interest mainly to developers, there are a couple of options that “regular” users may also find interesting. For instance, a Force Repaint command (Shift-Command-R) will redraw the current screen without reloading the site (as would happen with Command-R). This can be very useful if you’re one of those affected by the color fades when scrolling issue that many users have reported.

You can also use the Debug menu to see a full list of keyboard and mouse shortcuts, and to view detailed information on caches; you can even clear various caches from this screen.

If these features sound useful to you, here’s how to enable the Debug menu in Safari 4, thanks to Mac OS X Hints readers chleuasme and Frederico. Quit Safari if it’s running and open Terminal, in Applications -> Utilities. Copy and paste the following command, then press Return:

When you relaunch Safari, you’ll find a new Debug menu, located to the right of the Help menu. There’s no help available for everything in this menu, though most options are relatively self-explanatory. If you ever tire of the Debug menu, quit Safari, then repeat the above command, but replace the 1 with a 0 . Press Return when done, and Safari will no longer have a Debug menu.

Safari Web Inspector Guide

  • Table of Contents
  • Jump To…
  • Download Sample Code

Retired Document

Important: This document no longer represents the most current version of Safari developer tools. Links to downloads and other resources may no longer be valid. For new documentation on Safari Web Inspector, please visit Safari Developer Help .

The Develop Menu

The Develop menu contains a set of tools to assist you in prototyping, debugging, and optimizing your website:

Open Page With—Open the current webpage in another web browser. Any app that registers as a viewer for HTTP URLs appear here.

User Agent—Browsers send a user agent string that identifies the browser type and version to the server. The same string is sent in response to a JavaScript request for the user agent string. Use this menu item to modify the user agent string Safari sends, to simulate visiting your site using a different browser or device type. See Changing the User Agent String .

Show Web Inspector—Open Web Inspector.

Show Error Console—Open the console in Web Inspector. See The Console .

Show Page Source—Open the Source Code in Web Inspector to see the HTML of the current page. See Source versus DOM .

Show Page Resources—Open the Resources navigation sidebar in Web Inspector to view all images, scripts, and style sheets attached to the current page. See Resources and the DOM .

Show Snippet Editor—Open the Snippet Editor window to interactively prototype HTML, CSS, or JavaScript snippets. See Snippet Editor .

Show Extension Builder—Open Extension Builder to install, modify, create, or uninstall a Safari extension. See Safari Extensions Development Guide .

Start Profiling JavaScript—Turn on the JavaScript profiler to see how many times each function is called, how long it takes, and so on. See JavaScript and Events Recording .

Start Timeline Recording—Record detailed information about the status of incoming HTTP requests, JavaScript events, and layout rendering. See Recording Timelines .

Empty Caches—Delete all caches stored by the browser. Select this if you’re suspicious that your webpage is using stale cached content.

Disable Caches—Turn off caching to see how a website loads the first time. Select this if you’re suspicious that your webpage is using stale cached content.

Disable Images—Turn off image display and view websites as text only.

Disable Styles—Turn off CSS style properties to view the page purely as HTML and JavaScript.

Disable JavaScript—View websites with the JavaScript interpreter disabled.

Disable Site-specific Hacks—Use this to disable the modifications to Safari and test your site for correct operation (if Apple engineers have modified Safari specifically to work around a problem with your website).

Disable Local File Restrictions—Disable security checks that may prohibit local development.

Enable WebGL—Turn on the ability to view OpenGL content in Safari.

Allow JavaScript in the Address Bar—Allow JavaScript to be executed on the page by typing javascript: followed by a valid JavaScript expression in the Address bar.

Changing the User Agent String

Every browser has a user agent string that identifies its type and version number. The browser sends this string to the server. Your website can also use JavaScript to read the user agent string to determine which version of a browser a user is running. You can choose what Safari reports as its user agent from the User Agent submenu.

This can be useful to quickly test your code to see if it is reacting to various user agents as you expect, without having to actually load the page in multiple versions of multiple browsers. The User Agent submenu is shown in Figure A-1 .

mac safari debug menu

You can choose the common versions of most popular browsers from the submenu. Note that the list includes the versions of Safari found on iPhone, iPad, and iPod touch.

The Other... menu item opens a sheet showing the default user agent string, which you can edit to any string you like.

Snippet Editor

Snippet Editor provides an interactive sandbox for previewing HTML and CSS, as shown in Figure A-2 .

mac safari debug menu

Copyright © 2018 Apple Inc. All Rights Reserved. Terms of Use | Privacy Policy | Updated: 2018-02-07

COMMENTS

  1. Not seeing the Debug menu in Safari for macOS Big Sur (Safari 14+)? Fix

    Look for and click the Finder logo. Click "Applications" on the left toolbar. Open the folder marked "Utilities". Launch "Terminal" by clicking on it twice. 4. Type in the command: At this stage, you are close to fixing the "not seeing the Debug menu in Safari for macOS Big Sur " issue. You will get even a step closer by typing ...

  2. Use the developer tools in the Develop menu in Safari on Mac

    If you're a web developer, the Safari Develop menu provides tools you can use to make sure your website works well with all standards-based web browsers. If you don't see the Develop menu in the menu bar, choose Safari > Settings, click Advanced, then select "Show features for web developers.". See also Change Advanced settings in ...

  3. How to Enable Safari's Debug Menu to Gain Added Capabilities

    Safari Debug Menu in OS X El Capitan and Earlier . With the release of Safari 4 in the summer of 2008, many useful menu items in the Debug menu were moved to the new Develop menu. However, the hidden Debug menu remained and even picked up a command or two as Safari development continued.

  4. How to Turn on the Develop Menu in Safari on Mac

    Open Safari on your Mac and click the "Safari" button in the menu bar. Next, select "Preferences." Alternatively, you can use the keyboard shortcut Command+, (comma). This will also open up Safari preferences. Go to the "Advanced" tab. Check the box for "Show Develop Menu in Menu Bar." Now the Develop menu will appear between Bookmarks and ...

  5. Develop menu

    Overview. The Develop menu is home to the tools available to design and develop web content in Safari, as well as web content used by other applications on your Mac and other devices. The Develop menu also provides quick access to Changing Developer settings in Safari on macOS and Changing Feature Flag settings in Safari on macOS.. Note. If you haven't already enabled features for web ...

  6. How To Enable Safari's Hidden Debug Menu & Safari's Develop Menu

    Mac OS Big Sur & MacOS Monterey CHANGED How to Enable the Hidden Safari Debug Menu - I think Apple's TCC (Transparency Control & Consent) Security is the iss...

  7. How to Enable Debug Menu in Safari in Mac OS X El Capitan

    Type in the following command exactly as it is given, better copy and paste it. defaults write com.apple.Safari IncludeInternalDebugMenu 1. Step #4. Now hit Enter to execute the command. Step #5. You can now launch Safari and you'll see a new menu " Debug " listed. Step #6. This is an optional step, in case you wish to disable Debug menu.

  8. Tools

    Web development tools. Apple has brought its expertise in development tools to the web. Safari includes Web Inspector, a powerful tool that makes it easy to modify, debug, and optimize websites for peak performance and compatibility on both platforms. And with Responsive Design Mode, you can preview your web pages in various screen sizes ...

  9. Enabling the Debug menu in Safari 14 on Big Sur and Catalina

    In a nutshell, to enable the Debug menu, hop into Terminal and type: defaults write com.apple.Safari IncludeInternalDebugMenu YES. Relaunch Safari, and take a look at the last two submenus in the newly appearing Debug menu: Tab Ordering and Tab Features. Good to know.

  10. How to Enable Safari Debug menu in macOS Monterey

    STEP 3: Enable the Safari Debug menu. Open Launchpad, go to others, and launch Terminal. Then execute the below command in the Terminal. Now open Activity Monitor from the Launchpad, select Safari, and hit the cross icon. Then click on Quit in the confirmation dialog box that appears.

  11. Enabling the Debug menu in Safari 14 on Big Sur and Catalina

    Above that entry (which should start with <key> ), paste the following two lines: <key>IncludeInternalDebugMenu</key>. <true/>. Save the file, reboot Safari, and voilà, the Debug menu should appear, allowing you to once again set your tab behavior to that which is undeniably correct. Happy tabbing!

  12. Enable Safari Hidden Debug Menu in Mac OS X

    defaults write com.apple.Safari IncludeInternalDebugMenu 1. Hit return, then relaunch Safari. The "Debug" menu will be visible to the far right in Safari's menubar choices. If you want to disable the menu, go back to the Terminal and type: defaults write com.apple.Safari IncludeInternalDebugMenu 0. Again you will need to relaunch Safari ...

  13. How to Activate the iPhone Debug Console or Web Inspector

    Activate Web Inspector on iOS: Go to Settings > Safari > Advanced and move the Web Inspector toggle switch to the On position. Use Web Inspector on macOS: Connect your iOS device to a Mac and choose the URL to inspect from the Develop menu. If you run into a bug or another issue with a website on Safari mobile, use the Web Inspector tool to ...

  14. How to Enable the Debug Menu In a Bunch of Apple's Mac Apps

    To enable these debug menus, just open up Terminal (Applications > Utilities), type in one of the commands listed below, then press Enter. Not every Apple app has these, but we've tested each of ...

  15. Add More Features by Turning on Safari's Develop Menu

    Display the Develop Menu in Safari . Before you can use the Develop menu, you must first make the hidden menu visible. This is an easy task, much easier than revealing the Debug menu that—prior to Safari 4—contained all the commands that are now in the Develop menu. However, don't think that the older Debug menu is no longer relevant; it still exists and contains many useful tools.

  16. How to Enable Safari's Debug Menu to Gain Added Capabilities

    Step 4: Relaunch Safari. Quit Safari and then relaunch it. You should now see the debug menu in the menu bar. Step 5: Explore the Debug Menu. Click on the debug menu to explore the additional capabilities that it provides. Some of the features that you can access from the debug menu include: 1. Inspecting elements on a web page. 2. Disabling ...

  17. Debug Websites Using the Safari Developer Tools

    To debug your website using the Responsive Design mode on Safari, follow the steps mentioned below: Enable the Developer Menu. To do that, launch the Safari Browser on your Mac computer. Go to Preferences > Advanced and check the Show Develop menu in the menu bar. Navigate to the website you want to debug.

  18. debugging

    not sure if in Windows is the same, but on the mac version you have a Developer menu ("Develop"), at the mac this menu is shown via the preferences > advanced > show develop menu, and there you can view items such as "Start debugging javascript". EDIT: just found this: Enabling debug menu in Safari for Windows. edited May 23, 2017 at 10:31.

  19. Add a Debug menu to Safari 4

    If these features sound useful to you, here's how to enable the Debug menu in Safari 4, thanks to Mac OS X Hints readers chleuasme and Frederico. Quit Safari if it's running and open Terminal ...

  20. The Develop Menu

    User Agent—Browsers send a user agent string that identifies the browser type and version to the server. The same string is sent in response to a JavaScript request for the user agent string. Use this menu item to modify the user agent string Safari sends, to simulate visiting your site using a different browser or device type.

  21. Are there keyboard shortcuts for the Safari debugger?

    30. The Scripts Debugger was updated to support some popular keyboard shortcuts: Continue — F8 or Command - / on a Mac or Control - / on other platforms. Step Over — F10 or Command - ' on a Mac or Control - ' on other platforms. Step Into — F11 or Command -; on a Mac or Control -; on other platforms. Step Out — Shift - F11 or Shift ...

  22. Complete Guide to Safari Developer Tools

    Opеn the Safari browser on your Mac. Click on Safari, and sеlеct Preferences. Click on thе Advancеd tab. Check the Show Develop menu in menu bar option. Once selected, Safari's developer tools can be accessed from the Develop menu located in the menu bar.

  23. Safari: Show Debug menu in v16.4 : r/MacOS

    Safari: Show Debug menu in v16.4 Help I searched far and wide but didn't find any solution to this. The old fix was to run this command: defaults write com.apple.Safari IncludeInternalDebugMenu -bool YES. but it seems this is not up to date anymore. ... Mac OS X has been around more than twice as long as Mac OS Classic.