Get the Develop menu in Safari to debug websites
A page works everywhere except Safari — a layout collapses, a script throws, an image won't load — and you need to figure out why in the browser that's actually breaking. Safari's debugging tools are all real and capable, but they hide behind the Develop menu, which is off by default. Turn it on and you get the caches, network view, and engine toggles you need to reproduce and isolate a Safari-only bug.
Enable the Develop menu
- Open Safari → Settings (
Cmd+,) and go to Advanced. - Tick Show features for web developers on macOS 14 Sonoma and 15 Sequoia, or Show Develop menu in menu bar on macOS 13 Ventura and earlier.
- The Develop menu appears, and Inspect Element shows up in every page's right-click menu.
Rule out caching first
Half of "only in Safari" bugs are really stale files. Before you dig in, force a clean load:
- Develop → Empty Caches (
Cmd+Opt+E), then reload — confirms the bug survives a fresh fetch. - Develop → Disable Caches — keep it ticked while the Web Inspector is open so every reload pulls current files. Ideal when you're editing and re-testing rapidly.
If the problem disappears after emptying caches, it was an old asset, not a real defect — and you've saved yourself an afternoon.
Isolate the cause with the engine toggles
The Develop menu can switch parts of the page off so you can bisect the failure:
- Disable JavaScript — if the page renders correctly with JS off, the bug is in a script, not your markup or CSS.
- Disable Styles and Disable Images — narrow a rendering glitch down to CSS or a specific asset.
- Disable Cross-Origin Restrictions — temporarily rule out (or confirm) a CORS problem while testing an API call locally.
- Experimental Features — Safari gates new WebKit behavior here. If a modern CSS or JS feature misbehaves, check whether a flag needs turning on, or turn one off to reproduce a user's setup.
Toggle one at a time and reload between each — that's how you turn "it's broken" into a single cause.
Debug the same site on iPhone
If the bug is mobile-only, the Develop menu debugs Safari on a real device. Plug an iPhone or iPad into your Mac, enable Settings → Safari → Advanced → Web Inspector on the device, and it appears under Develop by name. Open a page there and you get a full Web Inspector on your Mac driving the phone — the reliable way to catch touch, viewport, and iOS-Safari quirks that never show on the desktop.
Enable it from the Terminal
# Show the Develop menu
defaults write com.apple.Safari IncludeDevelopMenu -bool true
# Undo
defaults write com.apple.Safari IncludeDevelopMenu -bool false
Quit and relaunch Safari after running it. On modern macOS the write only takes when Terminal has Full Disk Access under System Settings → Privacy & Security — otherwise the Advanced-tab checkbox is the dependable route and needs no permissions.
Mainspring exposes Safari's Develop menu as a labelled, reversible toggle — on for a debugging session, off when you're done, no Terminal or Full Disk Access. It's one of 90+ hidden macOS settings turned into one-click switches.
Try Mainspring free →Signed & notarized by Apple · 1-day free trial · $29 once
When caching keeps biting you
If Empty Caches isn't enough and Safari keeps serving old files or cookies, do a fuller reset — see how to clear Safari website data on Mac to wipe storage for a single site.