Your Guide to Safari Technology Preview 240: Update & Test New Features
Introduction
Safari Technology Preview (STP) is Apple’s experimental browser for web developers and early adopters. Release 240 brings significant improvements under the hood, including CSS enhancements, editing fixes, and media updates. This guide walks you through updating to the latest version and testing its new features step by step.
What You Need
- A Mac running macOS Tahoe or macOS Sequoia (the final version name depends on your region).
- An existing installation of Safari Technology Preview (or a fresh download from developer.apple.com).
- An active internet connection to download the update.
- Basic familiarity with Safari’s Developer Tools (optional but helpful for testing).
Step-by-Step Instructions
Step 1: Confirm Your macOS Version
Open System Settings → General → About. Ensure your macOS version is Tahoe or Sequoia. STP 240 only supports these releases.
Step 2: Open Safari Technology Preview
If you already have STP installed, launch it from the Applications folder. If this is a first-time install, download the latest build from Apple’s developer site and move it to your Applications folder.
Step 3: Update via System Settings
Go to System Settings → General → Software Update. Safari Technology Preview appears as a separate entry. Click Update Now to install version 240. Wait for the update to complete; the browser will restart automatically.
Step 4: Verify the Update
Open STP and go to Safari Technology Preview → About Safari Technology Preview. Ensure the version number ends with 240. The WebKit revision range (308418@main to 309286@main) is printed in the release notes.
Step 5: Explore the New CSS revert-rule Keyword
Open Developer Tools (Option+Command+I) and inspect any element. Add a style declaration like .my-class { color: red; }, then override it with color: revert-rule;. The cascade will behave as if the current rule never existed. This is especially useful for resetting component styles in shadow DOM.
Step 6: Test Fixed CSS Scrollbars & Hanging Punctuation
Visit a page with custom CSS scrollbars (e.g., using ::-webkit-scrollbar). In previous versions, scrollbars could be cut off; in 240 they should appear correctly. To test hanging punctuation, apply hanging-punctuation: first; to a paragraph. Apostrophes ('), quotation marks ("), and ideographic space (U+3000) now hang properly when allowed.
Step 7: Verify Editing Improvements
Open a rich text editor (like a CMS or Notes). Try changing fonts multiple times in a multi‑line selection—the Font Picker should remain usable. Copy an emoji from one site and paste it into another; the image should be preserved, not broken. Select absolutely positioned content inside a user-select: none element; the selection should no longer jump unexpectedly.
Step 8: Check Form Focus Behavior
Create a form where a button becomes disabled after being focused. Tab to that button, then disable it (e.g., via JavaScript). In STP 240, the focus remains on the now‑disabled button instead of jumping to the top of the page.
Step 9: Validate HTML Parsing Fixes
Add a <meta viewport> tag containing a form feed character (\f)—it is now treated as whitespace per spec. Also test <body marginheight="5px"> and <iframe marginwidth="10px">; pixel lengths are now parsed correctly instead of being ignored.
Step 10: Test Media & Playback
Try playing a WebM audio file with more than two channels (e.g., 5.1 surround); decoding should succeed. Use MediaCapabilities.decodingInfo() to query VP8 support in WebM—it now returns the correct answer. For Opus audio inside MP4, call decodeAudioData(); it should work. Pause a fullscreen video and attempt Live Text selection—it should be available. If you use FairPlay DRM with VP9 content via MediaSource, playback should now complete. Autoplay now waits for default text tracks to load fully. To test the currentTime getter, create a media element without a player; it returns defaultPlaybackStartPosition (usually zero). Also verify that resetting playback position during load fires a timeupdate event.
Step 11: Report Any Issues
While using STP 240, if you spot a regression, open Help → Report a Bug to WebKit (or use the WebKit Bugzilla). Attach a minimal test case and mention the build range 308418@main…309286@main.
Tips for a Smooth Experience
- Clear your cache after updating: Option+Command+E empties caches, ensuring the new WebKit engine loads fresh.
- Use separate profiles in STP for testing—avoid mixing stable Safari data with preview builds.
- Bookmark the WebKit blog to stay informed about upcoming features.
- If you encounter a crash, the Console app (in Utilities) often logs detailed WebKit errors.
- Remember that STP is experimental; some features may be removed or changed in future releases.
Related Articles
- How to Prevent Feature Bloat in the Age of AI-Powered Development
- How to Master the New Modular Watch Face in watchOS 27: A Step-by-Step Customization Guide
- Perplexity Unveils Mac-First 'Personal Computer' Vision After Apple's Public Endorsement
- Modeling Complex Systems with HASH: A Free Simulation Platform
- Chinese AI Firm Zhipu.AI Open-Sources Blazing-Fast GLM Models, Signals Global Push Ahead of IPO
- 7 Essential Takeaways from the $21M Share the American Dream Philanthropic Pledge
- NVIDIA and Google Cloud: Powering the Next Generation of AI with Agentic and Physical AI
- Apple's Big Plans: MacBook Ultra, Vision Pro Shift, and Foldable iPhone Ultra