10 Key Updates in Safari Technology Preview 243 You Should Know

By

Apple has just dropped Safari Technology Preview 243, bringing a fresh wave of refinements and fixes that developers and power users alike will appreciate. This release is ready for download on macOS Tahoe and macOS Sequoia — and if you already have the preview installed, you can update directly via System Settings > General > Software Update. Behind the scenes, WebKit has received a notable batch of changes spanning from version 310600@main to 312007@main. Let’s break down the ten most impactful updates in this release, from accessibility enhancements to CSS improvements.

1. Enhanced Accessibility for Forms and Controls

Safari Technology Preview 243 tackles multiple accessibility issues that improve the experience for users relying on assistive technologies. A significant fix ensures that the contextmenu event now triggers correctly for elements nested inside iframes when activated via keyboard or tools like VoiceOver’s VO+Shift+M command. Color picker inputs are also more usable — they can now be activated through VoiceOver’s standard press action, eliminating a frustrating dead-end. The update also resolves a subtle invalidation problem with aria-hidden="true" when focus lands within the hidden subtree, ensuring that hidden elements remain properly hidden. Finally, base <select> elements now have full VoiceOver support, including correct popover closure upon selection and accurate accessibility path positioning even when CSS transforms are applied. These changes make web forms more inclusive and reliable for all users.

10 Key Updates in Safari Technology Preview 243 You Should Know
Source: webkit.org

2. Smoother Animations with Improved CSS Property Handling

Animation behavior sees two important corrections in this release. First, the team fixed a scenario where !important declarations were not overriding CSS animation values when a CSS transition was also running on the same property. This ensures that explicit developer intent prevails in complex animation setups. Second, a bug in identity matrix decomposition that generated invalid quaternions has been resolved. Previously, this could lead to incorrect transform animations — for example, elements rotating in unexpected ways. With the fix, transform animations are now mathematically sound, providing the visual consistency developers expect.

3. New CSS Containment Support for Style Quotes

CSS Containment Level 2 gets a boost with support for the contain: style property applying to CSS quote counters. This feature allows developers to limit the scope of style recalculations, which can improve performance on complex pages. When a container is marked with contain: style, changes to quote counters inside that container won’t propagate outside — and vice versa. This means fewer recalculations and more predictable layout behavior. For pages that heavily use generated content with the quotes property, this update can lead to smoother rendering and easier maintainability.

4. Introducing the insert Keyword for text-autospace

The CSS text-autospace property, used to control automatic spacing between different scripts or characters, now supports the insert keyword. This addition gives developers finer control over how text spacing behaves — specifically, it allows inserting a fixed amount of space (typically the width of a space character) between adjacent runs of unrelated text, such as Latin and CJK scripts. This is particularly useful for multilingual content where uniform spacing improves readability. The update aligns Safari with emerging CSS standards and offers a simple way to enhance typographic quality without manual adjustments.

5. Flexible Box Layout Improvements

Flexbox receives an important fix: the layout engine now correctly uses the used flex-basis value for definiteness evaluation, rather than the specified value. Previously, that distinction could cause flex items to be sized incorrectly, especially when a flex-basis was set to auto or a percentage in a definite container. This change ensures that flex layouts behave as specified in the Flexbox specification, leading to more consistent and predictable sizing across different browsers.

6. Box-Shadow and Table Layout Corrections

Several layout bugs have been ironed out in this release. The box-shadow property now functions correctly on display: table-row elements — previously, shadows were not rendered, leaving rows looking flat. A separate fix addresses element positioning when the containing block is an anonymous block, resolving cases where elements that should be positioned relative to a specific container would jump to the wrong location. Additionally, an issue with elements having display: table and borders has been corrected to ensure proper layout. These granular fixes together make table-based layouts more reliable.

7. Text-Indent and Percentage Calculations

A subtle but important fix targets text-indent when using calc() with percentage values. Previously, for intrinsic size contributions (e.g., when calculating the width of an element based on its content), the percentage components were not treated as zero. This could lead to incorrect results, especially in scenarios like table column widths or flexible containers. Now, percentages in calc() are correctly ignored for intrinsic sizing, aligning Safari’s behavior with the CSS specification. This improves the accuracy of text indentation in responsive layouts.

8. Clip-Path Border-Radius and Fit-Content Height

Two visual rendering issues are addressed here. First, clip-path: inset() with border-radius values now renders correctly at all element and clip-path sizes — earlier, certain combinations could produce jagged edges or misalignment. Second, out-of-flow content (like absolutely positioned elements) set to height: fit-content now gets the correct height, instead of being too short or overflowing. These fixes are especially valuable for developers using clipping paths for creative visual effects and for responsive designs relying on fit-content sizing.

9. Quirks Mode and Fieldset Flexbox Fixes

Older web content written in quirks mode gets a welcome fix: percentage size resolution in flex items now works correctly, resolving a common source of layout breakage. Additionally, the legacy -webkit-box flexbox emulation — used for compatibility with older WebKit-based layouts — now correctly sizes children inside <fieldset> elements. This ensures that forms using fieldsets with flexbox don’t break the layout, making the upgrade to modern Safari smoother for legacy sites.

10. Performance Boost for :where and :is Selectors

Last but not least, the update brings a performance improvement for pages that use the :where and :is CSS pseudo-class selectors. These selectors are popular for grouping and simplifying style rules, but they could be computationally expensive in certain cases. Safari’s engine now handles them more efficiently, reducing style recalculation time. For sites with large CSS selector lists, this can translate into faster page loads and smoother interactivity — a win for developers and users alike.

In summary, Safari Technology Preview 243 is a solid incremental update that polishes both the developer experience and end-user accessibility. Whether you’re fine-tuning animations, optimizing layouts with new CSS features, or ensuring your content works for all, this release offers meaningful improvements. Jump to any topic or grab the update from System Settings to explore it yourself.

Tags:

Related Articles

Recommended

Discover More

Could a Common Amino Acid Be a Key Player in Alzheimer's Prevention?Balancing Transparency and Privacy: The Fight Over Public Access to ALPR Surveillance DataCrafting User Research Narratives: A Three-Act Guide to Engaging StakeholdersPreparing the Clean Room: How HEPA Modules Arrive and Integrate for the Roman Space Telescope5 Key Changes: Apple Drops the Entry-Level Mac Mini, Raises Base Price to $799 with 512GB Storage