How to prevent scrolling the page on iOS Safari 15

Rik Schennink: If we show a modal on iOS we need to prevent events inside the modal from interacting with the page behind the modal. On a previous episode of “Fun with Safari” we could use preventDefault() on the touchmove event but on iOS 15 that no longer works. Here we go. The solution lies …

Achoo — iOS Safari Extension to view HTML Source

Quickly view the HTML for a given page in Safari on iOS/iPadOS 15. Customizable, beautiful, easy to use, and you can tweak the page too! When tapping the “Edit” button it activates contenteditable on the page. Costs $0.99. Achoo HTML Viewer → If you don’t want to buy this extension, or are not using Safari …

Talking to the Competition and Markets Authority about Browser Choice on Apple’s iOS

I you want to get the summary about browser choice on iOS, Stuart Langridge has got you covered: Last week I sat down with the UK Competition and Markets Authority, the regulator, to talk about browser choice on Apple devices, and whether the claims that limiting choice is good for security and privacy actually hold …

“For developers, Apple’s Safari is crap and outdated”

Perry Sun: Safari is very good web browser, delivering fast performance and solid privacy features. But at the same time, the lack of support for key web technologies and APIs has been both perplexing and annoying at the same time. The enormous popularity of iOS makes it all the more annoying that Apple continues to …

8 Tips to Make Your Website Feel Like an iOS App

Very nice video by Sam Selikoff in which he sets up a web manifest to make his site feel more app-like. Great production quality. There are some tweaks I’d suggest though: Fixate the header using position: sticky; instead of position: fixed;. No need for that extra margin on the content then. Update: See note below …

100vh in Safari on iOS

Update 2021.07.08: There are new viewport units on the way that will finally solve this issue. 100dvh is the one you’re looking for. When working with Viewport Units there’s this longstanding and extremely annoying bug in Safari on iOS where it does not play nice with the vh unit. Setting a container to 100vh for …

React Native 0.62 and Flipper

In this post Andréas Hanss gives us a tour on Flipper. Flipper is a platform for debugging iOS, Android and React Native apps. Visualize, inspect, and control your apps from a simple desktop interface. To add flipper support to your React Native project, I recommend the “Add Flipper Support” section from the Upgrade to React …

Take charge of the iOS/tvOS/watchOS simulators with Control Room

Nice tool by Paul Hudson: Control Room is a macOS app that lets you control the simulators for iOS, tvOS, and watchOS – their UI appearance, status bar configuration, and more. It wraps Apple’s own simctl command-line tool, so you’ll need Xcode installed. Some features, such as sending example push notifications or move between light …

Create beautiful menus on iOS with Codea’s iOS “Menu” pod

The folks who created Codea — an app for creative coding — recently adjusted it to make it also run on the iPhone. While Autolayout tackles most of the screen adapations, they were in need of menus. I realised six months ago as I was using my Mac, using the menus, that I need these …

Upgrading from React Native 0.53.x to 0.57.4 (and to Xcode 10 and Gradle 4 along with that), a journey

Back in November, after 6 months of working on other projects, I picked up development for the EV-Point Mobile App again. The app is built using React Native and is available on both iOS and Android. As Xcode got a new major release (from Xcode 9 to Xcode 10) since my last time working on …