I worked on a website recently and I got a feedback from designers. It's important to check that everything looks great and things are pixel perfect, right? They did cross browser testing and I could fix the majority of the points pretty easily, but then there was a list of Safari-only bugs. Here we go again, I thought. The last time there was an issue it was also Safari related and I said to a colleague that Safari is the new IE.
How come? How did we get there? Well, on January 15, 2020, Microsoft shifted from the EdgeHTML engine to the Chromium engine. Internet Explorer now basically works like Chrome and things got better from both user and developer point of view. Honestly, who cares about IE 11 anymore? Just a very tiny % of people I reckon. As Internet Explorer issues faded away, other issues started to become more apparent in Safari and that's why Safari is the new IE. I am not the only one who said that. I heard it also from other colleagues and I read it even online in the comments below this tweet.
This tweet is about the new, exciting
:has() CSS property. It's fantastic news and I'd like to use it, but is pioneering the new features really necessary while there seems to be so many discrepancies between Safari and other browsers? Shouldn't Apple focus on fixing and closing those gaps first? The website I was working on was tested on version 14.7 and 15+, on Big Sur and Monterey alike. There were some issues on both versions and I think 14.7 or 14.8 is definitely not that old. Simply put, Safari lags behind all other major browsers.
For example, we experienced a strange behaviour with
background-size property and responsiveness. Also we had issues with the newer CSS property
aspect-ratio. I am a Windows user so it's even hard to test. It turns out that debugging in Safari is not very straightforward even for Macbook owners. Let's take a look at the responsive mode:
How do I change orientation on iPad from portrait to landscape? I have to click 4 times on the iPad icon, because there's also a split view for some reason. So much for the simplicity of Apple products. When it comes to responsive behavior, I had to change also the breakpoints because the layout was not behaving as expected.
Look, I don't have Mac and I don't know how many issues there are in Safari. Perhaps the latest version is quite good. I listed only a few I stumbled upon recently, but it looks like I am not the only web developer facing those issues. I admire the aspiration to bring some cool features on a table as the first browser, but that will only create another gap until the competition catches up. I wish Apple sorted out its priorities.