Safari Technology Preview 243: Key Updates and Enhancements

By ✦ min read

Introduction

Apple has released Safari Technology Preview 243, the latest test version of its browser, now available for macOS Tahoe and macOS Sequoia. This update brings a host of improvements, primarily focusing on web standards compliance, accessibility, and performance. Users who already have the Technology Preview installed can update via System Settings > General > Software Update. The release incorporates WebKit changes from revision 310600@main to 312007@main.

Accessibility Improvements

The update addresses several key accessibility issues, enhancing support for assistive technologies like VoiceOver.

Context Menu and VoiceOver

• IFrame context events: Fixed a bug where the contextmenu event was not triggered for elements inside iframes when using keyboard navigation or assistive actions like VoiceOver’s VO+Shift+M. This ensures users relying on keyboard or screen readers can access context menus within embedded content.
• Color picker activation: Resolved an issue preventing VoiceOver’s press action from activating color picker input fields. This improves color selection for users who cannot use a mouse.

ARIA and Focus Management

• ARIA hidden invalidation: Fixed invalidation of aria-hidden="true" when focus lands inside the hidden subtree. Previously, if an element with aria-hidden received focus, the attribute was incorrectly invalidated, potentially exposing hidden content to assistive technology.
• Base select and VoiceOver: Enhanced support for base <select> elements, including proper closing of the popover after selection and correct accessibility path positioning when CSS transforms are applied. This makes native dropdown menus more usable with VoiceOver.

CSS Animations and Transitions

The release fixes two important issues related to CSS animations and transforms.

• !important and animation overrides: Addressed a bug where !important declarations failed to override CSS animation values when a CSS transition was also running on the same property. Now, !important takes precedence as expected.
• Identity matrix decomposition: Fixed a problem where decomposition of an identity matrix generated invalid quaternions, causing incorrect transform animations. This ensures smoother and more accurate CSS transform interpolations.

CSS Enhancements and Bug Fixes

A significant portion of this update focuses on CSS, introducing new features and resolving numerous layout and styling bugs.

New CSS Features

• contain: style for quote counters: Added support for contain: style applied to CSS quote counters, as specified in CSS Containment Level 2. This allows developers to limit the scope of counter styles for performance optimization.
• text-autospace with insert keyword: Implemented the insert keyword for the text-autospace property. This property controls automatic spacing between CJK and Latin characters. The insert value inserts a space character rather than rendering it visually, which helps with text selection and editing.

Resolved Layout and Styling Issues

The following bugs have been fixed, improving rendering accuracy and performance:

• Flex layout basis: Fixed flex layout to use the used flex-basis instead of the specified value for deterministically evaluating definiteness. This aligns with the CSS Flexible Box Layout specification.
• Anonymous block positioning: Corrected an issue where element positioning was miscalculated when the containing block was an anonymous block (e.g., inside a <div> with display: flex).
• Box-shadow on table-row: Fixed box-shadow not rendering on elements with display: table-row. This restores expected visual styling for table rows.
• Text-indent with calc and percentages: Resolved a bug where text-indent using calc() with percentage values incorrectly treated percentage components as non-zero for intrinsic size calculations. Now they are treated as zero, matching spec behavior.
• Out-of-flow and fit-content height: Fixed an issue where absolutely/fixed positioned elements with height: fit-content had incorrect height values.
• Flex item percentage sizing in quirks mode: Addressed percentage size resolution errors in flex items when the document is in quirks mode (no DOCTYPE).
• Clip-path and border-radius: Corrected rendering of clip-path: inset() with rounded corners when the element and clip-path sizes are small.
• -webkit-box emulation in fieldset: Fixed emulation of -webkit-box (legacy flexbox) inside <fieldset> elements, ensuring child elements are sized correctly.
• Performance with :where and :is: Improved page performance when using the :where and :is CSS pseudo-classes by optimizing their specificity handling.
• Table layout with borders: Fixed incorrect layout for elements with display: table when borders are present.
• Aspect-ratio with border and absolute positioning: Resolved an issue where elements with border, position: absolute, and aspect-ratio: 1 were not rendered as squares—the aspect-ratio was not properly honored.

Conclusion

Safari Technology Preview 243 continues Apple’s commitment to improving web standards support and accessibility. Developers and power users are encouraged to test these updates and provide feedback to help shape the future of Safari. For a complete list of changes, refer to the WebKit project.