Safari Technology Preview 237: Accessibility and CSS Enhancements Lead the Way

By ✦ min read

Apple has released Safari Technology Preview 237, bringing a host of improvements to web developers and users alike. Available for download on macOS Tahoe and macOS Sequoia, this update introduces new features and resolves numerous bugs across accessibility, CSS, DOM, HTML, networking, rendering, and SVG. Existing users can update via System Settings > General > Software Update. Let's dive into the key changes included in this release.

Accessibility

Several important fixes enhance the accessibility of web content, ensuring a more inclusive browsing experience.

Resolved Issues

• Slot elements and aria-labelledby: Fixed slot elements referenced by aria-labelledby to correctly use their assigned slotted content for accessible names while ignoring hidden slotted nodes. This ensures screen readers present the right information.
• Consistent labels for <meter> elements: The <meter> element now has consistent accessible labels between aria-label and title attributes, eliminating confusion.
• Content in shadow roots with display: contents: Elements with display: contents and content inside a shadow root are now properly read by assistive technologies when referenced by aria-labelledby.
• Checkbox naming via <label>: When a checkbox name comes from an associated <label> element, aria-labelledby now uses the checkbox name instead of its value.
• Grid elements in shadow roots and VoiceOver: Grid elements with child rows inside a shadow root now work correctly with VoiceOver.
• Hidden attributes and form controls: Elements with aria-controls or aria-expanded and the hidden attribute no longer appear in VoiceOver’s Form Control menu.
• ::first-letter text exposure: The ::first-letter pseudo-element’s text is now exposed in the accessibility tree even when no other text accompanies it.

CSS

CSS receives a major new pseudo-class selector and several crucial bug fixes.

New Features

• :heading pseudo-class selector: Added support for the :heading pseudo-class selector, allowing developers to style any heading element (h1 through h6) with a single rule.

Resolved Issues

• CSS @scope and form elements: Fixed an issue where CSS rules within @scope were not being applied to <input> and <textarea> elements.
• Dynamic flow-tolerance changes: Dynamic changes to the flow-tolerance property now trigger a relayout for display: grid-lanes.

DOM

Resolved Issues

• offsetX and offsetY for SVG elements: Fixed coordinate calculation for SVG elements when using offsetX and offsetY — they now use the outermost SVG as the base.

HTML

New Features

• source attribute on ToggleEvent: Added support for the source attribute on the ToggleEvent interface, enhancing event handling for toggleable elements.

Networking

Resolved Issues

• X-Frame-Options validation: Fixed the X-Frame-Options header to only strip tab or space characters, not vertical tabs, aligning with standards.
• Range request validation: Range request validation now properly handles HTTP 416 (Requested Range Not Satisfiable) responses.

Rendering

Resolved Issues

• Table rendering with rowspanned cells: Fixed table rendering for cells with rowspan to correctly display bottom border color.
• <marquee> and table widths: The deprecated <marquee> element no longer causes incorrect table width calculations.
• visibility: collapse on columns: Table layout now properly handles visibility: collapse on columns.
• Intrinsic sizing for replaced elements: Fixed intrinsic sizing for absolutely positioned replaced elements (e.g., images).
• Percentage padding in table cells: Percentage padding in table cells now resolves against column widths, not the cell’s own width.
• Table height distribution: Height distribution now applies to all tbody sections, not just the first one.

SVG

New Features

• color-interpolation for SVG gradients: Added support for the color-interpolation attribute for SVG gradients, allowing finer control over color rendering in gradients.

For the complete list of changes, refer to the WebKit changelog from revision 305774 to 306595. Safari Technology Preview 237 continues Apple’s commitment to improving web standards and developer tools.