Safari Technology Preview 237: Enhanced Accessibility and CSS Features

By

Apple has released Safari Technology Preview 237, the latest experimental version of its browser, now available for download on macOS Tahoe and macOS Sequoia. This update brings a host of improvements spanning accessibility, CSS, DOM, HTML, networking, rendering, and SVG. Existing users can update via System Settings → General → Software Update.

Based on WebKit revisions 305774@main…306595@main, this release focuses on refining core web standards and fixing long-standing bugs. Below, we break down the key changes.

Accessibility Improvements

Several critical accessibility bugs have been addressed to ensure better screen reader and keyboard navigation support:

• Slot elements and aria-labelledby: Fixed to correctly use assigned slotted content for accessible names, ignoring hidden slotted nodes.
• <meter> element: Labels from aria-label and title now remain consistent.
• Display: contents with shadow DOM: Content hidden via display: contents is now properly read by assistive technologies when referenced by aria-labelledby.
• Checkbox naming: aria-labelledby correctly uses the checkbox name from an associated <label> element, not its value.
• Grid elements in shadow root: Child rows are now exposed correctly to VoiceOver.
• aria-controls and aria-expanded: Elements with these attributes and hidden no longer appear in VoiceOver’s Form Controls menu.
• ::first-letter text: No longer ignored in the accessibility tree when it’s the only text content.

CSS Enhancements and Fixes

New Feature: :heading Pseudo-class

Developers can now use the :heading pseudo-class selector to target any heading element (h1–h6) more efficiently.

Resolved Issues

• @scope and form elements: CSS rules within @scope now apply correctly to <input> and <textarea>.
• Grid layout: Dynamic changes to flow-tolerance now trigger proper relayout for display: grid-lanes.

DOM Correction

• SVG coordinate system: offsetX and offsetY values now correctly use the outermost SVG as the base for coordinate calculations.

HTML: ToggleEvent Gets source Attribute

The ToggleEvent interface now supports a source attribute, enabling developers to identify which element triggered the toggle.

Networking Fixes

• X-Frame-Options: Now strips only tab and space characters, not vertical tabs, preventing false positives.
• Range request validation: Properly handles HTTP 416 responses (Requested Range Not Satisfiable), improving video streaming and large downloads.

Rendering Improvements

A series of table and layout fixes enhance visual consistency:

• Rowspan and border colors: Cells spanning multiple rows now apply the correct bottom border color.
• <marquee> effect on tables: No longer causes incorrect table width calculations.
• Visibility: collapse on columns: Table layout properly handles collapsed columns.
• Absolutely positioned replaced elements: Intrinsic sizing works correctly.
• Percentage padding in table cells: Now resolves against column widths.
• Table height distribution: Applies to all tbody sections, not just the first.

SVG: Color-interpolation Support

Gradients now support the color-interpolation attribute, allowing smoother color transitions in scalable vector graphics.

For full details, visit the WebKit blog or download the preview from the official site.

Related Articles

• Unlocking the Past: 10 Crucial Facts About macOS Tahoe's New Password Versioning Feature
• Designing Accessible Websites: A Step-by-Step Guide to Making Accessibility Effortless
• 8 Key Facts About Kubernetes Volume Group Snapshots Now GA in v1.36
• How to Build AI Agents and Workflows Using Notion's Developer Platform
• Anthropic Urges Aggressive US Action to Maintain AI Lead Over China by 2028
• How to Find the Exact Release Time of Lego Batman: Legacy of the Dark Knight in Your Time Zone
• Living Inside a PC: The Giant Computer That Fits a Person
• .NET 11 Revolutionizes Process Management with Powerful New APIs