Web Inspector ReferenceEnabling Web Inspector

macOS

To enable Web Inspector in Safari (or Safari Technology Preview):

1. click the Safari (or Safari Technology Preview) menu bar item
2. select Settings… (or press ⌘ ,)
3. go to the Advanced pane
4. check the Show features for web developers checkbox

Show Web Inspector (or press ⌥ ⌘ I) from the Develop menu or by right-clicking on any page in Safari (or Safari Technology Preview) and selecting Inspect Element.

Once features for web developers are enabled, the name of the current the macOS machine will appear as a submenu in the Develop menu of Safari (or Safari Technology Preview), allowing for inspection of

• web apps added to the Dock on Mac
• web content that is configured to be inspectable in developer provisioned apps:
  • WKWebView
  • JSContext

iOS Device

To enable remote inspection on an iOS device:

1. open the Settings app
2. go to Safari
3. scroll down to Advanced
4. enable the Web Inspector toggle

Once Web Inspector is enabled, connecting the iOS device to any macOS machine, either via a physical cable or after configuring wireless debugging in Xcode, the name of the iOS device will appear as a submenu in the Develop menu of Safari (and Safari Technology Preview) on the connected macOS machine, allowing for remote inspection of:

• any page in Safari
• websites added to the home screen
• web content that is configured to be inspectable in developer provisioned apps
  • SFSafariViewController
  • WKWebView
  • JSContext

NOTE: in order to use remote inspection, Web Inspector must be enabled on the connected macOS machine.

iOS Simulator

Remote inspection is always enabled for iOS simulators, meaning they will also appear in the Develop menu of Safari (and Safari Technology Preview) just like connected iOS devices.

Automatic Inspection

At the bottom of any macOS machine or iOS device submenu in the Develop menu of Safari (or Safari Technology Preview), there are two toggles:

• Automatically Show Web Inspector for JSContexts controls whether Web Inspector is automatically opened whenever a JSContext is created by any inspectable application on the corresponding macOS machine or iOS device.
• Automatically Pause Connecting to JSContexts controls whether Web Inspector automatically pauses JavaScript execution when inspecting any JSContext on the corresponding macOS machine or iOS device.