Safari Technology Preview 241: Key Changes Explained

Safari Technology Preview 241 is now available for download on macOS Tahoe and macOS Sequoia, bringing a host of improvements for web developers and users. This release focuses on refining accessibility, animations, and CSS capabilities. Below, we explore the key changes in a question-and-answer format.

What accessibility issues were resolved in Safari Technology Preview 241?

This update addresses several critical accessibility bugs to improve interaction with assistive technologies. First, a fix ensures that calling speechSynthesis.cancel() no longer removes utterances queued by subsequent speechSynthesis.speak() calls, preventing speech interruptions. Bounding boxes for MathML table rows and cells are now computed correctly, enhancing screen reader accuracy. Comboboxes now properly forward focus to their aria-activedescendant, allowing assistive technologies to interact with list items. Additionally, the aria-owns attribute is now respected when computing accessible names from element content, ensuring richer semantic descriptions. These changes make web content more inclusive and navigable for users relying on assistive tools.

How does this release improve CSS animations?

A major fix targets the animation-fill-mode property when applied after viewport resizing. Previously, using viewport-based units (like vw or vh) in animation fills did not recalculate correctly after the viewport changed dimensions, leading to misaligned or stuck animations. Now, these units update properly, ensuring smooth, responsive animations that adapt to window resizing. This fix enhances the reliability of CSS animations in dynamic layouts, benefiting interactive elements and visual effects.

What new CSS features are introduced in version 241?

Safari Technology Preview 241 adds two notable CSS capabilities. First, the stretch keyword is now supported in box sizing properties, allowing elements to fill their containing block’s size more intuitively. Second, stable support for CSS scroll anchoring has been added, which prevents page content from jumping when off-screen elements load or shift. This feature improves scrolling stability by anchoring the user’s viewport position. These enhancements give developers finer control over layout and user experience.

What notable CSS bugs were fixed in this update?

Several CSS rendering issues have been resolved. The U+2028 LINE SEPARATOR character now correctly forces a line break per the CSS specification. outline-offset is no longer inflated when using outline: auto on macOS, ensuring precise focus indicators. Font family serialization now preserves quotes around names matching CSS-wide keywords or generic families, preventing parsing errors. A fix stops unnecessary font downloads for characters not in the specified unicode-range, saving bandwidth. Flex items with percentage-height images now shrink correctly around the image. View Transition snapshots are no longer incorrectly stored in sRGB, fixing color banding in non-sRGB spaces. The contain: layout property no longer causes significant performance slowdowns when all siblings create their own formatting context. Underlines are no longer split when a ruby base expands due to long text. Changing color-scheme now properly repaints the background of composited iframes. Nested children of a popover element using position: absolute now render correctly. color: initial resolves to the right color in dark mode. Elements with display: contents now establish an anchor scope when using anchor-scope. Finally, a regression causing media queries to fail under certain conditions has been fixed, ensuring responsive designs work reliably.

How does this release affect web performance and rendering?

Performance improvements include the fix for contain: layout forced layout slowdowns, which previously caused significant delays when many siblings created formatting contexts. The animation-fill-mode fix also prevents layout thrashing during viewport resizes. By optimizing font downloads to respect unicode-range, network requests are reduced. Additionally, scroll anchoring minimizes visual jumps, improving perceived performance. These changes collectively make web pages smoother and more responsive, especially on complex or media-rich sites.

What other important fixes are included?

Beyond the highlighted areas, this release includes an array of stability and compatibility fixes. For instance, the issue with display: contents not establishing anchor scopes has been resolved, benefiting CSS anchor positioning. The dark mode color resolution fix ensures consistent theming. The popover nested children rendering fix enhances modal and overlay behavior. These updates align Safari more closely with web standards, ensuring developers can rely on consistent behavior across modern browsers.