Welcome to the latest release of Safari Technology Preview 243. This version brings a host of refinements and new capabilities, focusing on accessibility, animation accuracy, and CSS enhancements. Whether you're a web developer or an avid user, these changes are designed to improve your browsing experience and streamline site compatibility. Here are the top 10 highlights you need to know about.
1. Enhanced Context Menu Support in iframes
A significant accessibility fix addresses an issue where the contextmenu event was not triggered for elements nested inside iframes when using keyboard or assistive technology actions, such as VoiceOver’s VO+Shift+M. Previously, this left some interactive elements inaccessible to users relying on screen readers. Now, the event fires correctly, enabling context menu interactions within iframes for all users. This improvement ensures that popovers, custom menus, and other context-aware features function as intended, aligning with accessibility best practices.
2. Color Picker Activation via VoiceOver
Another accessibility enhancement fixes a bug where color picker inputs could not be activated using VoiceOver’s press action. Users who rely on VoiceOver to navigate and interact with web forms can now easily open and use color pickers, making tasks like setting custom colors or selecting themes more inclusive. This fix eliminates a frustrating barrier for visually impaired users and underscores Apple’s commitment to web accessibility.
3. Aria-Hidden Invalidation Fixed
The behavior of aria-hidden="true" has been corrected to properly invalidate when focus lands inside the aria-hidden subtree. Previously, focus could remain trapped or cause unexpected behavior in hidden elements. Now, the accessibility tree updates dynamically, ensuring that hidden content is truly inaccessible to assistive technologies when focus is not present, and that focus events are handled correctly within hidden regions. This change improves compliance with ARIA specifications and user experience.
4. VoiceOver Support for
Base <select> elements now work seamlessly with VoiceOver. Two key fixes were applied: the popover (dropdown) closes upon selection, and accessibility path positioning is corrected when CSS transforms are applied. This means that selecting an option from a dropdown no longer leaves the popover stuck open, and VoiceOver users receive accurate positional feedback even on transformed pages. These adjustments make form interactions more predictable and user-friendly.
5. !important Override in CSS Animations
An animation bug where !important declarations failed to override CSS animation values when CSS transitions were also running on the same property has been fixed. This ensures that cascading rules operate correctly, giving developers full control over animation priorities. The fix prevents conflicts that could lead to unexpected visual glitches or styling inconsistencies, particularly in complex component animations.
6. Identity Matrix Decomposition Bug Squashed
A problem with identity matrix decomposition that generated invalid quaternions has been resolved. This bug caused incorrect transform animations, leading to skewed or distorted movements. By fixing the quaternion calculation, Safari now correctly renders rotation and scale transforms, ensuring that 3D and 2D animations appear smooth and accurate. This is a behind-the-scenes improvement that enhances visual fidelity across many CSS animations.
7. New CSS Feature: Contain: Style for Quote Counters
Support for the contain: style property has been extended to apply to CSS quote counters, as specified in CSS Containment Level 2. This allows developers to limit the styling containment of quote counters, improving performance and predictability in complex layouts. Containers can now isolate quote-related styles without affecting external elements, which is especially useful for web components and large documents with nested quotations.
8. New CSS Feature: Text-Autospace Insert Keyword
The text-autospace property gains a new insert keyword value. This addition provides more granular control over automatic spacing behavior in text, enabling insertion of spaces where needed for better readability or alignment. While still a niche feature, it offers web designers finer typographic control, particularly in multilingual or justified text scenarios.
9. Box-Shadow on Table-Row Elements Fixed
An issue where box-shadow did not render on display: table-row elements has been corrected. Previously, applying shadows to table rows would be ignored, breaking certain design patterns. Now, table rows can have box shadows, aligning Safari with other browsers and enabling more consistent styling for data tables and grid-like layouts.
10. Performance Boost for :where and :is Selectors
Performance on pages using the :where and :is pseudo-class selectors has been improved. These modern CSS selectors are powerful but can be slow when used heavily. The optimization reduces evaluation time, speeding up style recalculations on complex stylesheets. Developers can now use these selectors more freely without worrying about performance degradation, leading to cleaner and more maintainable code.
These updates reflect Safari Technology Preview 243's dedication to polishing accessibility, animation reliability, and CSS capabilities. Download or update today to experience these improvements firsthand. As always, your feedback helps shape future releases.