Apple has released Safari Technology Preview 242, bringing a host of enhancements and bug fixes to the WebKit engine. This update is available for macOS Tahoe and macOS Sequoia. If you're already running a previous version, you can update via System Settings under General → Software Update. The release encompasses changes from WebKit revisions 310187 to 310599, focusing on accessibility, CSS, forms, HTML, and images. Below, we break down the most important developments in a Q&A format.
What is Safari Technology Preview 242 and how can I install it?
Safari Technology Preview 242 is the latest experimental version of Safari, designed for developers and early adopters to test upcoming web technologies. It is available for download on macOS Tahoe and macOS Sequoia. If you already have a previous Technology Preview installed, you can update directly through System Settings → General → Software Update. No need to reinstall from scratch. This release includes a range of WebKit improvements, from accessibility tweaks to CSS and HTML parser enhancements, making it a valuable tool for web developers to ensure compatibility with evolving web standards.
What accessibility issues were resolved in this update?
Two key accessibility bugs were fixed. First, VoiceOver no longer reads text inside images that have role="presentation", which previously caused confusion for screen reader users by announcing decorative content. Second, macOS accessibility support was improved for customizable <select> elements that use appearance: base-select. This ensures that custom-styled selection widgets interact correctly with assistive technologies like VoiceOver, providing a more inclusive browsing experience. These fixes align with WebKit's ongoing efforts to enhance web accessibility.
What new CSS features were added?
Two notable CSS additions landed. First, support for the attr() function from CSS Values Level 5 was introduced. This allows developers to retrieve the value of an attribute on an element and use it directly in CSS, enabling more dynamic styling without JavaScript. Second, the oblique-only value for the font-synthesis-style property is now supported, as defined in CSS Fonts Level 4. This gives fine-grained control over font style synthesis, ensuring that oblique (slanted) styles are only synthesized when no true oblique font is available, improving typographic precision.
What CSS bugs were fixed?
Multiple CSS issues were addressed. For instance, @media (prefers-color-scheme: dark) now correctly matches inside iframes when the iframe's color-scheme is set to dark. The position-try-order property now interprets logical axis values using the containing block's writing mode instead of the element's, fixing alignment in vertical writing modes. Percent-height replaced elements no longer compute stale preferred widths in shrink-to-fit containers. Table cell nowrap minimum width calculation quirks no longer apply outside quirks mode. Checkbox outlines appear correctly aligned. Anchor-positioned elements anchored to children of sticky boxes now stick properly. Pseudo-element sorting by tree order works correctly. Ligatures no longer cause non-zero layout width for text with font-size: 0. The :in-range and :out-of-range pseudo-classes update properly when the readonly attribute changes. Finally, view-timeline-inset serialization correctly coalesces identical values.
What improvements were made to forms and HTML?
For forms, a bug was fixed in <select multiple> where the onchange event did not always fire when the mouse button was released far outside the element – now it behaves consistently. In HTML, the <dialog> element now supports the closedby attribute, which controls whether clicking outside the dialog or pressing Escape closes it. This enhancement gives developers more control over modal behavior. Additionally, multiple fixes were applied to the HTML parser's fast path: escaped attribute values longer than one character are now processed correctly; nested <li> elements are properly detected; and the adjusted current node is used correctly for MathML and SVG integration point checks, preventing rendering inconsistencies in mixed-namespace documents.
Were there any image-related fixes?
Yes, an image insertion issue was resolved. When inserting an image with a srcset attribute into the DOM, a previous bug could cause incorrect behavior under certain conditions. The exact nature of the fix ensures that responsive images defined via srcset are handled more reliably, preventing potential display problems. This contributes to a smoother experience for users viewing responsive images across different screen sizes and resolutions. For complete details on all changes, refer to the WebKit release notes.