Back on front-end / React dev duties this week - built a nice responsive multi-tile carousel which works mainly using CSS (will write a separate blog about that soon).
As part of my testing, I wanted to make sure the page worked alright on mobile and tablet - especially since the carousel supports touch/swipe gestures.
My usual method is to have the mobile (Android phone) and tablet (iPad) on the same local network as my dev machine, host the site locally in IIS, and then connect the mobile browser to the dev machine's internal IP address.
However, one issue of testing pages in this way, is that mobile browsers are dogged in their determination not to re-fetch JavaScript/CSS files from the server. It seems there's no mobile equivalent to the usual shift + refresh on a desktop browser.
I tried all sorts of methods to clear the page cache (without having to clear the entire browser cache each time I wanted to test a change) - one method I found to work fine on Android and iOS is:
- Disable WiFi on the device, and then refresh the page
- When you get an error to say the page couldn't be loaded, enable WiFi
- Now refresh the page again
If this trick still works - then you should find that reloading a page after having no network connection, causes the browser to re-fetch all the resources.
Hopefully a useful tip, that might save you some time.
Comments
Post a Comment