Trying to debug Javascript on Mobile Safari but "Enable web inspector on device" grayed out in Desktop Safari when iPhone plugged into Mac

Question

Trying to debug a Mobile Safari Javascript bug. Connected the phone to my Mac via USB Lightning cable. Saw the phone show up in the Develop Menu in Desktop Safari.

Selected, 'Use phone for development' but when it switched to "Enable web inspector on device" the option is grayed out.

Found this SO question which is similar but a different issue. Tried disabling Wifi and Bluetooth while phone is connected. Didn't help.

Tried restarting the phone, and Desktop Safari. Didn't help.

Never done this before, am I doing something wrong? Anyone faced this issue?

Answer 1

Figured it out. To get the gray option to disappear, you need to enable Web Inspector on the actual device.

https://developer.apple.com/library/archive/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html

Short answer: Settings > Safari > Advanced > Enable Web Inspector

Works great with all the options.