0

Enabling Web Inspector

 1 year ago
source link: https://webkit.org/web-inspector/enabling-web-inspector/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Contents

macOS

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

  1. click the Safari (or Safari Technology Preview) menu bar item
  2. select Preferences… (or press ,)
  3. go to the Advanced pane
  4. check the Show Develop menu in menu bar checkbox
enabling-web-inspector

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

Once Web Inspector is 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:

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
enabling-web-inspector

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:

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.

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK