If you’ve spent any time building iOS apps using tools like Cordova or PhoneGap, you’ll know that one of the biggest time-sucks is in viewing new changes to existing pages. The most common example of this would be building a Single Page Application using libraries like Backbone, Angular, or Ember.
The awful way
My flow, until recently, has been to start up the simulator from Xcode, test out my pages, stop the app from Xcode, then select Reset Content and Settings...
from the iOS Simulator
menu. This process is painfully slow, especially if you work iteratively like I do.
A better way
With the most recent updates to Safari, there’s now a way to refresh your app from the Web Inspector (the functionality has been around for a little while via keyboard short-cuts, but the explicit UI is new).
You can access this once your app is running by opening up Safari, selecting the Develop
menu, iPhone Simulator
(or iPad Simulator
), then index.html
.
Once there, select the Resources
tab and you’ll see the index.html page selected, with a refresh icon to the right of the column. Click on that and you’ll get a proper page reload. Alternately, you can press cmd + shift + r
to trigger the reload.
cordova run ios
command, you may still need to re-start the emulator/re-build your app to see the changes you have made.