TIL: How to add a user script to a remote iPhone page load for debugging

Scenario: I have an issue that is only presenting itself on an iPhone. In order to debug this issue, I want to inject a script into the page before the page loads anything else, and for every page that I load while I am debugging.

In Chrome, I would use something like Violent Monkey to add such a script. And for Safari, I found, and tried, UserScripts, but it only works for macOS and iPadOS, not iPhone iOS…

So I started poking around the Safari Inspector…

Anyhow, once you have your iPhone connected to your laptop/desktop Safari Inspector…

  1. In Inspector, go to the Sources tab
  2. At the bottom of the left column, click the + button and select Inspector Bootstrap Script:
  3. A mostly-empty page should open in the right column
  4. Copy and paste the script you want to run into that column and save (command + s)
  5. You should be asked for a name for the script file; this gets saved onto your hard-drive, and pulled into each page load from there
  6. I recommend adding some form of console messaging in your script, so you can easily confirm that it is running, if it will not otherwise be easily discernible

And that’s it… Refresh the page in your iPhone, check the laptop/desktop Inspector Console, and you should see your messaging (if you added something). The source of the console message should also state that it is from your Inspector Bootstrap Script (in my case I was debugging a WebSocket):

Happy debugging,
Atg

One Response to TIL: How to add a user script to a remote iPhone page load for debugging

  1. FYI, it seems that Inspector Bootstrap Scripts are not so easy to “disable”…

    I would have expected unchecking this to disable it, but refreshes still displayed my console messages, and the script was still being processed:

    In order to disable the script, I had to edit it, commenting out the entire thing…

    ¯\_(ツ)_/¯

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.