<?xml version="1.0" encoding="UTF-8" standalone="no"?><rss xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" version="2.0">

<channel>
	<title>Blog – WebKit</title>
	<atom:link href="https://webkit.org/blog/feed/" rel="self" type="application/rss+xml"/>
	<link>https://webkit.org</link>
	<description>Open Source Web Browser Engine</description>
	<lastBuildDate>Wed, 10 Jun 2026 08:03:21 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=7.0</generator>
	<itunes:explicit>no</itunes:explicit><itunes:subtitle>Open Source Web Browser Engine</itunes:subtitle><item>
		<title>Introducing the Field Guide to Grid Lanes</title>
		<link>https://webkit.org/blog/18098/introducing-the-field-guide-to-grid-lanes/</link>
		
		<dc:creator/>
		<pubDate>Wed, 10 Jun 2026 07:30:35 +0000</pubDate>
				<category><![CDATA[News]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=18098</guid>

					<description><![CDATA[This week, we launched the Field Guide to Grid Lanes at gridlanes.webkit.org.]]></description>
										<content:encoded><![CDATA[<p>This week, we launched the Field Guide to Grid Lanes at <a href="https://gridlanes.webkit.org/">gridlanes.webkit.org</a>.</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-top-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img fetchpriority="high" decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-top-light-scaled.png" alt="Field Guide to Grid Lanes website header" width="2560" height="1452" class="aligncenter size-full wp-image-18103" srcset="https://webkit.org/wp-content/uploads/field-guide-top-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-top-light-300x170.png 300w, https://webkit.org/wp-content/uploads/field-guide-top-light-1024x581.png 1024w, https://webkit.org/wp-content/uploads/field-guide-top-light-768x436.png 768w, https://webkit.org/wp-content/uploads/field-guide-top-light-1536x871.png 1536w, https://webkit.org/wp-content/uploads/field-guide-top-light-2048x1161.png 2048w" sizes="(max-width: 2560px) 100vw, 2560px" /></picture></figure>
<p>If you ever bookmarked the CSS Tricks Complete Guide to Flexbox, HTML5 Rocks, or CSS Zen Garden, a guide like this might feel familiar. It’s designed to be an easy introduction, a reference guide — and just plain fun.</p>
<h2>The interactive playground</h2>
<p>At the top is a live, editable Grid Lanes layout. Switch between Waterfall and Brick. Try preset layouts. Drag the slider labeled “Flow tolerance” and click “Play tab order” to understand the impact of <code>flow-tolerance</code>.</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-playground-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-playground-light-scaled.png" alt="Interactive drawing of website with items laid out with Grid Lanes. Multiple buttons, sliders, and a code editor make it possible to try out many combinations quickly &amp; see the results. " width="2560" height="2099" class="aligncenter size-full wp-image-18108" srcset="https://webkit.org/wp-content/uploads/field-guide-playground-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-playground-light-300x246.png 300w, https://webkit.org/wp-content/uploads/field-guide-playground-light-1024x840.png 1024w, https://webkit.org/wp-content/uploads/field-guide-playground-light-768x630.png 768w, https://webkit.org/wp-content/uploads/field-guide-playground-light-1536x1260.png 1536w, https://webkit.org/wp-content/uploads/field-guide-playground-light-2048x1679.png 2048w" sizes="(max-width: 2560px) 100vw, 2560px" /></picture></figure>
<p>Resize the demo browser window to test responsive behavior without resizing your whole window. Edit the CSS directly. Copy the code you create.</p>
<h2>The cheat sheet</h2>
<p>Next is the Field Guide itself — a single-page reference for every property, value, and option.</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-ref-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-ref-light-scaled.png" alt="Screenshot of first part of the reference guide, showing lots of definitions, little diagrams, and tiny code snippets " width="2560" height="2282" class="aligncenter size-full wp-image-18110" srcset="https://webkit.org/wp-content/uploads/field-guide-ref-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-ref-light-300x267.png 300w, https://webkit.org/wp-content/uploads/field-guide-ref-light-1024x913.png 1024w, https://webkit.org/wp-content/uploads/field-guide-ref-light-768x685.png 768w, https://webkit.org/wp-content/uploads/field-guide-ref-light-1536x1369.png 1536w, https://webkit.org/wp-content/uploads/field-guide-ref-light-2048x1826.png 2048w" sizes="(max-width: 2560px) 100vw, 2560px" /></picture></figure>
<p>It has four sections:</p>
<ul>
<li><strong>Grid Lanes Basics</strong> — <code>display: grid-lanes</code>, plus the difference between waterfall and brick layouts</li>
<li><strong>Options for Lane Definitions</strong> — Grid track-sizing with <code>fr</code> units, fixed lengths, percentages, <code>auto</code>, <code>min-content</code> &amp; <code>max-content</code>, <code>fit-content()</code>, <code>minmax()</code>, <code>repeat()</code>, and <code>auto-fill</code> vs <code>auto-fit</code></li>
<li><strong>Options for Placement &amp; Spacing</strong> — <code>flow-tolerance</code>, <code>gap</code>, spanning tracks, and explicit placement</li>
<li><strong>Good to Know</strong> — info about source order, progressive enhancement, and switching layouts at different breakpoints</li>
</ul>
<h2>The demos</h2>
<p>To showcase the possibilities of Grid Lanes, we created six demos, each available in several variations:</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-demos-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-demos-light-scaled.png" alt="The six demos listed on the homepage — with a screenshot of each." width="2560" height="1714" class="aligncenter size-full wp-image-18112" srcset="https://webkit.org/wp-content/uploads/field-guide-demos-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-demos-light-300x201.png 300w, https://webkit.org/wp-content/uploads/field-guide-demos-light-1024x686.png 1024w, https://webkit.org/wp-content/uploads/field-guide-demos-light-768x514.png 768w, https://webkit.org/wp-content/uploads/field-guide-demos-light-1536x1028.png 1536w, https://webkit.org/wp-content/uploads/field-guide-demos-light-2048x1371.png 2048w" sizes="auto, (max-width: 2560px) 100vw, 2560px" /></picture></figure>
<ul>
<li><strong>Photos</strong> — just images, in a variety of aspect ratios</li>
<li><strong>Recipes</strong> — components containing both flexible images and varying lengths of text</li>
<li><strong>Newspaper</strong> — longer passages of text, with a few images (and a lot of CSS puns)</li>
<li><strong>Mega Menu</strong> — lists of very short text</li>
<li><strong>Timeline</strong> — text in brick layout</li>
<li><strong>Pinboard</strong> — mixed media</li>
</ul>
<p>Each demo opens with a floating control panel.</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-controls-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-controls-light-scaled.png" alt="Screenshot of one of the demos, happens to be of photo layout. The controls are showing, as described in the article. " width="2560" height="1966" class="aligncenter size-full wp-image-18114" srcset="https://webkit.org/wp-content/uploads/field-guide-controls-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-controls-light-300x230.png 300w, https://webkit.org/wp-content/uploads/field-guide-controls-light-1024x786.png 1024w, https://webkit.org/wp-content/uploads/field-guide-controls-light-768x590.png 768w, https://webkit.org/wp-content/uploads/field-guide-controls-light-1536x1180.png 1536w, https://webkit.org/wp-content/uploads/field-guide-controls-light-2048x1573.png 2048w" sizes="auto, (max-width: 2560px) 100vw, 2560px" /></picture></figure>
<p>“Layout” offers a dropdown of variations — showing off what Grid Lanes can do, and comparing it to Flexbox, Multicolumn, and Grid. “Numbers” shows item order. “Flow tolerance” lets you experiment with its effects. The code panel displays the key layout CSS.</p>
<p>“Hide controls” puts the focus on the demo itself. To get the controls back, click the gear that appears in the lower-right corner.</p>
<h2>Working with Safari’s developer tools</h2>
<p>Web Inspector knows about Grid Lanes, too. Toggle “Order Numbers” to reveal overlays marking the DOM order of items. These numbers are extremely useful when experimenting to find the best <code>flow-tolerance</code> value for your content.</p>
<figure class=""><picture><source srcset="https://webkit.org/wp-content/uploads/field-guide-inspector-dark-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/field-guide-inspector-light-scaled.png" alt="Screenshot of photo demo, with Web Inspector open. The Grid Inspector is showing, with Item numbers are turned on. This creates lines all over the webpage, revealing the Grid Lanes layout, and marking each Item with a number. " width="2560" height="2099" class="aligncenter size-full wp-image-18116" srcset="https://webkit.org/wp-content/uploads/field-guide-inspector-light-scaled.png 2560w, https://webkit.org/wp-content/uploads/field-guide-inspector-light-300x246.png 300w, https://webkit.org/wp-content/uploads/field-guide-inspector-light-1024x840.png 1024w, https://webkit.org/wp-content/uploads/field-guide-inspector-light-768x630.png 768w, https://webkit.org/wp-content/uploads/field-guide-inspector-light-1536x1260.png 1536w, https://webkit.org/wp-content/uploads/field-guide-inspector-light-2048x1679.png 2048w" sizes="auto, (max-width: 2560px) 100vw, 2560px" /></picture></figure>
<p>Learn more by reading <a href="https://webkit.org/blog/17746/new-safari-developer-tools-provide-insight-into-css-grid-lanes/">New Safari developer tools provide insight into CSS Grid Lanes</a>.</p>
<h2>What about other browsers?</h2>
<p>Grid Lanes works today in Safari 26.4+. For the latest information about other browsers, check <a href="https://caniuse.com/css-grid-lanes">Can I Use</a>. For progressive enhancement guidance, read <a href="https://webkit.org/blog/17758/when-will-css-grid-lanes-arrive-how-long-until-we-can-use-it/">When will CSS Grid Lanes arrive? How long until we can use it?</a></p>
<h2>Made by the people who shipped it</h2>
<p>The Field Guide was built by the same team behind Grid Lanes. We hope this is a fun experience that makes Grid Lanes easy to learn. Bookmark it, share it with colleagues, and let us know what you make.</p>
<p><a href="https://gridlanes.webkit.org/"><strong>Visit the Field Guide →</strong></a></p>
<h2>Feedback</h2>
<p>We’d love to hear from you. Find us online: Jen Simmons on <a href="https://bsky.app/profile/jensimmons.bsky.social">Bluesky</a> / <a href="https://front-end.social/@jensimmons">Mastodon</a>, Saron Yitbarek on <a href="https://bsky.app/profile/saron.bsky.social">Bluesky</a> / <a href="https://front-end.social/@saron">Mastodon</a>, and Jon Davis on <a href="https://bsky.app/profile/jondavis.bsky.social">Bluesky</a> / <a href="https://mastodon.social/@jondavis">Mastodon</a>. You can follow WebKit <a href="https://www.linkedin.com/in/apple-webkit/">on LinkedIn</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Discover MapKit JS 6: Rebuilt for Today’s Web Developer</title>
		<link>https://webkit.org/blog/18027/discover-mapkit-js-6-rebuilt-for-todays-web-developer/</link>
		
		<dc:creator/>
		<pubDate>Tue, 09 Jun 2026 17:00:35 +0000</pubDate>
				<category><![CDATA[News]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=18027</guid>

					<description><![CDATA[MapKit JS allows you to bring the power and simplicity of Apple Maps to your website or web app.]]></description>
										<content:encoded><![CDATA[<p>MapKit JS allows you to bring the power and simplicity of Apple Maps to your website or web app.  Whether you&#8217;re building a store locator, a travel planner, or a companion web experience for a native app, MapKit JS offers you a robust, privacy-first framework, providing the mapping data, services, and design quality behind Apple Maps, directly to your JavaScript code.</p>
<p>If you haven’t tried MapKit JS lately, now is a great time to take another look. With our latest version 6 release, we’ve made it easier than ever for you to integrate MapKit JS into your apps and websites by modernizing around today’s web development patterns.</p>
<h2><a name="see-it-in-action"></a>See It in Action</h2>
<p>Getting a MapKit JS map onto a page takes a few lines of code. In this post, we’ll guide you, step-by -step, through how to build a sample app — Yosemite Explorer — featuring points of interest across Yosemite National Park in California. <a href="https://webkit.org/demos/yosemite/">Explore the demo</a>.</p>
<figure>
<img loading="lazy" decoding="async" width="2136" height="1656" src="https://webkit.org/wp-content/uploads/yosemite-explorer-hero.png" alt="image, showing the full app: POIs marked on the map with one selected, showing place detail popover and driving directions" class="preserve-color wp-image-18034" srcset="https://webkit.org/wp-content/uploads/yosemite-explorer-hero.png 2136w, https://webkit.org/wp-content/uploads/yosemite-explorer-hero-300x233.png 300w, https://webkit.org/wp-content/uploads/yosemite-explorer-hero-1024x794.png 1024w, https://webkit.org/wp-content/uploads/yosemite-explorer-hero-768x595.png 768w, https://webkit.org/wp-content/uploads/yosemite-explorer-hero-1536x1191.png 1536w, https://webkit.org/wp-content/uploads/yosemite-explorer-hero-2048x1588.png 2048w" sizes="auto, (max-width: 2136px) 100vw, 2136px" /><br />
</figure>
<h2><a name="try-it-yourself"></a>Try it yourself</h2>
<h3><a name="apple-developer-account"></a>Apple Developer Account</h3>
<p>To display a map, provide a developer token to MapKit JS. You generate that token through an Apple Developer account — and that same account unlocks a lot more than just maps. With an Apple Developer account, you get access to Apple&#8217;s full suite of developer services: publish Safari Web Extensions, and use powerful web frameworks like MusicKit JS for Apple Music integration, CloudKit JS for iCloud-backed data storage, and more. <a href="https://developer.apple.com/account">Sign up for an Apple Developer account</a>.</p>
<p>MapKit JS 6 makes token setup significantly simpler. You can now use a static token bound to your website&#8217;s domain, generated directly from the Apple Developer website — no private key management or self-signing required. For details, see <a href="https://developer.apple.com/documentation/mapkitjs/creating-a-maps-token">Creating a Maps token</a>.</p>
<h3><a name="load-the-framework"></a>Load the Framework</h3>
<p>New in v6, the MapKit JS loader ships as an NPM package, so the framework integrates directly into modern build pipelines. If you are looking to build a quick prototype or load MapKit JS directly in HTML, you can also skip to [Loading the MapKit JS script in your browser] below.</p>
<h4><a name="load-with-mapkit-js-loader"></a>Load with MapKit JS Loader</h4>
<p>To get our Yosemite map running, the next step is to install the package:</p>
<pre><code class="sh">npm install @apple/mapkit-loader
</code></pre>
<p>Now you can load the framework with the token you generated in the previous step:</p>
<pre><code class="js"><span class="keyword control">import</span> { <span class="identifier">load</span> } <span class="identifier">from</span> <span class="string">"@apple/mapkit-loader"</span>;

<span class="keyword type">const</span> <span class="identifier">mapkit</span> <span class="operator">=</span> <span class="identifier">await</span> <span class="identifier">load</span>({
    <span class="identifier">libraries</span><span class="operator">:</span> [<span class="string">"map"</span>, <span class="string">"services"</span>, <span class="string">"annotations"</span>],
    <span class="identifier">token</span><span class="operator">:</span> <span class="string">"your-token-here"</span>
});
<span class="identifier">console</span>.<span class="identifier">log</span>(<span class="string">"MapKit loads"</span>, <span class="identifier">mapkit</span>.<span class="identifier">loadedLibraries</span>);
</code></pre>
<p>Let’s reload the page. The <code>console.log()</code> output should appear in Web Inspector:</p>
<figure><img loading="lazy" decoding="async" width="2212" height="1024" src="https://webkit.org/wp-content/uploads/web-inspector-mapkit.png" alt="screenshot of Web Inspector showing MapKit JS loads" class="preserve-color wp-image-18045" srcset="https://webkit.org/wp-content/uploads/web-inspector-mapkit.png 2212w, https://webkit.org/wp-content/uploads/web-inspector-mapkit-300x139.png 300w, https://webkit.org/wp-content/uploads/web-inspector-mapkit-1024x474.png 1024w, https://webkit.org/wp-content/uploads/web-inspector-mapkit-768x356.png 768w, https://webkit.org/wp-content/uploads/web-inspector-mapkit-1536x711.png 1536w, https://webkit.org/wp-content/uploads/web-inspector-mapkit-2048x948.png 2048w" sizes="auto, (max-width: 2212px) 100vw, 2212px" /></figure>
<p>MapKit JS partitions its features into libraries, so you load only what you need. Set the <code>libraries</code> array to the minimal set for the best performance. When you load MapKit JS through MapKit JS Loader, it automatically sources full TypeScript support through DefinitelyTyped into your project. <a href="https://developer.apple.com/documentation/mapkitjs/loading-the-latest-version-of-mapkit-js#Select-MapKit-JS-libraries">Find a list of available libraries in developer documentation for MapKit JS</a>.</p>
<h4><a name="alternative-load-the-mapkit-js-script-in-html"></a>Alternative: Load the MapKit JS script in HTML</h4>
<p>For quick prototyping or web apps without a build pipeline, you can load and initialize MapKit JS with a <code>&lt;script&gt;</code> tag:</p>
<pre><code class="html"><span class="tag">&lt;<span class="keyword">script</span> <span class="keyword attribute">src</span>=<span class="attribute value string">"https://cdn.apple-mapkit.com/mk/6/mapkit.core.js"</span>
     <span class="keyword attribute">crossorigin</span> <span class="keyword attribute">async</span>
     <span class="keyword attribute">data-callback</span>=<span class="attribute value string">"initMapKit"</span>
     <span class="keyword attribute">data-libraries</span>=<span class="attribute value string">"map,services,annotations"</span>
     <span class="keyword attribute">data-token</span>=<span class="attribute value string">"your-token-here"</span>&gt;</span><span class="tag">&lt;/<span class="keyword">script</span>&gt;</span>
</code></pre>
<p>When the script loads, it invokes <code>window.initMapKit</code> — a callback you define — after which the <code>mapkit</code> namespace is available under <code>window</code>.</p>
<h3><a name="create-a-map"></a>Create a Map</h3>
<p>You create a map by passing the ID of a container element and a region. For our example, we center the map view on Yosemite Valley and set the camera high enough to cover the whole valley.</p>
<p>First, in HTML, define a sized container for the map view:</p>
<pre><code class="html"><span class="tag">&lt;<span class="keyword">div</span> <span class="keyword attribute">id</span>=<span class="attribute value string">"map-container"</span> <span class="keyword attribute">style</span>=<span class="attribute value string">"width: 500px; height: 500px;"</span>&gt;</span><span class="tag">&lt;/<span class="keyword">div</span>&gt;</span>
</code></pre>
<p>In JavaScript, frame the map viewport by setting a center coordinate (latitude and longitude) and a camera distance (in meters):</p>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">map</span> <span class="operator">=</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">Map</span>(<span class="string">"map-container"</span>, {
    <span class="identifier">center</span><span class="operator">:</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">Coordinate</span>(<span class="number">37.7456</span>, <span class="operator">-</span><span class="number">119.5936</span>),
    <span class="identifier">cameraDistance</span><span class="operator">:</span> <span class="number">28000</span>
});
</code></pre>
<p>With that, the framework renders an interactive map in your container, centered on Yosemite Valley:</p>
<figure class="widescreen"><img loading="lazy" decoding="async" width="2130" height="1616" src="https://webkit.org/wp-content/uploads/yosemite-explorer-map.png" alt="image showing map loads inside the container" class="preserve-color wp-image-18047" srcset="https://webkit.org/wp-content/uploads/yosemite-explorer-map.png 2130w, https://webkit.org/wp-content/uploads/yosemite-explorer-map-300x228.png 300w, https://webkit.org/wp-content/uploads/yosemite-explorer-map-1024x777.png 1024w, https://webkit.org/wp-content/uploads/yosemite-explorer-map-768x583.png 768w, https://webkit.org/wp-content/uploads/yosemite-explorer-map-1536x1165.png 1536w, https://webkit.org/wp-content/uploads/yosemite-explorer-map-2048x1554.png 2048w" sizes="auto, (max-width: 2130px) 100vw, 2130px" /></figure>
<h4><a name="alternative-create-a-map-with-frameworks"></a>Alternative: Create a Map with frameworks</h4>
<p>When using a UI framework, pass in the DOM element directly. For example, in React:</p>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">mapRef</span> <span class="operator">=</span> <span class="identifier">useRef</span>(<span class="keyword literal">null</span>);

<span class="identifier">useEffect</span>(() <span class="operator">=</span><span class="operator">&gt;</span> {
        <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">Map</span>(<span class="identifier">mapRef</span>.<span class="identifier">current</span>, {
            <span class="identifier">region</span><span class="operator">:</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">CoordinateRegion</span>(
                <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">Coordinate</span>(<span class="number">37.3349</span>, <span class="operator">-</span><span class="number">122.0090</span>),
            <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">CoordinateSpan</span>(<span class="number">0.01</span>, <span class="number">0.01</span>)
        )
    });
}, []);

<span class="keyword control">return</span> <span class="operator">&lt;</span><span class="identifier">div</span> <span class="identifier">ref</span><span class="operator">=</span>{<span class="identifier">mapRef</span>} <span class="identifier">style</span><span class="operator">=</span>{{ <span class="identifier">width</span><span class="operator">:</span> <span class="string">"500px"</span>, <span class="identifier">height</span><span class="operator">:</span> <span class="string">"500px"</span> }} <span class="operator">/</span><span class="operator">&gt;</span>;
</code></pre>
<h3><a name="add-place-annotations"></a>Add Place Annotations</h3>
<p>You can add custom annotations or overlays to the interactive map view. In this example, we&#8217;ll showcase places in Yosemite National Park with <code>PlaceAnnotation</code> — an annotation that automatically picks up the place&#8217;s title, coordinate, and iconography from Apple&#8217;s data.</p>
<p>Each place in Apple Maps is referenced by a Place ID, an opaque string that represents a point of interest rather than a specific coordinate or address. You can find Place IDs with the <a href="https://developer.apple.com/maps/place-id-lookup/">Place ID Lookup tool</a> or <a href="https://developer.apple.com/documentation/mapkitjs/search">the Search service</a>. New in v6, <code>PlaceLookup</code> returns a promise, so you can pass a Place ID, <code>await</code> the result, and create the annotation in a single flow:</p>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">placeLookup</span> <span class="operator">=</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">PlaceLookup</span>();

<span class="keyword type">const</span> <span class="identifier">id</span> <span class="operator">=</span> <span class="string">"I7408F9590EC1AB75"</span>;
<span class="keyword type">const</span> <span class="identifier">place</span> <span class="operator">=</span> <span class="identifier">await</span> <span class="identifier">placeLookup</span>.<span class="identifier">getPlace</span>(<span class="identifier">id</span>);
<span class="keyword type">const</span> <span class="identifier">annotation</span> <span class="operator">=</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">PlaceAnnotation</span>(<span class="identifier">place</span>, {
    <span class="identifier">selectionAccessory</span><span class="operator">:</span> <span class="keyword operator">new</span> <span class="identifier">mapkit</span>.<span class="identifier">PlaceSelectionAccessory</span>()
});

<span class="identifier">addToList</span>(<span class="identifier">annotation</span>);
<span class="identifier">map</span>.<span class="identifier">addAnnotation</span>(<span class="identifier">annotation</span>);
</code></pre>
<p>The code snippet above adds a <code>PlaceAnnotation</code> to the map and populates the same place on a list. The list draws the place name using the <code>annotation.title</code> property:</p>
<figure><img loading="lazy" decoding="async" width="2116" height="1578" src="https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation.png" alt="image showing the map with a PlaceAnnotation" class="preserve-color wp-image-18049" srcset="https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation.png 2116w, https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation-300x224.png 300w, https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation-1024x764.png 1024w, https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation-768x573.png 768w, https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation-1536x1145.png 1536w, https://webkit.org/wp-content/uploads/yosemite-explorer-place-annotation-2048x1527.png 2048w" sizes="auto, (max-width: 2116px) 100vw, 2116px" /></figure>
<p>The snippet also sets a <code>selectionAccessory</code> option to a <code>PlaceSelectionAccessory</code> instance. When the user selects a marker, selection accessory displays detailed information of that place, like contact information or operating hours.</p>
<figure><img loading="lazy" decoding="async" width="2374" height="1706" src="https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected.png" alt="image showing the marker selected with selection accessory shown" class="preserve-color wp-image-18050" srcset="https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected.png 2374w, https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected-300x216.png 300w, https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected-1024x736.png 1024w, https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected-768x552.png 768w, https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected-1536x1104.png 1536w, https://webkit.org/wp-content/uploads/yosemite-explorer-marker-selected-2048x1472.png 2048w" sizes="auto, (max-width: 2374px) 100vw, 2374px" /></figure>
<p>Repeat the place lookup to populate the app with all places.</p>
<h3><a name="respond-to-interactions"></a>Respond to Interactions</h3>
<p>We want to present the user interface in a consistent state. New in v6, MapKit JS uses the standard browser <code>EventTarget</code> model, so handling map events works like handling any other DOM event. When the user selects an annotation on the map, you can update the corresponding list item:</p>
<pre><code class="js"><span class="identifier">map</span>.<span class="identifier">addEventListener</span>(<span class="string">"select"</span>, (<span class="identifier">event</span>) <span class="operator">=</span><span class="operator">&gt;</span> {
    <span class="keyword type">const</span> <span class="identifier">selected</span> <span class="operator">=</span> <span class="identifier">event</span>.<span class="identifier">annotation</span>;
    <span class="identifier">setListSelected</span>(<span class="identifier">selected</span>.<span class="identifier">id</span>);
});
</code></pre>
<p>Likewise, when the user selects a list item, select the corresponding annotation on the map. Since each list item holds a reference to the annotation instance, set its <code>selected</code> property to <code>true</code>:</p>
<pre><code class="js"><span class="identifier">element</span>.<span class="identifier">addEventListener</span>(<span class="string">"click"</span>, (<span class="identifier">event</span>) <span class="operator">=</span><span class="operator">&gt;</span> {
    <span class="identifier">annotation</span>.<span class="identifier">selected</span> <span class="operator">=</span> <span class="keyword literal">true</span>;
});
</code></pre>
<p>This creates a two-way binding so the list and the map feel connected when either is interacted with. With that, we completed our app:</p>
<figure class="widescreen"><video src="https://webkit.org/wp-content/uploads/yosemite-explorer-click.mov" muted controls>video, showing list item rendered as selected when the marker is selected</video></figure>
<p>The same <code>addEventListener</code> pattern applies to annotation selections, map region changes, and every other MapKit JS interaction. See <a href="https://developer.apple.com/documentation/mapkitjs/handling-map-events">Handling map events</a> to learn about all available event types.</p>
<h2><a name="apple-maps-built-for-the-web"></a>Apple Maps, Built for the Web</h2>
<p>In walking through the Yosemite Explorer example, you&#8217;ve seen several v6 changes working together. Installing MapKit JS as an npm package makes getting started more straightforward. Handling annotation selection with <code>addEventListener</code> puts the standard browser <code>EventTarget</code> model to work — one that v6 adopts consistently across the API. Using <code>await</code> for place lookups uses native promises throughout. And the authentication token you configured at the start is scoped to specific capabilities, giving you fine-grained control over access. Together, these changes make bringing the power of Apple Maps to your website a natural part of your development process.</p>
<h2><a name="next-steps"></a>Next Steps</h2>
<p>Explore the <a href="https://developer.apple.com/documentation/mapkitjs">MapKit JS documentation</a> to dive deeper into the API. If you are using an earlier version of MapKit JS, check out the <a href="https://developer.apple.com/documentation/mapkitjs/migrating-from-version-5-to-version-6">migration guide</a>. Try the code samples in your own project, and share feedback through <a href="https://feedbackassistant.apple.com/">Feedback Assistant</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Release Notes for Safari Technology Preview 245</title>
		<link>https://webkit.org/blog/17970/release-notes-for-safari-technology-preview-245/</link>
		
		<dc:creator/>
		<pubDate>Mon, 08 Jun 2026 22:19:58 +0000</pubDate>
				<category><![CDATA[Safari Technology Preview]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17970</guid>

					<description><![CDATA[Safari Technology Preview Release 245 is now available for download for macOS Tahoe and macOS Sequoia.]]></description>
										<content:encoded><![CDATA[<p><a href="https://webkit.org/blog/6017/introducing-safari-technology-preview/">Safari Technology Preview</a> Release 245 is now <a href="https://developer.apple.com/safari/resources/">available for download</a> for macOS Tahoe and macOS Sequoia. If you already have Safari Technology Preview installed, you can update it in System Settings under General → Software Update.</p>
<p>This release includes WebKit changes between: <a href="https://github.com/WebKit/WebKit/compare/bc59681571095d4c238aab49e33c533532e96399...9a89edbceb77c97659998cfbb71ff1af3a7604b5">312965@main&#8230;313358@main</a>.</p>
<h3>Accessibility</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed VoiceOver&#8217;s &#8220;Skip redundant labels&#8221; setting not being respected on certain web pages. (<a href="https://commits.webkit.org/312967@main">312967@main</a>)  (176297111)</li>
</ul>
<h3>CSS</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the case-sensitive modifier <code>s</code> in CSS attribute selectors. (<a href="https://commits.webkit.org/313234@main">313234@main</a>)  (126331481)</li>
<li>Added support for the <code>:host:has()</code> compound selector in CSS. (<a href="https://commits.webkit.org/313350@main">313350@main</a>)  (139799278)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>aspect-ratio</code> not being respected on flex children when the flex container has <code>position: absolute</code>. (<a href="https://commits.webkit.org/313213@main">313213@main</a>)  (117807518)</li>
<li>Fixed <code>aspect-ratio</code> not working correctly on flex children that also have <code>overflow</code> set. (<a href="https://commits.webkit.org/313170@main">313170@main</a>)  (118926827)</li>
<li>Fixed image <code>aspect-ratio</code> not being preserved when <code>width: 100%</code> and <code>height: 100%</code> are set but no ancestor has a defined width. (<a href="https://commits.webkit.org/313003@main">313003@main</a>)  (162373271)</li>
<li>Fixed transferred min/max block-size constraints not being applied for intrinsic keyword widths on replaced elements. (<a href="https://commits.webkit.org/313091@main">313091@main</a>)  (173128588)</li>
<li>Fixed serialization of multi-word font family names that were always incorrectly quoted due to treating the full string as a single identifier. (<a href="https://commits.webkit.org/313271@main">313271@main</a>)  (175522811)</li>
<li>Fixed <code>CSSStyleDeclaration.setProperty()</code> failing to apply <code>!important</code> priority to an existing inline style property when the value was an integer of 255 or lower. (<a href="https://commits.webkit.org/313159@main">313159@main</a>)  (176099619)</li>
<li>Fixed an issue where elements using <code>stretch</code> sizing inside anonymous block wrappers resolved to their intrinsic size instead of stretching to fill the available space. (<a href="https://commits.webkit.org/313359@main">313359@main</a>)  (176398251)</li>
<li>Fixed <code>:has()</code> style invalidation failing in complex nested cases involving <code>:is()</code>. (<a href="https://commits.webkit.org/312966@main">312966@main</a>)  (176719780)</li>
<li>Fixed <code>-webkit-perspective</code> not establishing a containing block for fixed-positioned descendants. (<a href="https://commits.webkit.org/313020@main">313020@main</a>)  (176729670)</li>
<li>Fixed nested multi-column layouts with three or more levels failing to paginate content across pages. (<a href="https://commits.webkit.org/312973@main">312973@main</a>)  (176741498)</li>
<li>Fixed <code>:has()</code> selector performance by using scope selectors to limit style invalidation traversal for class, attribute, and pseudo-class changes. (<a href="https://commits.webkit.org/313009@main">313009@main</a>)  (176771971)</li>
<li>Fixed non-replaced blocks with <code>aspect-ratio</code> and a percentage <code>max-width</code> collapsing to zero width during intrinsic sizing. (<a href="https://commits.webkit.org/313074@main">313074@main</a>)  (176873776)</li>
<li>Fixed percentage <code>max-width</code> on elements with <code>aspect-ratio</code> resolving against the wrong axis in perpendicular writing modes. (<a href="https://commits.webkit.org/313078@main">313078@main</a>)  (176879597)</li>
<li>Fixed <code>z-index</code> not applying to statically-positioned <code>display: -webkit-box</code> items to align with Firefox and Chrome behavior. (<a href="https://commits.webkit.org/313081@main">313081@main</a>)  (176886461)</li>
<li>Fixed flex containers using <code>box-sizing: border-box</code> providing the wrong cross size to stretched flex items. (<a href="https://commits.webkit.org/313175@main">313175@main</a>)  (176989934)</li>
<li>Fixed flex containers with <code>aspect-ratio</code>-derived height not providing a definite cross size to their flex items. (<a href="https://commits.webkit.org/313256@main">313256@main</a>)  (177085129)</li>
<li>Fixed SVG images with no intrinsic dimensions collapsing to zero height inside column flex containers. (<a href="https://commits.webkit.org/313257@main">313257@main</a>)  (177086497)</li>
</ul>
<h3>Editing</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a regression where Vietnamese and Korean keyboard input methods incorrectly exited modeless composition mode, requiring a double spacebar press to complete each word. (<a href="https://commits.webkit.org/313286@main">313286@main</a>)  (176847897)</li>
<li>Fixed a recent regression that &#8220;Zhuyin &#8211; Traditional&#8221; input method stalling for multiple seconds when composing Chinese text. (<a href="https://commits.webkit.org/313336@main">313336@main</a>)  (177042301)</li>
</ul>
<h3>HTML</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a severe performance regression causing dynamic insertion of <code>&lt;img&gt;</code> elements with a <code>src</code> attribute to be dramatically slower than other browsers. (<a href="https://commits.webkit.org/313268@main">313268@main</a>)  (166201075)</li>
<li>Fixed nested calls to <code>requestClose()</code> incorrectly firing multiple <code>cancel</code> events and causing a stack overflow. (<a href="https://commits.webkit.org/313239@main">313239@main</a>)  (174850509)</li>
<li>Fixed <code>requestClose()</code> incorrectly removing the <code>open</code> attribute when called on a disconnected <code>dialog</code> element. (<a href="https://commits.webkit.org/313251@main">313251@main</a>)  (174855725)</li>
<li>Fixed <code>&lt;a rel="ar"&gt;</code> elements wrapping <code>&lt;model&gt;</code> elements to correctly enter ARQL without extra steps and to display the AR badge. (<a href="https://commits.webkit.org/313047@main">313047@main</a>)  (176410897)</li>
<li>Fixed the HTML preload scanner not preloading resources referenced by legacy <code>&lt;image&gt;</code> tags. (<a href="https://commits.webkit.org/312984@main">312984@main</a>)  (176712749)</li>
</ul>
<h3>Images</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed rendering performance of HDR images that have gain-maps by using GPU-backed surfaces. (<a href="https://commits.webkit.org/313339@main">313339@main</a>)  (176605566)</li>
</ul>
<h3>JavaScript</h3>
<h4>New Features</h4>
<ul>
<li>Added support for static <code>import defer</code> semantics. (<a href="https://commits.webkit.org/313139@main">313139@main</a>)  (176568369)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed the <code>Array</code> <code>ToPrimitive</code> fast path incorrectly ignoring overrides of <code>Object.prototype.valueOf</code>. (<a href="https://commits.webkit.org/313028@main">313028@main</a>)  (175122250)</li>
<li>Fixed input position corruption in regular expression backward matching when rewinding over a surrogate pair. (<a href="https://commits.webkit.org/313026@main">313026@main</a>)  (175122467)</li>
</ul>
<h3>MathML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for operator dictionary entries for multi-character operators to align with the MathML Core specification. (<a href="https://commits.webkit.org/313083@main">313083@main</a>)  (176543727)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed the MathML operator dictionary to correct the stretchy property for several operators, resolving Web Platform Test failures. (<a href="https://commits.webkit.org/312993@main">312993@main</a>)  (170901728)</li>
<li>Fixed spacing values for prefix operators <code>+</code>, <code>−</code>, <code>±</code>, <code>∓</code>, <code>∇</code>, and infix operator <code>⋉</code> in the MathML Core operator dictionary. (<a href="https://commits.webkit.org/312999@main">312999@main</a>)  (176652211)</li>
<li>Fixed the operator dictionary entry for the <code>∂</code> prefix operator to use the correct spacing values <code>(3, 0)</code> instead of <code>(2, 1)</code>. (<a href="https://commits.webkit.org/312997@main">312997@main</a>)  (176693587)</li>
<li>Fixed nonce-hiding support for MathML elements to align with the HTML specification. (<a href="https://commits.webkit.org/313075@main">313075@main</a>)  (176875058)</li>
</ul>
<h3>Media</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>timeupdate</code> events being fired during seeking before the seek operation completes. (<a href="https://commits.webkit.org/313165@main">313165@main</a>)  (176861767)</li>
<li>Fixed the <code>ended</code> event not always firing when the <code>MediaSource</code> duration is changed to match the current playback position. (<a href="https://commits.webkit.org/313141@main">313141@main</a>)  (176863546)</li>
<li>Fixed a MediaSource issue where the decode-key cleanup in coded frame processing was incorrectly removing non-orphaned samples. (<a href="https://commits.webkit.org/313296@main">313296@main</a>)  (176971800)</li>
<li>Fixed <code>currentTime()</code> returning a stale value after the playback rate was changed from zero to a non-zero value. (<a href="https://commits.webkit.org/313249@main">313249@main</a>)  (177046564)</li>
</ul>
<h3>Rendering</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where a child element with <code>filter: blur()</code> ignored <code>border-radius</code> overflow clipping from its parent. (<a href="https://commits.webkit.org/312531@main">312531@main</a>)  (175519148)</li>
<li>Fixed <code>drop-shadow</code> filters and <code>transform: translate()</code> incorrectly clipping nested elements after a regression. (<a href="https://commits.webkit.org/313316@main">313316@main</a>)  (175905543)</li>
<li>Fixed a repaint issue where table rows did not repaint their previous position after a preceding row changed size, causing content to appear at both the old and new locations. (<a href="https://commits.webkit.org/313168@main">313168@main</a>)  (176172404)</li>
</ul>
<h3>SVG</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed negative <code>stroke-dashoffset</code> values rendering with incorrect offsets when <code>stroke-dasharray</code> has an odd number of values. (<a href="https://commits.webkit.org/313353@main">313353@main</a>)  (103596361)</li>
<li>Fixed an issue where <code>@prefers-color-scheme</code> in an SVG image will sometimes not follow the system color appearance. (<a href="https://commits.webkit.org/313021@main">313021@main</a>)  (176413340)</li>
<li>Fixed <code>getScreenCTM()</code> returning an incorrect matrix when the document is scrolled under a CSS-transformed ancestor. (<a href="https://commits.webkit.org/313111@main">313111@main</a>)  (176814876)</li>
</ul>
<h3>Web API</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed missing custom element callbacks for the <code>role</code> attribute. (<a href="https://commits.webkit.org/312976@main">312976@main</a>)  (176713992)</li>
<li>Fixed incorrect URL parser invocation on the <code>Notification</code> object. (<a href="https://commits.webkit.org/312988@main">312988@main</a>)  (176762955)</li>
<li>Fixed <code>requestAnimationFrame()</code> not providing sub-millisecond timestamp precision in cross-origin isolated contexts. (<a href="https://commits.webkit.org/313153@main">313153@main</a>)  (176967366)</li>
</ul>
<h3>Web Extensions</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed cross-origin <code>XMLHttpRequest</code> incorrectly triggering additional Web Extension permission requests. (<a href="https://commits.webkit.org/313506@main">313506@main</a>)  (154866064)</li>
<li>Fixed loading Web Extensions breaking Cloudflare bot challenge pages. (<a href="https://commits.webkit.org/313007@main">313007@main</a>)  (176618014)</li>
</ul>
<h3>Web Inspector</h3>
<h4>New Features</h4>
<ul>
<li>Added unique colors for style events such as &#8220;Style Invalidated&#8221; and &#8220;Style Recalculated&#8221; in the Timeline view to distinguish them from layout events. (<a href="https://commits.webkit.org/312995@main">312995@main</a>)  (176770197)</li>
</ul>
<h3>WebGPU</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a WGSL shader validation failure in binary arithmetic expressions. (<a href="https://commits.webkit.org/313135@main">313135@main</a>)  (176473479)</li>
</ul>
<h3>WebRTC</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed outgoing video feeds freezing when the Safari window is obscured by another window while a virtual background is active. (<a href="https://commits.webkit.org/312990@main">312990@main</a>)  (170720729)</li>
<li>Fixed screen sharing via <code>getDisplayMedia()</code> starting at extremely low quality and taking up to 30 seconds to become legible for remote participants. (<a href="https://commits.webkit.org/313072@main">313072@main</a>)  (175425085)</li>
</ul>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Web Technology Sessions at WWDC26</title>
		<link>https://webkit.org/blog/17974/web-technology-sessions-at-wwdc26/</link>
		
		<dc:creator/>
		<pubDate>Mon, 08 Jun 2026 19:38:28 +0000</pubDate>
				<category><![CDATA[News]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17974</guid>

					<description><![CDATA[Welcome to WWDC26.]]></description>
										<content:encoded><![CDATA[<p>Welcome to WWDC26. This year, the WebKit team is here with six sessions covering new CSS layouts, customizable form controls, 3D models, immersive spatial experiences, and browser extensions. Regardless of what you’re building for the web, we hope there’s something in here that might make doing your work a little easier, and maybe a little more exciting.</p>
<p>Watch them all on the <a href="https://developer.apple.com/videos/wwdc2026/">Apple Developer</a> site, or read on to find the sessions you’re interested in.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/204/">What&#8217;s New in Safari 27</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10714/10714_wide_900x506_2x.jpg" alt="Image of the presenter, Jen Simmons" class="preserve-color"></figure>
<p>For an overview of what we&#8217;ve been working to bring you this past year, start here. We cover the full range of what&#8217;s coming to Safari 27 with a particular focus on quality. We&#8217;ve shipped over 1000 fixes and improvements across the board, and we hope that work solves some of your problems and makes it easier for you to build for the web. Quality leads the agenda, but we still made room for some great features as well. This session gives a sneak peek at the five features brought to you in Safari 27.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/314/">Grid Lanes</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10860/10860_wide_900x506_2x.jpg" alt="A website using grid lanes layout with Web Inspector open with graphical overlays of tracks and item placement numbering projected over the content" class="preserve-color"></figure>
<p>Grid lanes finally brings the dream of a CSS-only masonry layout to the web, allowing you to create the famous Pinterest-style layout with no additional JavaScript required. It works in both the vertical &#8220;waterfall&#8221; direction and the horizontal &#8220;brick&#8221; direction, and it brings the full power of CSS Grid track sizing with it.</p>
<p>Brandon shows you the few lines of code it takes to implement this layout and also teaches you about some of its helpful features, like <code>flow-tolerance</code>, which gives you control over how far items can drift from source order to fill in the layout — an important consideration for accessibility.</p>
<p>To play with Grid Lanes yourself, check out our interactive demo on our Field Guide at <a href="https://gridlanes.webkit.org">gridlanes.webkit.org</a> and experiment with the layout options. When you’re ready, you can copy the code you write and bring it into your own projects.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/315/">Customizable Select</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10861/10861_wide_900x506_2x.jpg" alt="Image of the presenter Tim Nguyen in a dark blue shirt in a room with a plant on the right and a green wall behind him" class="preserve-color"></figure>
<p>If you’ve built forms for the web, you’ve probably had your fair share of wrestling form controls. Customizable select is here to give you a better alternative, using the power of just HTML and CSS.</p>
<p>Add <code>appearance: base-select</code> to any <code>&lt;select&gt;</code> element and it immediately starts inheriting your design system — fonts, colors, and more. From there, you have full CSS control over every part of the element: the picker popup via <code>::picker(select)</code>, the disclosure icon via <code>::picker-icon</code>, the selected option&#8217;s checkmark via <code>::checkmark</code>. You can even add rich HTML content inside your <code>&lt;option&gt;</code> elements — descriptions, images, anything you want — while keeping all the accessibility and robustness of a native form control.</p>
<p>This session is Tim&#8217;s guide to what Customizable Select now makes possible: a form control that&#8217;s truly in your control. If you&#8217;ve ever built a custom dropdown from scratch to get the styling you needed, this session is for you.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/215/">model element</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10726/10726_wide_900x506_2x.jpg" alt="An iPhone with a website for recreational equipment showing a 3D water bottle with an augmented reality QuickLook button" class="preserve-color"></figure>
<p>The <code>&lt;model&gt;</code> element comes to iOS, iPadOS, and macOS in Safari 27. Embedding interactive 3D models in a webpage now works like embedding any other media: use a <code>&lt;source&gt;</code> element to provide files in multiple formats, set <code>environmentmap</code> for custom lighting, use <code>stagemode="orbit"</code> to let users rotate the model, and reach for the JavaScript API for more programmatic control.</p>
<p>If you’re new to the world of 3D models, Aleksei guides you through the process, starting from the first question: where do you even get 3D models? Then he moves into how to optimize them for the web, how to write the markup, and how to use the JavaScript API for animation playback, programmatic rotation, and more.</p>
<p>Whether you&#8217;re building a product preview for your online store, an educational tool, or just something eye catching to grab your users attention, this session gives you a practical on-ramp.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/320/">Immersive website environments</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10866/10866_wide_900x506_2x.jpg" alt="An illustration of a person wearing an Apple Vision Pro in front of a floating window surrounded by a 3D environment with rocks, grass, and a water well with buckets on and around it" class="preserve-color"></figure>
<p>In visionOS 27, <code>&lt;model&gt;</code> goes further still with immersive website environments. A user can tap to leave the browser window behind and be surrounded by the model you provide — a full spatial experience launched directly from a webpage.</p>
<p>The Immersive API — which is very similar to the Fullscreen API — gives you control over how the environment appears and how users interact with it. Jean built an interactive theater-seating experience to show how this works in practice: a user browses seats on a webpage, then steps into the theater itself to see the view from their seat before they buy.</p>
<p>This session covers what&#8217;s possible, how the API works, and the decisions that go into designing an experience that feels right in visionOS.</p>
<h2><strong><a href="https://developer.apple.com/videos/play/wwdc2026/216/">Web Extensions</a></strong></h2>
<figure><img decoding="async" src="https://devimages-cdn.apple.com/wwdc-services/images/9B2E82C5-4DDF-4B9A-9459-328D8E297696/10727/10727_wide_900x506_2x.jpg" alt="An image of the presenter, Kiara Rose wearing a red top in a room with a wood panel wall and a small side table with a modern-style lamp" class="preserve-color"></figure>
<p>And for Web Extensions, the Safari web extension packager makes it easier than ever to distribute your extension. Publishing a Safari extension no longer requires Xcode, or even a Mac. Now, you can package and submit your extension using App Store Connect from any web browser, on any operating system. One codebase, every browser.</p>
<p>But this session is about more than just packaging — Kiara breaks down how to build a web extension step by step, building a web extension from the ground up. If you&#8217;ve been holding off on publishing your extension for Safari, or if you&#8217;re building your first extension and want to support all browsers from the start, this is the session to watch.</p>
<p>We cover a wide range of web topics in this year’s session, including layouts, 3D objects, and web extensions. Whether it’s a feature or a fix, we hope you’ll find something here that’s applicable and helpful to the work that you do. Enjoy WWDC26!</p>
<h2>Feedback</h2>
<p>We love hearing from you. To share your thoughts, find our web evangelists online: Jen Simmons on <a href="https://bsky.app/profile/jensimmons.bsky.social">Bluesky</a> / <a href="https://front-end.social/@jensimmons">Mastodon</a>, Saron Yitbarek on <a href="https://bsky.app/profile/saron.bsky.social">BlueSky</a>, and Jon Davis on <a href="https://bsky.app/profile/jondavis.bsky.social">Bluesky</a> / <a href="https://mastodon.social/@jondavis">Mastodon</a>. You can follow WebKit <a href="https://www.linkedin.com/in/apple-webkit/">on LinkedIn</a>. If you run into any issues, we welcome your <a href="https://feedbackassistant.apple.com/">feedback</a> on Safari UI (learn more about <a href="https://developer.apple.com/bug-reporting/">filing Feedback</a>), or your <a href="https://bugs.webkit.org/">WebKit bug report</a> about web technologies or Web Inspector. If you run into a website that isn’t working as expected, please file a report at <a href="https://webcompat.com/">webcompat.com</a>. Filing issues really does make a difference.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>News from WWDC26: WebKit in Safari 27 beta</title>
		<link>https://webkit.org/blog/17967/news-from-wwdc26-webkit-in-safari-27-beta/</link>
		
		<dc:creator/>
		<pubDate>Mon, 08 Jun 2026 19:00:34 +0000</pubDate>
				<category><![CDATA[News]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17967</guid>

					<description><![CDATA[Safari 27 beta is here.]]></description>
										<content:encoded><![CDATA[<p>Safari 27 beta is here. Don’t miss our <a href="https://webkit.org/blog/17974/web-technology-sessions-at-wwdc26/">WWDC26 sessions on web technology</a>, including <a href="https://developer.apple.com/videos/play/wwdc2026/204/">What’s new in WebKit for Safari 27</a>, to go deeper on our work in this release. Now, let’s dig into this beta, packed with 58 new features, 525 fixes and 4 deprecations that will hopefully make your work as a web developer a little easier.</p>
<p>Here’s a sneak peek of the highlights:</p>
<ul>
<li>After years of anticipation, you can now use customizable <code>&lt;select&gt;</code>  to style your form elements to match the rest of your site or app without rebuilding it in JavaScript or sacrificing accessibility. </li>
<li>Scroll anchoring prevents those visual jumps when content loads above the viewport. </li>
<li>WebAssembly JavaScript Promise Integration (JSPI) lets Wasm code participate in the async world of JavaScript. </li>
<li>Transform-aware anchor positioning closes out a major gap in the anchor positioning story. </li>
<li>The <code>:heading</code> pseudo-class, the <code>revert-rule</code> keyword, and the <code>stretch</code> keyword for box sizing all land in CSS. </li>
<li>Subpixel inline layout makes text rendering more precise. </li>
</ul>
<p>And that’s just the start.</p>
<p>If you look through the lists of features and fixes in Safari 27, you’ll notice that, although there are 58 brand-new features and 525 fixes — the largest pile of fixes in any Safari release in recent memory — most of what is released is not about new things.</p>
<p>Most of this work has been about existing features behaving more correctly, handling more edge cases, and fitting together with other features the way you’d expect. We committed our time to increasing quality — that’s the story of this release and the year that led to it.</p>
<p>A lot of this work was also about aligning to web standards. When we found a spec that was unclear or incomplete, we helped update it, and then updated WebKit to match.</p>
<p>For example, Safari 27 contains 30 SVG fixes, including updates based on recent decisions in SVG 2 where we revived the Working Group. SVG is used on 67% of webpages, making this work very impactful. Anchor positioning continues to get refined as the CSS specification settles. And in more subtle places throughout the release — URL parsing details, event listener options, timezone identifier handling, <code>innerText</code> edge cases — features that look unchanged on the surface now behave the same way in Safari as they do in Chrome, Firefox, and Edge.</p>
<p>We also spent time making sure features still work across different contexts. A <code>:has()</code> selector invalidating properly when siblings change. An <code>aspect-ratio</code> resolving correctly against a percentage height. <code>box-shadow</code> rendering correctly on table-row elements. <code>background-clip: text</code> working on table header elements. Bugs that appear when combining features are among the hardest to find and the most frustrating, but we’ve made significant progress in hunting them down.</p>
<p>If something has been bothering you, test it in Safari 27 beta. You might be pleasantly surprised. And if it hasn’t been fixed yet, <a href="https://bugs.webkit.org/">file a bug report</a>, or add a comment to an existing issue with a concrete scenario, a link to a real site, or a reduced test case. The more concrete the problem, the more helpful it is.</p>
<p>This work goes beyond the Safari browser. When your customers open their news app, their banking app, their shopping app, there’s a good chance the interface they interact with is powered by the HTML, CSS, and JavaScript that’s rendered by WebKit and JavaScriptCore — the same engines inside Safari. Every fix in this release isn’t just for the browser — it benefits everything the web platform touches.</p>
<p>Let’s dive in.</p>
<h2><a name="customizable-select"></a>Customizable Select</h2>
<p>Safari 27 beta adds support for customizable <code>&lt;select&gt;</code> , which transforms the <code>&lt;select&gt;</code> element. You can now build a fully custom form element that matches the look and feel of your website or web app, without reaching for a JavaScript library or sacrificing the accessibility, reliability, and native platform integration of a real HTML form control.</p>
<p>Use the new <code>appearance: base-select</code> to clear the native styling and start with a clean palette. Then insert any additional CSS you want to create your custom design. Customizable <code>&lt;select&gt;</code> comes with new pseudo-elements for more granular control, like  <code>::picker-icon</code> to target the disclosure indicator and <code>::checkmark</code> to target the checkmark that appears next to the selected <code>&lt;option&gt;</code>.  Both can be fully customized.</p>
<p>Use the new <code>&lt;selectedcontent&gt;</code> element inside the button to display the currently selected option’s content and style <code>&lt;selectedcontent&gt;</code> directly to get it to look exactly how you want in the closed state.</p>
<p>And because you’re still working with a real <code>&lt;select&gt;</code>, everything that comes with a native form control still works: keyboard navigation, screen reader support, form submission, validation, <code>change</code> events. You get the styling freedom of a custom widget with the power of a native HTML element.</p>
<p>Customizable <code>&lt;select&gt;</code> is a multi-vendor effort. The same syntax is coming to other browsers. Use progressive enhancement and style your <code>&lt;select&gt;</code> with <code>appearance: base-select</code> for a great experience in browsers that support it, and let browsers that don’t fall back to their built-in rendering.</p>
<p class="codepen" data-height="500" data-pen-title="Customizable select (originally by Jen Simmons)" data-default-tab="css,result" data-slug-hash="bNBaYmE" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<p>Learn more in the WWDC26 session <a href="https://developer.apple.com/videos/play/wwdc2026/315/">Rediscover the HTML Select Element</a>, where Tim walks through the full API and how to build layouts inside options with Grid and Flexbox.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where <code>&lt;select multiple&gt;</code> did not always fire <code>onchange</code> when the mouse button was released far outside the element. (173882861)</li>
<li>Fixed an issue where <code>&lt;select&gt;</code> control rendering was broken in vertical writing mode. (174068353)</li>
<li>Fixed a performance issue where parsing <code>&lt;select&gt;</code> elements with thousands of <code>&lt;option&gt;</code> children via <code>innerHTML</code> caused O(n²) overhead due to repeated list recalculation. (174244946)</li>
<li>Fixed <code>&lt;option&gt;</code> elements to correctly implement the HTML specification’s dirtiness concept for tracking user-modified <code>selected</code> state. (175306111)</li>
<li>Fixed the select picker appearing at an incorrect position when the <code>&lt;select&gt;</code> element is anchor positioned. (175454476)</li>
<li>Fixed the default <code>display</code> value for <code>&lt;optgroup&gt;</code> and <code>&lt;option&gt;</code> elements to <code>block</code>, matching the behavior of other browsers. (175473184)</li>
<li>Fixed <code>&lt;option&gt;</code> and <code>&lt;optgroup&gt;</code> elements to match the <code>:disabled</code> pseudo-class when inside a disabled <code>&lt;select&gt;</code>. (176559708)</li>
</ul>
<h2><a name="animations"></a>Animations</h2>
<p>Safari 27 beta adds the <code>animation</code> property to the <code>AnimationEvent</code> and <code>TransitionEvent</code> interfaces, letting event handlers directly access the <code>Animation</code> object associated with the event.</p>
<p class="codepen" data-height="500" data-pen-title="event.animation on AnimationEvent / TransitionEvent" data-default-tab="result" data-slug-hash="MYbromb" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where <code>animation-fill-mode</code> did not correctly apply viewport-based units after the viewport was resized. (80075191)</li>
<li>Fixed an issue where <code>!important</code> declarations did not override CSS animation values when CSS transitions were also running on the same property. (174367827)</li>
<li>Fixed an issue where identity matrix decomposition generated invalid quaternions, resulting in incorrect transform animations. (174813328)</li>
</ul>
<h2><a name="css"></a>CSS</h2>
<h3><a name="transform-aware-anchor-positioning"></a>Transform-aware anchor positioning</h3>
<p>Safari 27 beta adds support for transform-aware anchor positioning. Now, when an anchor element has a CSS transform applied — scale, rotate, translate, or any combination — elements positioned relative to that anchor follow its transformed position instead of its pre-transform layout position. This works for transforms applied via the <code>transform</code> property as well as through the individual <code>translate</code>, <code>rotate</code>, and <code>scale</code> properties.</p>
<p>This closes a long-standing gap in the anchor positioning story. If you use anchor positioning to attach a tooltip, popover, or annotation to a transformed element, it now tracks correctly, even with animated transforms.</p>
<p class="codepen" data-height="500" data-pen-title="Anchor positioning with transforms" data-default-tab="result" data-slug-hash="WbozPKJ" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="heading-pseudo-class"></a>:heading pseudo-class</h3>
<p>Safari 27 beta adds support for the <code>:heading</code> pseudo-class, which matches any heading element — <code>&lt;h1&gt;</code> through <code>&lt;h6&gt;</code>.</p>
<p>Instead of writing <code>h1, h2, h3, h4, h5, h6</code> in your selector list, you can just write <code>:heading</code>. And <code>:heading</code> can also be combined with functional selectors to target headings at specific levels:</p>
<p class="codepen" data-height="500" data-pen-title=":heading pseudo-class" data-default-tab="css,result" data-slug-hash="gbLoYPo" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="revert-rule-keyword"></a>revert-rule keyword</h3>
<p>The <code>revert-rule</code> keyword is now supported in Safari 27 beta. Like <code>revert</code> and <code>revert-layer</code>, <code>revert-rule</code> rolls back the cascade — but specifically to the state as if the current style rule had not been present.</p>
<p>It gives you a more precise tool for working with overrides, especially in component libraries and design systems where you want to selectively undo declarations within a rule without losing the rest.</p>
<p class="codepen" data-height="500" data-pen-title="revert-rule" data-default-tab="css,result" data-slug-hash="MYbrgdK" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="stretch-keyword-for-box-sizing"></a>stretch keyword for box sizing</h3>
<p>Safari 27 beta adds support for the <code>stretch</code> keyword in box sizing properties like <code>width</code>, <code>height</code>, <code>min-width</code>, and so on. <code>stretch</code> tells an element to fill the available space in the relevant axis, accounting for margins.</p>
<pre><code class="css"><span class="keyword builtin">.card</span> {
  <span class="attribute">width</span>: <span class="identifier">stretch</span>;
}
</code></pre>
<p>Previously, the common way to achieve this was <code>width: 100%</code> — which doesn’t account for margins and can cause overflow when margins are applied. The <code>stretch</code> keyword does the right thing. If you’ve been using <code>-webkit-fill-available</code> as a workaround for the same behavior, now is a good time to switch.</p>
<p class="codepen" data-height="500" data-pen-title="width: stretch" data-default-tab="css,result" data-slug-hash="OPbzLWE" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="dutch-ij-digraph-in-text-transform-capitalize-and-first-letter"></a>Dutch IJ digraph in text-transform: capitalize and ::first-letter</h3>
<p>The Dutch IJ digraph is now available in Safari 27 beta. When the content language is Dutch (<code>lang="nl"</code>), <code>text-transform: capitalize</code> and <code>::first-letter</code> now correctly titlecase “ij” to “IJ” at the start of words.</p>
<p>A small but genuine improvement for anyone writing Dutch text on the web.</p>
<p class="codepen" data-height="500" data-pen-title="IJ diagraph" data-default-tab="css,result" data-slug-hash="xbRpKrE" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="position-anchor-normal-and-none"></a>position-anchor: normal and none</h3>
<p>Safari 27 beta adds support for <code>position-anchor: normal</code> and <code>position-anchor: none</code>. Before, <code>position-anchor</code> defaults to <code>auto</code>, which makes every element use the implicit anchor element as its default anchor, if one exists. This has a side effect of changing an element’s positioning behavior, whether it uses anchor positioning or not. This may result in compatibility problems.</p>
<p>To fix this, the CSS Working Group has added two values to <code>position-anchor</code> to allow opting out of the new behavior:</p>
<ul>
<li><code>none</code>: an element does not have a default anchor, and its positioning behavior is unchanged.</li>
<li><code>normal</code>: <code>auto</code> if an element uses <code>position-area</code>, otherwise <code>none</code>.</li>
</ul>
<p><code>position-anchor: normal</code> is the new default value, replacing <code>auto</code>. This means elements will only have a default anchor and get anchor positioning behavior if it uses <code>position-area</code>, otherwise its behavior remains unchanged.</p>
<h3><a name="anchor-valid-and-anchor-visible"></a>anchor-valid and anchor-visible</h3>
<p>Safari 27 beta adds support for <code>anchor-valid</code> and <code>anchor-visible</code> . Originally, <code>position-visibility: anchors-valid</code> hides an element if any of its required anchor references can’t be resolved. However, it was not clear what constitutes “required anchor references”. The CSS Working Group has since then changed its behavior to only look at the default anchor box. To match the new behavior, some keywords also got renamed to drop the plurality:</p>
<ul>
<li><code>anchors-valid</code> is renamed to <code>anchor-valid</code></li>
<li><code>anchors-visible</code> is renamed to <code>anchor-visible</code></li>
</ul>
<p>Safari 27 beta aligns with the new behavior but also still supports the old keywords for compatibility.</p>
<h3><a name="style-containment-for-quotes"></a>Style containment for quotes</h3>
<p>Safari 27 beta adds support for <code>contain: style</code> applying to CSS quotes. This allows you to scope effects of quotes to a certain subtree.</p>
<p class="codepen" data-height="500" data-pen-title="contain: style with quotes" data-default-tab="css,result" data-slug-hash="GgNyRdV" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="insert-keyword-for-text-autospace"></a>insert keyword for text-autospace</h3>
<p>Safari 18.4 added support for text-autospace to control spacing between Chinese/Japanese/Korean (CJK) and non-CJK characters. Safari 27 beta now adds the <code>insert</code> keyword, making the following syntaxes equivalent:</p>
<ul>
<li><code>text-autospace: ideograph-alpha ideograph-numeric insert</code>  </li>
<li><code>text-autospace: ideograph-alpha ideograph-numeric</code> </li>
</ul>
<p class="codepen" data-height="500" data-pen-title="text-autospace" data-default-tab="result" data-slug-hash="yyVpXPV" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional Bug Fixes:</h3>
<ul>
<li>Fixed an issue where <code>-webkit-text-fill-color</code> incorrectly overrode <code>text-decoration-color</code>. (47010945)</li>
<li>Fixed <code>shape-outside</code> computing incorrect text wrapping in RTL writing modes. (56890238)</li>
<li>Fixed flex layout to use the used <code>flex-basis</code> instead of the specified value for definiteness evaluation. (85707621)</li>
<li>Fixed an issue where the outline offset was too large for <code>outline: auto</code> on macOS. (94116168)</li>
<li>Fixed an issue where element positioning was incorrect when the containing block was an anonymous block. (96548847)</li>
<li>Fixed an issue where <code>box-shadow</code> did not work on <code>display: table-row</code> elements. (96914376)</li>
<li>Fixed <code>text-indent</code> with <code>calc()</code> containing percentages to correctly treat percentage components as zero for intrinsic size contributions. (97025949)</li>
<li>Fixed an issue where out-of-flow content had an incorrect height when set to <code>fit-content</code>. (97492632)</li>
<li>Fixed an issue with percentage size resolution in flex items in quirks mode. (100183902)</li>
<li>Fixed an issue where <code>clip-path: inset()</code> border-radius values did not render correctly at certain element and clip-path sizes. (110847266)</li>
<li>Fixed <code>-webkit-box</code> flexbox emulation not sizing children correctly inside <code>&lt;fieldset&gt;</code> elements. (114094538)</li>
<li>Fixed: Improved performance on pages using <code>:where</code> and <code>:is</code> selectors. (114904007)</li>
<li>Fixed an issue where elements with <code>display: table</code> could have incorrect layout when borders were present. (116110440)</li>
<li>Fixed <code>font-family</code> serialization to preserve quotes around family names that match CSS-wide keywords or generic families. (125334960)</li>
<li>Fixed an issue where elements with <code>border</code>, <code>position: absolute</code>, and <code>aspect-ratio: 1</code> were not rendered as squares. (126292577)</li>
<li>Fixed an issue where <code>perspective-origin</code> failed to resolve <code>var()</code> references when used as the second value, preventing animations from being applied. (131288246)</li>
<li>Fixed <code>:focus-visible</code> incorrectly matching after a programmatic <code>focus()</code> call triggered by clicking a button with child elements. (134337357)</li>
<li>Fixed an issue where the bottom margin of a last child element collapsed out of a parent with <code>min-height</code>. (134356544)</li>
<li>Fixed a performance issue where pages with many DOM manipulations and complex <code>:has()</code> selectors could freeze. (138431700)</li>
<li>Fixed an issue where a font was downloaded despite no characters in the document falling within its <code>unicode-range</code>. (140674753)</li>
<li>Fixed an issue where <code>@media (prefers-color-scheme: dark)</code> inside an iframe did not match when the iframe’s <code>color-scheme</code> was set to <code>dark</code>. (142072593)</li>
<li>Fixed an issue where <code>background-clip: text</code> did not work on table header elements. (142812484)</li>
<li>Fixed an issue where <code>width: 0</code> did not collapse a table cell to its minimum size. (142814603)</li>
<li>Fixed an issue where <code>:has(:empty)</code> continued to match after the targeted element’s content was dynamically changed to no longer be empty. (143864358)</li>
<li>Fixed an issue where floats and out-of-flow objects could be incorrectly adjacent to anonymous blocks. (144481961)</li>
<li>Fixed an issue where text gradually disappeared when toggling <code>text-transform</code> on elements with <code>::first-letter</code> styling. (145550507)</li>
<li>Fixed an issue where <code>height: max-content</code> resolved to zero on absolutely positioned elements when a child had <code>max-height: 100%</code>. (147333178)</li>
<li>Fixed an issue where tables with collapsed borders incorrectly calculated the first row width, causing excess border width to spill into the table’s margin area. (149675907)</li>
<li>Fixed an issue where an <code>inline-flex</code> container with <code>flex-direction: column</code> did not update its width to match the intrinsic size of a child image when the image was not cached. (150260401)</li>
<li>Fixed CSS <code>zoom</code> interacting incorrectly with <code>font-weight</code>, <code>font-style</code>, and <code>font-variant</code> on iPad. (152173269)</li>
<li>Fixed an issue where non-replaced elements with <code>aspect-ratio</code> enforced the automatic minimum size even when <code>min-width</code> was explicitly set to <code>0</code>. (156837730)</li>
<li>Fixed an issue where an element can’t anchor to its previous sibling. (162903640)</li>
<li>Fixed <code>:has()</code> style invalidation performance for selectors where <code>:has()</code> is in non-subject position. (163512170)</li>
<li>Fixed an issue where RTL grid scrollable areas did not correctly account for grid layout and scrollbars. (167792896)</li>
<li>Fixed pixel snapping to be applied consistently for all <code>border-width</code> value types. (168240347)</li>
<li>Fixed rendering of linear gradients when all color stops are at the same position. (169063497)</li>
<li>Fixed an issue where <code>inset</code> <code>box-shadow</code> was incorrectly positioned on table cells with collapsed borders. (169254286)</li>
<li>Fixed <code>position-try-order</code> to interpret logical axis values using the containing block’s writing mode instead of the element’s own writing mode. (169501069)</li>
<li>Fixed an issue where children with percentage heights inside absolutely positioned elements using intrinsic height values (<code>fit-content</code>, <code>min-content</code>, <code>max-content</code>) incorrectly resolved against the containing block’s height instead of being treated as <code>auto</code>. (171179193)</li>
<li>Fixed an issue where percent-height replaced elements computed stale preferred widths in shrink-to-fit containers. (171184282)</li>
<li>Fixed a regression where <code>@scope</code> styles did not apply to slotted elements in web components. (171383788)</li>
<li>Fixed an issue where the table cell <code>nowrap</code> minimum width calculation quirk was applied outside of quirks mode. (171410252)</li>
<li>Fixed a performance issue where <code>contain: layout</code> caused significantly slower forced layouts when all siblings created their own formatting context. (171545381)</li>
<li>Fixed an issue where dynamically inserting text before existing content did not update <code>::first-letter</code> styling. (171649994)</li>
<li>Fixed an issue where underlines were split when a ruby base was expanded due to long ruby text. (171653095)</li>
<li>Fixed an issue where changing <code>color-scheme</code> did not repaint iframe background. (171658244)</li>
<li>Fixed an issue where nested children of a popover element failed to render when using <code>position: absolute</code>. (171735933)</li>
<li>Fixed an issue where <code>color: initial</code> resolved to the wrong color when the system is in dark mode. (172320282)</li>
<li>Fixed an issue where an element with <code>display: contents</code> did not establish an anchor scope when using <code>anchor-scope</code>. (172355302)</li>
<li>Fixed an issue where ordered list numbers with large starting values were clipped off-screen. (172515216)</li>
<li>Fixed <code>&lt;general-enclosed&gt;</code> in media queries to reject content with unmatched close brackets per the <code>&lt;any-value&gt;</code> grammar. (172575115)</li>
<li>Fixed an issue where the <code>rlh</code> unit was double-zoomed with evaluation-time CSS zoom. (172798163)</li>
<li>Fixed an issue where anchor-positioned elements anchored to children of sticky-positioned boxes did not stick correctly. (172884148)</li>
<li>Fixed an issue where pseudo-elements were not sorted correctly when sorting anchor elements by tree order. (173032203)</li>
<li>Fixed <code>outline: auto</code> to correctly respect zoom. (173068660)</li>
<li>Fixed <code>outline-offset</code> to work correctly with <code>outline: auto</code> on iOS. (173130230)</li>
<li>Fixed <code>:active</code>, <code>:focus-within</code>, and <code>:hover</code> pseudo-classes to correctly account for elements in the top layer. (173145294)</li>
<li>Fixed a regression where the <code>ic</code> length unit was incorrectly affected by page scaling. (173198587)</li>
<li>Fixed the <code>shape()</code> function to omit default control point anchors in computed value serialization per the CSS Shapes specification. (173233716)</li>
<li>Fixed: Updated SVG and MathML user agent style sheets to use <code>:focus-visible</code> instead of <code>:focus</code>. (173321368)</li>
<li>Fixed an issue where <code>lh</code> and <code>rlh</code> units resolved with double-zoom when <code>line-height</code> was a number value. (173448638)</li>
<li>Fixed <code>outline-width</code> to be ignored when <code>outline-style</code> is <code>auto</code>, matching the specification. (173567890)</li>
<li>Fixed <code>:in-range</code> and <code>:out-of-range</code> pseudo-classes for time inputs with reversed ranges. (173589851)</li>
<li>Fixed <code>:placeholder-shown</code> to correctly match input elements that have an empty <code>placeholder</code> attribute. (173604635)</li>
<li>Fixed an issue where ligatures caused a non-zero layout width for text with <code>font-size: 0</code>. (173840866)</li>
<li>Fixed computed value of auto insets or margins as returned by <code>getComputedStyle()</code> to be zero, if the element uses <code>position-area</code> or <code>anchor-center</code>. (173885561)</li>
<li>Fixed <code>position-area</code> not being able to anchor to an element positioned using anchor functions. (173964030)</li>
<li>Fixed <code>:in-range</code> and <code>:out-of-range</code> pseudo-classes to correctly update when the <code>readonly</code> attribute changes. (173978657)</li>
<li>Fixed an issue where <code>view-timeline-inset</code> serialization failed to coalesce identical values. (174096313)</li>
<li>Fixed CSS variable cycle detection to match the CSS Values Level 5 specification. (174105259)</li>
<li>Fixed <code>url()</code> token serialization in CSS custom properties. (174144616)</li>
<li>Fixed <code>text-autospace</code> to correctly handle supplementary Unicode characters. (174148315)</li>
<li>Fixed an issue where flex items with different <code>order</code> values caused incorrect baseline alignment. (174241817)</li>
<li>Fixed an issue where hovering over <code>::first-letter</code> text showed a pointer cursor instead of the expected I-beam cursor. (174258447)</li>
<li>Fixed an issue where <code>display: grid</code> on a <code>&lt;fieldset&gt;</code> element added extra unnecessary space below its content. (174301311)</li>
<li>Fixed outline radii rendering for elements with a non-auto <code>outline-style</code>. (174328839)</li>
<li>Fixed an issue where <code>aspect-ratio</code> was not honored when the page was zoomed in. (174361289)</li>
<li>Fixed replaced elements to use the transferred size through intrinsic aspect ratio for min-content and max-content sizing. (174386310)</li>
<li>Fixed an issue where <code>height: 100%</code> on a child element altered the layout when the parent’s height was defined via <code>aspect-ratio</code>. (174448267)</li>
<li>Fixed margin collapse to be allowed when the preferred block size behaves as auto, per the CSS Sizing specification. (174547610)</li>
<li>Fixed an issue where <code>document.styleSheets</code> and <code>shadowRoot.styleSheets</code> incorrectly included adopted style sheets, which per the CSSOM specification should only appear in the final CSS style sheets list used for style resolution. (174583340)</li>
<li>Fixed the CSSOM preferred style sheet set name to be established at sheet creation time based on insertion order rather than tree order. (174586058)</li>
<li>Fixed highlight pseudo-elements such as <code>::selection</code> and <code>::highlight</code> to disallow vendor-prefixed properties, aligning with the CSS Pseudo-Elements specification. (174590593)</li>
<li>Fixed cycle detection and nested function call handling in CSS custom functions. (174609179)</li>
<li>Fixed <code>FontFace.loaded</code> to reject when a <code>local()</code> font source fails to load. (174631384)</li>
<li>Fixed an issue where <code>word-break: break-all</code> incorrectly allowed CJK close punctuation to appear at the start of a line. (174656971)</li>
<li>Fixed an issue where <code>word-break: keep-all</code> incorrectly suppressed line break opportunities at CJK punctuation characters. (174658701)</li>
<li>Fixed the <code>FontFace</code> constructor to reject with a <code>SyntaxError</code> instead of a <code>NetworkError</code> when a <code>BufferSource</code> fails to parse, per the CSS Font Loading specification. (174669738)</li>
<li>Fixed the <code>FontFace</code> <code>family</code> attribute to return the serialization of the parsed value. (174698351)</li>
<li>Fixed grid layout to correctly handle percentage and <code>calc()</code> values for the specified size suggestion. (174863227)</li>
<li>Fixed <code>:has()</code> sibling invalidation issues related to relation forwarding. (175006235)</li>
<li>Fixed an issue where <code>min-width: auto</code> was not correctly computed for flex items. (175157619)</li>
<li>Fixed an issue where percentage heights inside flex items did not resolve correctly in quirks mode. (175158571)</li>
<li>Fixed an issue where <code>margin-trim: block-start</code> did not apply to blocks nested inside inline boxes. (175162899)</li>
<li>Fixed an issue where dynamically changing <code>display: contents</code> on a <code>&lt;fieldset&gt;</code> legend caused incorrect rendering. (175163337)</li>
<li>Fixed: Improved <code>:has()</code> invalidation performance by including the full selector context in invalidation selectors. (175177078)</li>
<li>Fixed the CSS preload scanner to resolve relative <code>@import</code> URLs against the <code>&lt;base&gt;</code> element URL. (175305190)</li>
<li>Fixed <code>-webkit-box</code> flex distribution for children with orthogonal writing modes. (175323734)</li>
<li>Fixed <code>calc(infinity)</code> as a <code>flex-grow</code> factor not stretching a flex item to 100% width. (175431146)</li>
<li>Fixed <code>:has()</code> sibling invalidation failing due to an internal bitfield overflow, causing stale styles when siblings are added or removed. (175433733)</li>
<li>Fixed <code>:has()</code> invalidation for sibling combinators when elements are inserted or removed from the DOM. (175441568)</li>
<li>Fixed <code>transition-property</code> not preserving the specified case of <code>&lt;custom-ident&gt;</code> values during serialization. (175467206)</li>
<li>Fixed the <code>will-change</code> property not serializing correctly when used with non-property identifiers or identifiers in a non-standard case. (175482352)</li>
<li>Fixed percentage <code>top</code> and <code>bottom</code> values on relatively positioned elements not resolving when the containing block has <code>aspect-ratio</code>. (175502356)</li>
<li>Fixed: Updated the enhanced <code>&lt;select&gt;</code> element to use <code>self-</code> <em>keywords for anchor positioning. (175505107)</em> Fixed <code>text-indent</code> computation when tab stop positions are involved. (175529961)</li>
<li>Fixed <code>calc()</code> margin computations in flex layout. (175532405)</li>
<li>Fixed <code>calc()</code> margin computations for block, fieldset, and table caption layouts. (175548980)</li>
<li>Fixed handling of <code>&lt;li&gt;</code> <code>value</code> attributes in reversed ordered lists. (175558324)</li>
<li>Fixed CSS trigonometric functions to correctly convert degrees to radians. (175575617)</li>
<li>Fixed <code>sibling-index()</code> and <code>sibling-count()</code> inside calc() functions to be correctly simplified. (175590806)</li>
<li>Fixed <code>sibling-index()</code> and <code>sibling-count()</code>to correctly return 0 when used in cross-tree <code>::part()</code> styling. (175592607)</li>
<li>Fixed the CSS <code>resize</code> handle not working on an element when the handle overlaps a child iframe. (175621855)</li>
<li>Fixed flex container baseline alignment being incorrectly computed for scroll containers by clamping to the border edge. (175631095)</li>
<li>Fixed an issue where inline-level boxes with <code>calc()</code> margins or padding lost the fixed component during intrinsic width computation. (175669222)</li>
<li>Fixed floats with <code>margin-start</code> incorrectly overlapping adjacent floats. (175669464)</li>
<li>Fixed <code>aspect-ratio</code> calculations for block-level elements with size constraints. (175669713)</li>
<li>Fixed <code>aspect-ratio</code> calculations for flex items with percentage cross-size constraints. (175669774)</li>
<li>Fixed <code>aspect-ratio</code> calculations for flex items with definite cross-size values. (175690028)</li>
<li>Fixed <code>revert-layer</code> computing incorrectly when there is a leading empty or space substitution value. (175729680)</li>
<li>Fixed <code>:has()</code> invalidation incorrectly resetting sibling relation bits, causing style invalidation failures for first-in-sibling-chain elements. (175738008)</li>
<li>Fixed an issue where flex items with explicit <code>min-height: min-content</code> were incorrectly treated as scrollable, zeroing out their minimum size. (176173688)</li>
<li>Fixed <code>:has()</code> invalidation performance when used inside nested <code>:is()</code> selectors. (176354723)</li>
<li>Fixed <code>sibling-count()</code> &amp; <code>sibling-index()</code> used in <code>@keyframes</code> to re-resolve when siblings change. (176531901)</li>
<li>Fixed an issue with a collapsed border color mismatch when the table cell has a different writing-mode. (173655092)</li>
</ul>
<h2><a name="scroll-anchoring"></a>Scroll Anchoring</h2>
<p>Scroll anchoring is now supported in Safari 27 beta. When content is inserted or removed above the current viewport position — an image loads, an ad injects, a comment appears — the browser automatically adjusts the scroll position so the content you’re reading stays put instead of jumping.</p>
<p>This is an improvement you’ll feel on many sites, especially ones with lazy-loaded images, infinite-scroll feeds, or dynamically injected content. Most sites get this for free — no opt-in required.</p>
<p>Scroll anchoring is controlled by the <code>overflow-anchor</code> CSS property, which defaults to <code>auto</code>. If you have a specific element where you need to opt out of scroll anchoring, set <code>overflow-anchor: none</code>.</p>
<p class="codepen" data-height="500" data-pen-title="Scroll Anchoring" data-default-tab="result" data-slug-hash="PwbEYVX" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue on iOS where calling <code>scrollTo</code> during a momentum scroll incorrectly interrupted the scroll, ensuring that momentum scrolling continues as expected and smooth scrolling behaves properly. (41949531)</li>
<li>Fixed an issue on iOS where programmatic smooth scrolling with <code>scroll-snap-type: mandatory</code> failed after the browser chrome was hidden. (100727098)</li>
<li>Fixed an issue where interrupting scroll momentum caused the scrolling container to stop rendering and hit-testing to be misplaced. (116205365)</li>
<li>Fixed an issue on iOS where restored scroll position was incorrect after relaunching Safari. (127308062)</li>
<li>Fixed an issue where tabbing in a scroll container with <code>scroll-padding</code> did not scroll the focused element into view. (147513379)</li>
<li>Fixed an issue on macOS where custom CSS scrollbars could be cut off and the scrollbar corner rect was sized incorrectly. (168566468)</li>
<li>Fixed rubberbanding behaving incorrectly when a site triggers a smooth scroll to the top during a rubberband. (170705188)</li>
<li>Fixed an issue where pages could become blank and jump to the top after dynamically loading new content when scroll anchoring was enabled. (170889205)</li>
<li>Fixed an issue where scroll anchoring could cause pages to scroll to negative offsets. (171221075)</li>
<li>Fixed an issue where pages using the Navigation API could have offset hit test locations, making elements unclickable. (171752650)</li>
<li>Fixed an issue on iOS where composited layers would briefly flash blank when <code>window.scrollTo()</code> was called synchronously with a DOM layout change. (173197381)</li>
<li>Fixed an issue where sticky-positioned elements could flicker rapidly after scrolling. (173680821)</li>
<li>Fixed an issue where scroll anchoring could cause a page to scroll to the top or bottom automatically. (173885027)</li>
<li>Fixed an issue where calling <code>scrollIntoView()</code> on a scrollable element incorrectly scrolled the element’s own contents. (174173683)</li>
<li>Fixed scroll anchoring interfering with rubberbanding on some websites. (175195943)</li>
<li>Fixed an issue on iOS where scroll position was not preserved correctly when rotating the device on right-to-left pages. (175910769)</li>
</ul>
<h2><a name="html"></a>HTML</h2>
<h3><a name="sizesauto-on-img"></a>sizes=&#8221;auto&#8221; on img</h3>
<p>The <code>auto</code> keyword in the <code>sizes</code> attribute on <code>&lt;img&gt;</code> elements is now supported in Safari 27 beta.</p>
<pre><code class="html"><span class="tag">&lt;<span class="keyword">img</span> <span class="keyword attribute">src</span>=<span class="attribute value string">"photo.jpg"</span>
     <span class="keyword attribute">srcset</span>=<span class="attribute value string">"photo-400.jpg 400w, photo-800.jpg 800w, photo-1200.jpg 1200w"</span>
     <span class="keyword attribute">sizes</span>=<span class="attribute value string">"auto"</span>
     <span class="keyword attribute">loading</span>=<span class="attribute value string">"lazy"</span>
     <span class="keyword attribute">alt</span>=<span class="attribute value string">"A mountain landscape"</span>&gt;</span>
</code></pre>
<p>When an image uses <code>loading="lazy"</code> and you don’t know its rendered layout width ahead of time, <code>sizes="auto"</code> tells the browser to calculate the size automatically based on the actual layout width once it’s known. This makes responsive images work correctly for images inside layout containers with dynamic widths.</p>
<h3><a name="shadowrootslotassignment-attribute"></a>shadowrootslotassignment attribute</h3>
<p>Safari 27 beta adds support for the <code>shadowrootslotassignment</code> attribute on declarative shadow roots. This lets you configure the slot assignment mode (<code>named</code> or <code>manual</code>) directly in HTML when defining a shadow root declaratively, matching the JavaScript <code>attachShadow({ slotAssignment: "manual" })</code> option.</p>
<p class="codepen" data-height="500" data-pen-title="shadowrootslotassignment" data-default-tab="html,result" data-slug-hash="ogYpwJJ" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where an HTML <code>map</code> element without a <code>name</code> attribute did not match its associated image using the <code>id</code> attribute. (12359382)</li>
<li>Fixed sequential focus navigation to skip elements that do not meet the specification’s focusability requirements. (103370883)</li>
<li>Fixed viewport <code>&lt;meta&gt;</code> parsing to correctly treat form feed as ASCII whitespace per the HTML specification. (108440799)</li>
<li>Fixed parsing of <code>javascript:</code> URLs to align with the specification. (147612682)</li>
<li>Fixed an issue where a third nested <code>&lt;iframe&gt;</code> using the <code>srcdoc</code> attribute did not render. (167917471)</li>
<li>Fixed incorrect parsing of pixel-length margin attributes on <code>&lt;body&gt;</code>, <code>&lt;iframe&gt;</code>, and <code>&lt;frame&gt;</code> elements. (171240848)</li>
<li>Fixed an issue where <code>replaceWith()</code> stopped processing remaining nodes if a script in the replacement removed a sibling. (172753019)</li>
<li>Fixed an issue where HEIC images were incorrectly converted to JPEG when uploaded via drag-and-drop or file input. (173206598)</li>
<li>Fixed the HTML preload scanner to skip preloading stylesheets that have the <code>disabled</code> attribute. (173378582)</li>
<li>Fixed an issue where setting the <code>rel</code> attribute on an <code>&lt;a&gt;</code> element multiple times did not clear prior link relations. (173567839)</li>
<li>Fixed the HTML parser fast path to correctly process escaped attribute values longer than one character. (173673581)</li>
<li>Fixed the HTML parser fast path to correctly detect nested <code>&lt;li&gt;</code> elements. (173983892)</li>
<li>Fixed the HTML parser fast path to use the adjusted current node for MathML and SVG integration point checks. (174096305)</li>
<li>Fixed document named item collection to include all <code>&lt;object&gt;</code> elements, aligning with other browser engines. (174537345)</li>
<li>Fixed <code>window.open()</code> to correctly consume user activation when creating a new browsing context, aligning with the HTML specification. (174587258)</li>
<li>Fixed remaining issues with <code>&lt;img sizes="auto"&gt;</code> to fully align with the specification. (174684058)</li>
<li>Fixed an issue where <code>dir=auto</code> on <code>&lt;slot&gt;</code> elements did not update when slotted content changed. (174871706)</li>
<li>Fixed an issue where <code>&lt;option&gt;</code> elements rendered incorrectly when the <code>label</code> attribute was empty. (174979446)</li>
<li>Fixed an issue where the preload scanner incorrectly skipped <code>&lt;source&gt;</code> elements with an empty <code>type</code> attribute inside <code>&lt;picture&gt;</code>. (175094037)</li>
<li>Fixed <code>innerText</code> to emit a newline for empty <code>&lt;option&gt;</code> or <code>&lt;optgroup&gt;</code> inside <code>&lt;select&gt;</code>. (175245381)</li>
<li>Fixed HTML floating-point number parsing to correctly handle values with a leading <code>+</code> sign. (175300431)</li>
<li>Fixed <code>innerText</code> to no longer emit newlines for <code>visibility: hidden</code> block elements. (175569426)</li>
<li>Fixed <code>innerText</code> to correctly emit blank lines around <code>&lt;p&gt;</code> elements regardless of their CSS <code>display</code> value. (175729427)</li>
<li>Fixed the speculative preload scanner to no longer incorrectly preload scripts inside SVG elements. (175800116)</li>
<li>Fixed <code>innerText</code> on tables to no longer emit spurious trailing newlines and to preserve row-exit newlines after empty rows. (176635985)</li>
<li>Fixed an issue where inserting an image with a <code>srcset</code> attribute into a dynamically created iframe resulted in an invisible image. (66849050)</li>
<li>Fixed <code>naturalWidth</code> and <code>naturalHeight</code> returning incorrect values for SVG images without intrinsic dimensions. (141196049)</li>
<li>Fixed an issue where HDR images would flicker and lose their HDR appearance when overlapping layers animate. (163382580)</li>
<li>Fixed an issue where adopting a standalone <code>img</code> element did not update its image data. (172856773)</li>
</ul>
<h2><a name="javascript"></a>JavaScript</h2>
<h3><a name="top-level-await"></a>Top-Level Await</h3>
<p>Safari 27 beta includes a complete standards-compliant rewrite of the ECMAScript module (ESM) loader. The new loader is implemented in native C++ and conforms directly to the ECMAScript specification’s module loading algorithms, replacing an earlier implementation based on an abandoned 2016 WHATWG Loader proposal that predated top-level await entirely.</p>
<p>The rewrite fixes module execution ordering and initialization issues that could cause imports to access exports before they were fully evaluated. It was validated against test262, the Web Platform Tests, and additional test cases.</p>
<p>Top-level await is a foundational feature of modern JavaScript module authoring, and it’s been a real pain point in Safari for a while — a known source of cross-browser bugs that developers building module-based apps had to work around. This fix closes that gap.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed multiple top-level await correctness bugs with a rewrite of the ES module loader for standards compliance. (97370038)</li>
<li>Fixed regular expressions in Unicode mode to not count non-capturing groups and modifiers toward the number of available backreferences. (167746769)</li>
<li>Fixed <code>%TypedArray%.prototype.subarray</code> to calculate <code>beginByteOffset</code> correctly to align with ECMA-262. (168143600)</li>
<li>Fixed the trace behavior of <code>RegExp.prototype[Symbol.split]</code> to align with ECMA-262. (168288878)</li>
<li>Fixed <code>Array.prototype.concat</code> to correctly handle arrays with indexed accessors, preventing getter reentry from bypassing <code>Symbol.isConcatSpreadable</code> checks. (172237596)</li>
<li>Fixed an issue where a greedy or non-greedy non-BMP character class in a regular expression could advance the index past the end of input. (172978772)</li>
<li>Fixed an issue where class instance field initializers did not have the correct evaluation context when used inside arrow functions and nested scopes. (173296563)</li>
<li>Fixed TypedArray <code>[[Set]]</code> to check the receiver before writing to the typed array. (173386404)</li>
<li>Fixed <code>%ArrayIteratorPrototype%.next()</code> to return <code>{ done: true }</code> instead of throwing a <code>TypeError</code> when the source TypedArray is detached and the iterator has already completed. (173759106)</li>
<li>Fixed an issue where a fixed-count mixed-width character class in a regular expression did not correctly restore the index on backtrack. (173972458)</li>
<li>Fixed an issue where regular expressions with non-BMP characters could skip valid match positions when alternating between patterns. (174200307)</li>
<li>Fixed an issue where regular expression captures were not properly cleared when backtracking out of fixed-count parenthesized groups and negative lookaheads. (174201284)</li>
<li>Fixed an issue where <code>import { "*" as x }</code> was incorrectly treated as a namespace import instead of a named import using the string <code>“"</code> as a ModuleExportName. (174314099)</li>
<li>Fixed an issue where <code>RegExp.prototype.exec</code> and <code>RegExp.prototype.test</code> could match against a stale pattern if <code>lastIndex</code> has a <code>valueOf</code> that calls <code>RegExp.prototype.compile</code>. (174461752)</li>
<li>Fixed an issue where async functions using module-scoped variables could fail when the DFG JIT optimized scope resolution. (174626957)</li>
<li>Fixed an issue where <code>Intl.Segmenter</code> with <code>granularity: "word"</code> incorrectly reported <code>isWordLike: false</code> for numeric segments. (175057894)</li>
<li>Fixed <code>Object.defineProperties</code> to call Proxy traps in the correct order. (175068687)</li>
<li>Fixed an issue where <code>Intl.Locale</code> did not canonicalize before overriding the language. (175092327)</li>
<li>Fixed time zone identifiers to return primary IANA time zone IDs instead of legacy ICU identifiers. (175098682)</li>
<li>Fixed <code>Intl.DateTimeFormat</code> to preserve the original legacy timezone identifier instead of replacing it with the primary IANA ID. (175206605)</li>
<li>Fixed <code>Promise.prototype.finally</code> to throw a <code>TypeError</code> when <code>@@species</code> is not a constructor, matching the behavior of other browsers. (175290627)</li>
<li>Fixed the regular expression engine to reject dangling hyphens in character class syntax when using the <code>/v</code> flag. (175559808)</li>
<li>Fixed a performance issue with module resolution by limiting cache population to star-resolution and indirect-resolution cases. (175826413)</li>
<li>Fixed a performance issue with <code>TypedArray.prototype.lastIndexOf</code> by adding SIMD-accelerated reverse search for numeric types. (175904377)</li>
<li>Fixed a performance issue where building a module namespace with many <code>export</code><em>statements was significantly slower than necessary. (175949532)</em> Fixed <code>DataView</code> constructor to match specification-defined argument validation order and error throwing behavior. (176110210)</li>
<li>Fixed an issue where <code>Array.prototype.concat</code> could produce incorrect results when combining arrays with incompatible indexing types. (176219964)</li>
</ul>
<h2><a name="webassembly"></a>WebAssembly</h2>
<h3><a name="javascript-promise-integration-jspi"></a>JavaScript Promise Integration (JSPI)</h3>
<p>Safari 27 beta adds support for WebAssembly JavaScript Promise Integration (JSPI). JSPI lets synchronous-looking WebAssembly code suspend and wait for JavaScript Promises, making it much easier to port existing C, C++, Rust, and other language code to the web where that code expects synchronous I/O.</p>
<p>Before JSPI, porting code that called synchronous APIs to Wasm required rewriting everything on top of a callback or async state machine. With JSPI, the Wasm module can suspend at a call site and resume when the Promise resolves — the rest of the module sees straight-line synchronous code. This is a significant capability for the Wasm ecosystem.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed <code>WebAssembly.Suspending</code> and <code>WebAssembly.SuspendError</code> to be data properties instead of getter functions, aligning with other WebAssembly attributes like <code>WebAssembly.Module</code>. (170155726)</li>
<li>Fixed incorrect <code>IntegerOverflow</code> exceptions thrown by <code>i32.rem_s</code>, <code>i64.rem_s</code>, <code>i32.div_u</code>, <code>i64.div_u</code>, <code>i32.rem_u</code>, and <code>i64.rem_u</code> when both operands are constants. (175122462)</li>
<li>Fixed a regression where <code>RegisterSet::normalizeWidths()</code> lost vector-width information, causing v128 argument corruption in WebAssembly SIMD thunks. (176035764)</li>
</ul>
<h2><a name="mathml"></a>MathML</h2>
<h3><a name="multiple-character-operators-in-mathml"></a>Multiple-character operators in MathML</h3>
<p>Safari 27 beta now supports multiple-character operators in MathML, improving the rendering of complex mathematical notation that uses operators like <code>++</code>, <code>:=</code>, <code>/=</code>, and similar. We also updated operator dictionary to MathML Core, so that we also support multi-character, combining character, and updated operator dictionary.</p>
<h3><a name="tabindex-focus-blur-and-autofocus-on-mathml"></a>tabindex, focus(), blur(), and autofocus on MathML</h3>
<p>Safari 27 beta now supports  <code>tabindex</code>, <code>focus()</code>, <code>blur()</code>, and <code>autofocus</code> on MathML elements, improving MathML feature parity’s with HTML. This makes math content fully participate in keyboard navigation and focus management, which supports interactive educational content and accessibility.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where symmetric non-stretchy large operators were not centered around the math axis. (170905663)</li>
<li>Fixed an issue where dynamic changes to <code>&lt;mo&gt;</code> element attributes did not trigger a relayout. (170907029)</li>
<li>Fixed an issue where <code>minsize</code> and <code>maxsize</code> defaults and percentages did not use the unstretched size as specified. (170908253)</li>
<li>Fixed positioning of the <code>&lt;mprescripts&gt;</code> element within <code>&lt;mmultiscripts&gt;</code> layout. (170909975)</li>
<li>Fixed an issue where the MathML fraction bar was not painted when its thickness was equal to its width. (170934351)</li>
<li>Fixed an issue where <code>&lt;none&gt;</code> and <code>&lt;mprescripts&gt;</code> elements were not laid out as <code>&lt;mrow&gt;</code> elements in MathML. (170940035)</li>
<li>Fixed an issue where MathML token elements ignored <code>-webkit-text-fill-color</code> when painting math variant glyphs. (172020318)</li>
<li>Fixed <code>padding</code> and <code>border</code> rendering on <code>&lt;msqrt&gt;</code> and <code>&lt;mroot&gt;</code> elements and corrected token sizing for <code>mathvariant</code>. (173081436)</li>
<li>Fixed absolute positioning of elements inside MathML by ensuring logical height is updated. (173088146)</li>
<li>Fixed <code>tabIndex</code> values not being set correctly for MathML elements. (174734133)</li>
</ul>
<h2><a name="spatial-web"></a>Spatial Web</h2>
<h3><a name="immersive-website-environments-in-visionos"></a>Immersive website environments in visionOS</h3>
<figure><picture><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/web-env.png" alt="Illustration of woman wearing VisionPro standing in field facing screen." width="1920" height="1080" class="preserve-color aligncenter size-full wp-image-17357" /></picture></figure>
<p>Safari 27 beta in visionOS 27 adds support for immersive website environments. Developers can now provide incredible immersive experiences with a simple <code>&lt;model&gt;</code> element and one JavaScript API call. The Immersive API on the model element works similarly to how the Fullscreen API does on video elements. Learn more in the WWDC26 session <a href="https://developer.apple.com/videos/play/wwdc2026/320/">Explore immersive website environments in visionOS</a>.</p>
<p>Consider what this makes possible in a browser: a ticketing site where you can see the view from your seat before you buy, or a hotel that lets you walk the room, all built with standard web technology, no app required.</p>
<figure><picture><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/web-env2.png" alt="First person view of sitting in a virtual theater seat looking at a browser on the right and the stage to the left." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<h3><a name="img-controls-on-spatial-and-panorama-photos"></a>img controls on spatial and panorama photos</h3>
<p>Safari 27 beta in visionOS 27 adds support for the <code>controls</code> attribute on <code>&lt;img&gt;</code> elements displaying spatial and panorama photos. When applied, the image gets native interactive controls appropriate for the content type, allowing the image to be viewed spatially or immersively wrapped around the user.</p>
<figure><picture><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/pasted-movie.png" alt="Photo of valley surrounded by mountains, an open cloudy sky, and a lake towards the right center." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<h3><a name="model-on-ios-ipados-and-macos"></a>model on iOS, iPadOS, and macOS</h3>
<p>The <code>&lt;model&gt;</code> HTML element is now available in Safari on iOS, iPadOS, and macOS, joining its existing availability in visionOS. Web developers can now embed interactive 3D content using standard HTML across Apple platforms.</p>
<pre><code class="html"><span class="tag">&lt;<span class="keyword">model</span> <span class="keyword attribute">src</span>=<span class="attribute value string">"teapot.usdz"</span>&gt;</span><span class="tag">&lt;/<span class="keyword">model</span>&gt;</span>
</code></pre>
<p>Learn more in the WWDC26 session <a href="https://developer.apple.com/videos/play/wwdc2026/215/">Get started with the HTML Model Element</a>.</p>
<figure><picture><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/image-4-1-scaled.png" alt="An iPad, desktop, and an iPhone each displaying a browser showing an image of a 3D hiking boot model." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<h3><a name="dynamic-range-limit-on-model"></a>dynamic-range-limit on model</h3>
<p>Safari 27 beta adds support for <code>dynamic-range-limit</code> on the <code>&lt;model&gt;</code> element, giving you control over the HDR rendering range for 3D content in iOS and macOS.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed spatial and panoramic image controls to support RTL language layout and localization of type labels. (161690817)</li>
<li>Fixed <code>&lt;model&gt;</code> elements displaying at 100x the expected size for assets authored in tools that use centimeter units. (167805672)</li>
<li>Fixed an issue where WebXR viewports did not get an initial value until <code>getViewport()</code> was called. (168125694)</li>
<li>Fixed an issue where the <code>&lt;model&gt;</code> element stagemode orbit physics behaved differently between iOS and visionOS. (172189776)</li>
<li>Fixed an issue on visionOS where fullscreen video would sometimes jump when exiting fullscreen if the browser window was narrower than the video. (174454557)</li>
</ul>
<h2><a name="webgpu"></a>WebGPU</h2>
<p>Safari 27 beta now supports the <code>clip_distances</code> built-in value in WGSL shaders. Clip distances are a WebGPU feature that allows vertex shaders to define custom clipping planes, enabling you to discard geometry on one side of an arbitrary plane before rasterization occurs.</p>
<p class="codepen" data-height="500" data-pen-title="WebGPU clip_distances (by Mike Wyrzykowski)" data-default-tab="result" data-slug-hash="raWpdLj" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed <code>compressedTexImage</code> not validating whether the compressed texture format extension has been enabled. (175652171)</li>
<li>Fixed some <code>texImage</code> functions reporting errors with incorrect function names. (175652807)</li>
<li>Fixed some WebGL context state properties not being correctly reset on context loss. (176190808)</li>
<li>Fixed <code>GPUDevice.onuncapturederror</code> event handler attribute not working. (149577124)</li>
<li>Fixed: Restored <code>maxStorageBuffersInFragmentStage</code> and related WebGPU limits. (160800947)</li>
<li>Fixed rendering failing when using direct <code>GPUTexture</code> objects instead of <code>GPUTextureView</code> with multisampled resolve targets in render passes. (175452924)</li>
</ul>
<h2><a name="media"></a>Media</h2>
<h3><a name="texttrackcue-endtime-infinity"></a>TextTrackCue.endTime = Infinity</h3>
<p>Safari 27 beta supports setting <code>TextTrackCue.endTime</code> to <code>Infinity</code> to represent an unbounded cue duration. It’s useful for captions or data cues of live streams.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where decoding WebM audio files with more than two channels would fail. (82160691)</li>
<li>Fixed an issue where <code>preservesPitch</code> and <code>playbackRate</code> were not correctly handled on an <code>HTMLMediaElement</code> connected to an <code>AudioContext</code> via <code>createMediaElementSource</code>. (93275149)</li>
<li>Fixed <code>MediaCapabilities.decodingInfo()</code> incorrectly reporting VP8 in WebM as not supported. (127339546)</li>
<li>Fixed an issue on iPad where exiting fullscreen on a media document incorrectly navigated back to the previous page instead of returning to the inline view. (137220651)</li>
<li>Fixed an issue where the WebCodecs <code>VideoDecoder</code> API output frames in an incorrect order for videos containing B-frames. (145093697)</li>
<li>Fixed an issue where the darkening overlay on inline video controls made accurate scrubbing difficult and displayed video content incorrectly on macOS. (161271114)</li>
<li>Fixed an issue where WebM with VP9/Vorbis fallback would not play. (164053503)</li>
<li>Fixed video playback failing when the declared MIME type in a <code>&lt;source&gt;</code> element does not match the actual content type served by the server. (166181001)</li>
<li>Fixed an issue where text selection was broken after pausing a video when the media player ran in the content process. (167727538)</li>
<li>Fixed <code>HTMLMediaElement.currentTime</code> to report smoothly progressing values instead of updating only at fixed intervals. (170115677)</li>
<li>Fixed an issue where MP4 files containing Opus audio tracks could not be decoded with <code>decodeAudioData</code>. (170196423)</li>
<li>Fixed an issue where the <code>VideoFrame</code> constructor did not handle the video color range correctly for NV12 (I420 BT601) video frames. (170299037)</li>
<li>Fixed an issue where Live Text selection was unavailable on paused fullscreen videos. (170817667)</li>
<li>Fixed an issue where FairPlay-protected VP9 content failed to play via <code>MediaSource</code>. (171210968)</li>
<li>Fixed an issue where autoplay would proceed before default text tracks finished loading. (171699293)</li>
<li>Fixed the <code>currentTime</code> getter to return <code>defaultPlaybackStartPosition</code> when no media player exists. (171722368)</li>
<li>Fixed <code>HTMLMediaElement</code> to fire a <code>timeupdate</code> event when resetting the playback position during media load as required by the specification. (171785463)</li>
<li>Fixed an issue where the media player <code>preload</code> attribute was not properly updated when the <code>autoplay</code> attribute was set. (171883159)</li>
<li>Fixed an issue where seeking in a WebM video did not work correctly while content was still loading. (172473039)</li>
<li>Fixed an issue where media playback could not move to the next item in a playlist when the tab was in the background. (172676372)</li>
<li>Fixed an issue where scrubbing a video in full-screen mode could cause it to exit full-screen. (172682230)</li>
<li>Fixed an issue where HDR video content appeared washed out due to colorspace information being lost during processing. (172721079)</li>
<li>Fixed Encrypted Media Extensions to check support for the full content type including codecs, rather than only the MIME type. (173852931)</li>
<li>Fixed an issue where setting <code>HTMLMediaElement.volume</code> had no effect when the element was connected to an <code>AudioContext</code>. (174278899)</li>
<li>Fixed <code>ImageCapture</code> to correctly queue <code>takePhoto()</code> and <code>applyConstraints()</code> requests to avoid concurrent capture session reconfiguration. (174950018)</li>
<li>Fixed a regression where videos would stop playing and lose audio after a few seconds on some websites. (174966899)</li>
<li>Fixed an issue where U+0000 (NULL) characters were not allowed in <code>VTTCue</code> text content. (175084171)</li>
<li>Fixed video content disappearing after switching to another tab and back. (175257980)</li>
<li>Fixed WebVTT cue settings line parsing failures. (175296476)</li>
<li>Fixed <code>::cue()</code> selectors to correctly match the WebVTT root object in addition to child nodes. (175550173)</li>
<li>Fixed <code>currentTime</code> on iOS to update more frequently during media playback. (175774587)</li>
<li>Fixed Media Source Extensions <code>readyState</code> not being updated immediately when playback stalls due to a gap in buffered data. (176330683)</li>
</ul>
<h2><a name="web-api"></a>Web API</h2>
<h3><a name="service-worker-static-routing-api"></a>Service Worker static routing API</h3>
<p>Safari 27 beta adds support for the <a href="https://www.w3.org/TR/service-workers/#register-router-method">Service Worker static routing API</a>. This lets a service worker declare routing rules that the browser can use to bypass the service worker entirely for certain requests, reducing overhead for high-performance PWAs.</p>
<h3><a name="dedicated-workers-inside-shared-workers"></a>Dedicated workers inside shared workers</h3>
<p>Safari 27 beta adds support for creating dedicated workers inside shared workers, per the HTML Standard.</p>
<h3><a name="readablestream-improvements"></a>ReadableStream  improvements</h3>
<p>Safari 27 beta adds three improvements to <code>ReadableStream</code>:</p>
<ul>
<li>async iteration with <code>for await...of</code></li>
</ul>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">response</span> <span class="operator">=</span> <span class="identifier">await</span> <span class="identifier">fetch</span>(<span class="string">"/data"</span>);
<span class="keyword control">for</span> <span class="identifier">await</span> (<span class="keyword type">const</span> <span class="identifier">chunk</span> <span class="keyword operator">of</span> <span class="identifier">response</span>.<span class="identifier">body</span>) {
  <span class="identifier">process</span>(<span class="identifier">chunk</span>);
}
</code></pre>
<ul>
<li>the <code>ReadableStream.from()</code> static method for creating a stream from any async iterable or iterable</li>
</ul>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">vegetables</span> <span class="operator">=</span> [<span class="string">"Carrot"</span>, <span class="string">"Broccoli"</span>, <span class="string">"Tomato"</span>, <span class="string">"Spinach"</span>];
<span class="keyword type">const</span> <span class="identifier">asyncIterator</span> <span class="operator">=</span> (<span class="identifier">async</span> <span class="keyword type">function</span><span class="operator">*</span> () {
  <span class="identifier">yield</span> <span class="number">1</span>;
  <span class="identifier">yield</span> <span class="number">2</span>;
  <span class="identifier">yield</span> <span class="number">3</span>;
})();

<span class="comment">// Create ReadableStream from the array
</span><span class="keyword type">const</span> <span class="identifier">myReadableStream</span> <span class="operator">=</span> <span class="identifier">ReadableStream</span>.<span class="identifier">from</span>(<span class="identifier">vegetables</span>);

<span class="comment">// Create ReadableStream from async iterator
</span><span class="keyword type">const</span> <span class="identifier">asyncReadableStream</span> <span class="operator">=</span> <span class="identifier">ReadableStream</span>.<span class="identifier">from</span>(<span class="identifier">asyncIterator</span>);

</code></pre>
<ul>
<li>the ability to transfer a <code>ReadableStream</code> , <code>WritableStream</code> and <code>TransformStream</code> across contexts via <code>postMessage()</code></li>
</ul>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed the parent window’s <code>history.state</code> being set to <code>null</code> when <code>history.pushState</code> is called from a child iframe. (50019069)</li>
<li>Fixed clicking on a scrollbar of an overflow container blurring the current <code>activeElement</code>. (92367314)</li>
<li>Fixed an issue where the <code>change</code> event was not fired on <code>&lt;input&gt;</code> and <code>&lt;textarea&gt;</code> elements when they lost focus while another application was in the foreground. (98526540)</li>
<li>Fixed Web IDL bindings to correctly reject <code>SharedArrayBuffer</code> where <code>[AllowShared]</code> is not specified. (107786134)</li>
<li>Fixed Content Security Policy to only recognize ASCII whitespace excluding vertical tabs to align with the specification. (108559413)</li>
<li>Fixed emoji input on Google Docs and similar web applications by supressing keypress events for supplementary characters. (122678873)</li>
<li>Fixed an issue where <code>MouseEvent.offsetX</code> and <code>MouseEvent.offsetY</code> were not relative to the padding edge as specified. (125763807)</li>
<li>Fixed an issue on visionOS where the <code>gamepadconnected</code> event did not fire unless gamepad permission had already been granted. (141623162)</li>
<li>Fixed an issue where <code>CSPViolationReportBody</code> did not include the source line number in Content Security Policy violation reports. (152607402)</li>
<li>Fixed an issue where selecting credentials in the Digital Credentials API sometimes required a second click to trigger verification. (163295172)</li>
<li>Fixed window bar visibility properties (<code>toolbar.visible</code>, <code>statusbar.visible</code>, <code>menubar.visible</code>) to return static values per the HTML specification for privacy and interoperability. (166554327)</li>
<li>Fixed handling of unknown <code>DigitalCredential</code> protocols by gracefully filtering them out and showing a console warning instead of throwing an error. (166673454)</li>
<li>Fixed: Updated the Digital Credentials API to rename <code>DigitalCredentialRequest</code> to <code>DigitalCredentialGetRequest</code> per the latest specification. (167115220)</li>
<li>Fixed an issue where Service Worker routes were not matched when no fetch event handler was set. (167753466)</li>
<li>Fixed spec conformance issues in the Streams API piping and abort behavior. (167841090)</li>
<li>Fixed Service Worker static routing rules to enforce limitation checks as required by the specification. (167977145)</li>
<li>Fixed <code>layerX</code> and <code>layerY</code> to return correct values with CSS transforms. (168968832)</li>
<li>Fixed <code>location.ancestorOrigins</code> returning stale origins after an iframe is removed from the document. (169097730)</li>
<li>Fixed <code>NavigateEvent.canIntercept</code> to correctly return <code>false</code> when navigating to a URL with a different port, aligning with the Navigation API specification. (169845691)</li>
<li>Fixed <code>NavigateEvent.navigationType</code> to return <code>"replace"</code> when navigating to a URL that matches the active document’s URL. (169999046)</li>
<li>Fixed an issue where the <code>dragend</code> event had incorrect coordinates when dragging within a nested <code>&lt;iframe&gt;</code>. (170750013)</li>
<li>Fixed an issue where <code>navigation.currentEntry.key</code> did not change in private browsing windows after calling history.pushState(). (171147417)</li>
<li>Fixed an issue where touch event properties values were sometimes swapped with neighboring values. (171567543)</li>
<li>Fixed a performance issue where <code>ResizeObserver</code> callbacks became increasingly sluggish over time. (172718139)</li>
<li>Fixed a performance issue where <code>IntersectionObserver</code> became sluggish over time when observing many elements due to O(n²) iteration. (172727210)</li>
<li>Fixed an issue where <code>navigation.currentEntry.id</code> did not change in private browsing windows after calling <code>history.replaceState()</code>. (172897962)</li>
<li>Fixed an issue where <code>document.open()</code> incorrectly aliased the caller’s security origin. (173369038)</li>
<li>Fixed an issue where <code>history.replaceState()</code> on a traversed history entry incorrectly changed <code>navigation.currentEntry.key</code> to a new UUID instead of preserving the original key. (173388766)</li>
<li>Fixed an issue where <code>Object.prototype</code> could not be serialized by <code>structuredClone()</code>. (173728983)</li>
<li>Fixed an issue where backslashes were not handled correctly in non-special URLs. (173757759)</li>
<li>Fixed a URL parsing bug in the special relative or authority state. (173772241)</li>
<li>Fixed an issue where event listener <code>once</code> and <code>passive</code> flags were not preserved when copying listeners between elements. (173834642)</li>
<li>Fixed: Preserved existing listener options (such as passive defaulting) when overwriting event handler attributes. (173842822)</li>
<li>Fixed the Credential Management API to properly define which credential types are allowed in the same <code>get()</code> request. (173918198)</li>
<li>Fixed an issue where <code>event.target</code> was not set after dispatching an event in a shadow tree with no listeners. (174136382)</li>
<li>Fixed an issue where <code>navigator.credentials.create()</code> and <code>navigator.credentials.get()</code> discarded the <code>AbortSignal</code> reason and always rejected with a generic <code>AbortError</code>. (174220589)</li>
<li>Fixed <code>Range.extractContents()</code> to not extract out-of-bounds nodes when the end container is removed during extraction. (174307275)</li>
<li>Fixed <code>document.createEvent()</code> to throw an exception for <code>"MutationEvents"</code>, <code>"MutationEvent"</code>, <code>"PopStateEvent"</code>, and <code>"WheelEvent"</code>, aligning with other browser engines. (174339775)</li>
<li>Fixed <code>ParentNode.append()</code> to correctly de-duplicate nodes when the same node is passed multiple times. (174365465)</li>
<li>Fixed an issue where <code>MutationObserver</code> delivered <code>childList</code> records in the wrong order when script ran during node insertion. (174368989)</li>
<li>Fixed an issue where setting a <code>URL</code> object’s <code>port</code> property to whitespace behaved incorrectly. (174484035)</li>
<li>Fixed a missing <code>return</code> in the Navigation API’s <code>performTraversal</code> that caused incorrect behavior when traversing to an unknown key. (174513305)</li>
<li>Fixed <code>Blob.slice()</code> to correctly clamp fractional <code>start</code> and <code>end</code> parameters using round-half-to-even rounding per the File API specification, which may change how edge-case fractional values like <code>0.5</code> are rounded. (174555334)</li>
<li>Fixed <code>postMessage()</code> to validate transferable object states after serialization, aligning with the HTML specification. (174558047)</li>
<li>Fixed <code>structuredClone()</code> and <code>window.postMessage()</code> to correctly throw a <code>DataCloneError</code> when serializing a <code>SharedArrayBuffer</code> outside of cross-origin isolated contexts. (174562553)</li>
<li>Fixed an issue where calling <code>Element.blur()</code> on an <code>&lt;iframe&gt;</code> did not reset <code>document.activeElement</code> to <code>&lt;body&gt;</code>. (174591529)</li>
<li>Fixed <code>document.styleSheets</code> to be accessible on documents created by <code>DOMParser</code>. (174625774)</li>
<li>Fixed <code>innerText</code> getter to correctly handle trailing newlines and blank lines for <code>&lt;p&gt;</code> elements and headings. (174642704)</li>
<li>Fixed <code>innerText</code> whitespace handling at inline-block boundaries. (174713114)</li>
<li>Fixed <code>XMLSerializer</code> namespace handling to correctly serialize elements with namespace prefixes. (174726401)</li>
<li>Fixed the <code>innerText</code> getter to preserve newlines for elements with <code>white-space: pre-line</code>. (174727341)</li>
<li>Fixed service worker registrations to be unregistered when the main script is missing. (174755909)</li>
<li>Fixed <code>innerText</code> handling of replaced elements at block boundaries. (174816319)</li>
<li>Fixed <code>EventSource</code> to be closed when <code>window.stop()</code> is called. (174830925)</li>
<li>Fixed service worker registrations to be unregistered when failing to retrieve stored imported scripts. (174833692)</li>
<li>Fixed calling <code>preventDefault()</code> during a <code>pointerdown</code> event to correctly suppress <code>mousedown</code> and <code>mouseup</code> events on iOS. (174864309)</li>
<li>Fixed innerText<code>to not fall back to</code>textContent<code>for elements with</code>display: contents`. (174883499)</li>
<li>Fixed <code>innerText</code> to preserve the contents of <code>&lt;option&gt;</code> elements inside <code>&lt;select&gt;</code>. (175006854)</li>
<li>Fixed <code>Element.innerText</code> to collect option text when called directly on a <code>&lt;select&gt;</code> element. (175156630)</li>
<li>Fixed worker scripts to always be decoded as UTF-8, as per the specification. (175327455)</li>
<li>Fixed an issue where an <code>Event</code> object’s <code>target</code> property could lose its JavaScript wrapper due to premature garbage collection. (175439759)</li>
<li>Fixed an issue where ancestors of <code>TreeWalker.currentNode</code> could be prematurely garbage collected. (175442228)</li>
<li>Fixed <code>FileSystemDirectoryHandle.resolve()</code> to return the correct path array for child entries. (175645387)</li>
<li>Fixed <code>PerformanceNavigationTiming.domInteractive</code> and <code>domContentLoadedEventEnd</code> incorrectly returning 0 instead of the correct timestamps. (175739835)</li>
<li>Fixed <code>FileSystemDirectoryHandle.removeEntry()</code> to correctly remove entries. (175745157)</li>
<li>Fixed <code>CryptoKey</code> to correctly remain associated with its secure context. (176157712)</li>
<li>Fixed: Improved cross-origin isolation enforcement for workers. (176175488)</li>
<li>Fixed <code>SharedArrayBuffer</code> cloning and agent cluster ID assignment. (176465817)</li>
</ul>
<h2><a name="rendering"></a>Rendering</h2>
<h3><a name="srgb-linear-and-display-p3-linear"></a>srgb-linear and display-p3-linear</h3>
<p>Safari 27 beta adds <code>srgb-linear</code> and <code>display-p3-linear</code> to predefined color spaces, making these linear-light color spaces available in Canvas, WebGL, and other APIs.</p>
<p class="codepen" data-height="500" data-pen-title="Canvas color spaces" data-default-tab="result" data-slug-hash="myOpdXZ" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="subpixel-inline-layout"></a>Subpixel inline layout</h3>
<p>Subpixel inline layout is now available in Safari 27 beta. Text and inline elements can now be positioned with device-pixel precision, improving layout accuracy in block direction.</p>
<p>You don’t need to do anything to benefit. Layout engines have been moving in this direction for years; Safari 27 brings inline layout up to that bar.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where a 2D canvas element unnecessarily forced a compositing layer. (172864747)</li>
<li>Fixed an issue where table cells with <code>rowspan</code> values exceeding the actual number of rows were incorrectly computing heights. (3209126)</li>
<li>Fixed an issue where <code>::first-letter</code> styles caused <code>Range.getClientRects()</code> and <code>Range.getBoundingClientRect()</code> to return incorrect dimensions. (71546397)</li>
<li>Fixed incorrect distributed height in table rows when a <code>&lt;td&gt;</code> element has an explicit height set. (78549188)</li>
<li>Fixed an issue where U+2028 LINE SEPARATOR was not rendered as a forced line break. (88470339)</li>
<li>Fixed an issue where a block formatting context with <code>margin-start</code> could overlap an adjacent float. (93187697)</li>
<li>Fixed <code>position: relative</code> on table rows (<code>&lt;tr&gt;</code>) to correctly establish a containing block for absolutely positioned descendants. (94294819)</li>
<li>Fixed <code>&lt;marquee&gt;</code> elements causing incorrect table width calculations. (99826593)</li>
<li>Fixed boxes in the top layer to use the initial containing block as their static-position rectangle. (155495104)</li>
<li>Fixed an issue where a flex item containing a percentage-height image did not shrink correctly around the image. (156902823)</li>
<li>Fixed an issue where form controls with <code>height: 100%</code> in auto-height containers incorrectly resolved to zero height. (161699543)</li>
<li>Fixed incorrect box sizing on inline elements when they have no siblings and their <code>padding-left</code> plus <code>margin-left</code> equals zero. (162376969)</li>
<li>Fixed a regression where an element inside an iframe gaining its own compositing layer could cause an iframe’s semi-transparent background to appear darker.(163509267)</li>
<li>Fixed an issue where space-taking scrollbars did not trigger a proper re-layout when the box size depends on content size. (166836126)</li>
<li>Fixed an issue where View Transition snapshots were incorrectly stored in sRGB, causing rendering issues with non-sRGB colors. (167634138)</li>
<li>Fixed an issue where font subpixel quantization was unnecessarily disabled in some cases, improving text rendering quality. (168088611)</li>
<li>Fixed table layout to properly handle <code>visibility: collapse</code> on columns. (168556786)</li>
<li>Fixed intrinsic sizing for absolutely positioned replaced elements. (168815514)</li>
<li>Fixed text being incorrectly truncated in RTL containers when combined with <code>text-overflow: ellipsis</code> and an <code>inline-block</code> pseudo-element. (168875614)</li>
<li>Fixed percentage padding in table cells to resolve against column widths. (168940907)</li>
<li>Fixed a regression where hovering over elements could leave repaint artifacts on the page. (169112402)</li>
<li>Fixed table height distribution to apply to tbody sections instead of only the first section. (169154677)</li>
<li>Fixed an issue where table sections with explicit heights did not properly constrain and distribute space among contained rows. (169235210)</li>
<li>Fixed an issue where images with <code>min-width: fit-content</code> rendered at an incorrect width. (169359566)</li>
<li>Fixed an issue where <code>height: 100%</code> was incorrectly calculated for replaced elements like images serving as grid items nested inside a flexbox. (169431440)</li>
<li>Fixed an issue where images were incorrectly stretched in certain page layouts. (170270187)</li>
<li>Fixed an issue where Find in Page scrolled to the wrong location when matching text inside elements with <code>user-select: none</code>. (170477571)</li>
<li>Fixed the baseline calculation for <code>inline-block</code> elements so that when <code>overflow</code> is not <code>visible</code>, the baseline is correctly set to the bottom margin edge. (170575015)</li>
<li>Fixed an issue where replaced elements did not correctly apply <code>min-height</code> and <code>min-width</code> constraints in certain configurations. (170765025)</li>
<li>Fixed an issue where overlay backgrounds would briefly dim incorrectly when de-compositing in a scrollable container. (171024685)</li>
<li>Fixed a regression where sticky-positioned elements inside overflow containers could appear in front of content that should overlap them. (171179878)</li>
<li>Fixed an issue where auto table layout did not honor <code>max-width</code> on table cells when distributing width between them. (171459245)</li>
<li>Fixed an issue where <code>border-spacing</code> incorrectly included collapsed columns in auto table layout calculations. (171468102)</li>
<li>Fixed an issue where percentage-height children of table cells with unresolvable percentage heights were not sized intrinsically. (171469500)</li>
<li>Fixed an issue where cell backgrounds in collapsed-border tables extended into adjacent cells’ border space at table edges. (172068907)</li>
<li>Fixed an issue where if a document in an iframe uses <code>@prefers-color-scheme</code>, it does not follow the <code>color-scheme</code> set by grandparents of the iframe. (172229372)</li>
<li>Fixed an issue where list item margins were computed incorrectly when the page was zoomed in or out. (172312498)</li>
<li>Fixed an issue where <code>about:blank</code> iframes did not always have a transparent background. (172400258)</li>
<li>Fixed an issue where a right-floated table could overlap another table. (172655655)</li>
<li>Fixed an issue where grid containers failed to avoid float boxes. (172655720)</li>
<li>Fixed an issue where an anonymous block created for list markers was not properly collapsed when block content prevented line-box parenting. (172686060)</li>
<li>Fixed an issue where checkboxes could overlap with adjacent text. (172741572)</li>
<li>Fixed an issue where checkbox outlines appeared misaligned. (172742551)</li>
<li>Fixed an issue where list markers rendered on the wrong line when list items started with empty inline elements. (172762578)</li>
<li>Fixed an issue where U+2029 PARAGRAPH SEPARATOR was not treated as a forced line break. (173106856)</li>
<li>Fixed an issue where tiles were missing after navigating back in history. (173288233)</li>
<li>Fixed an issue where view transition snapshots could capture stale transform values for accelerated CSS transform animations. (173323193)</li>
<li>Fixed an issue with outside list markers when blockification prevents line-box parenting. (173417560)</li>
<li>Fixed a regression where nested empty inline boxes accumulated an incorrect vertical offset, causing inline elements to stack as block-level elements. (173723162)</li>
<li>Fixed an issue where pseudo-elements were incorrectly included in outline rect collection. (174033087)</li>
<li>Fixed an inverted Y-axis comparison that could cause incorrect caret positioning. (174144220)</li>
<li>Fixed an issue where <code>&lt;br&gt;</code> elements with <code>line-height: 0</code> still created extra vertical space, failing to respect the declared line height. (174400946)</li>
<li>Fixed auto outlines to more closely follow the border radii of elements. (174466854)</li>
<li>Fixed how gradients are renderer to improve performance. (174880197)</li>
<li>Fixed <code>image-orientation</code> being ignored for <code>background-image</code>, <code>border-image</code>, and <code>list-style-image</code>. (174894122)</li>
<li>Fixed a <code>white-space: pre-wrap</code> layout issue with justified text. (174937310)</li>
<li>Fixed an issue where minimum height was not correctly computed for flex items. (174999995)</li>
<li>Fixed an issue with <code>flex-wrap</code> and flex factor computation for wrapping flex items. (175012395)</li>
<li>Fixed vertical <code>writing-mode</code> content incorrectly wrapping when the parent has <code>auto</code> height. (175123356)</li>
<li>Fixed minimum height calculation for flex items. (175195518)</li>
<li>Fixed incorrect bounding box position for newline characters. (175243361)</li>
<li>Fixed an issue where a child element with <code>filter: blur()</code> ignored <code>border-radius</code> overflow clipping from its parent. (175519148)</li>
<li>Fixed an issue where absolutely positioned tables with content exceeding their declared width were incorrectly positioned. (175755871)</li>
<li>Fixed height calculations for absolutely positioned tables with percentage-sized children. (175762381)</li>
<li>Fixed an issue where containers with block-in-inline content did not expand when <code>max-height</code> was removed. (175799547)</li>
<li>Fixed an issue where absolutely positioned tables with explicit percentage or fixed heights did not resolve correctly against their containing block. (175852400)</li>
<li>Fixed always-on scrollbar thumbs not rendering on the root element of nested documents with <code>display: flex</code>. (175866046)</li>
<li>Fixed absolutely positioned tables ignoring <code>min-height</code> and shrinking below their content height. (175883577)</li>
<li>Fixed absolutely positioned tables ignoring <code>max-height</code> constraints. (175932457)</li>
<li>Fixed <code>scrollbar-gutter</code> placement on the root element in RTL layouts. (175939512)</li>
<li>Fixed an issue where a flex item with <code>aspect-ratio</code> and <code>content-box</code> padding computed the wrong height in a column flex container. (176033726)</li>
<li>Fixed an issue where block-level boxes nested within inline elements were not properly aligned when using <code>align-content: center</code>. (176173122)</li>
<li>Fixed intrinsic sizing for non-replaced elements with percentage dimensions. (176493856)</li>
<li>Fixed an issue where panning a zoomed-in PDF on iOS would frequently rubber band back to the starting position. (156854435)</li>
</ul>
<h2><a name="webrtc"></a>WebRTC</h2>
<p>Safari 27 beta adds support for the <code>targetLatency</code> attribute in WebRTC, for specifying a target latency on a receiver. It adds support for the <code>RTCRtpCodec</code> dictionary and related constructs, improving the ability to inspect and configure codecs. It adds support for <code>RTCRtpReceiver.jitterBufferTarget</code>, for tuning the jitter buffer. And it adds video source <code>width</code> and <code>height</code> to RTC stats.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where I420 BT709 <code>VideoFrame</code> was encoded in an incorrect color space when encoding to VP9. (169425608)</li>
<li>Fixed an issue where <code>RTCPeerConnection.addIceCandidate()</code> did not reject when the connection was already closed. (170470988)</li>
<li>Fixed an issue where <code>RTCDataChannel</code> did not check the SCTP buffered amount synchronously. (172386678)</li>
<li>Fixed an issue where <code>MediaStreamTrack</code> could have incorrect settings if the source settings changed while the track was being transferred. (172657570)</li>
<li>Fixed an issue where a remote WebRTC track was not unmuted when the first packet was received. (172904930)</li>
<li>Fixed validation of RTC send encodings to better align with the specification. (172997814)</li>
<li>Fixed an issue where <code>RTCRtpSender.setParameters</code> did not clear parameters that were unset by the web application. (173678165)</li>
<li>Fixed WebRTC VP9 encoders to correctly propagate frame colorspace information. (174008548)</li>
<li>Fixed a regression where <code>RTCPeerConnection</code> with <code>iceTransportPolicy: "relay"</code> failed to gather ICE candidates. (174794660)</li>
<li>Fixed <code>RTCInboundRtpStreamStats.trackIdentifier</code> to match <code>MediaStreamTrack.id</code>. (174938984)</li>
</ul>
<h2><a name="web-extensions"></a>Web Extensions</h2>
<p>The <code>runtime.getDocumentId()</code> Web Extension API now has support in Safari 27 beta. It adds reporting of uncaught JavaScript exceptions and unhandled promise rejections in Web Extension scripts, making extensions easier to debug. And it adds support for propagating user gestures through <code>sendMessage()</code>, <code>connect()</code>, <code>postMessage()</code>, and <code>executeScript()</code> — so extensions can reliably perform actions like media playback that require user activation.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed <code>browser.i18n.getMessage()</code> to correctly substitute named placeholders when they appear adjacent to non-space characters. (169146196)</li>
<li>Fixed <code>browser.i18n.getMessage()</code> to correctly substitute two adjacent named placeholders. (175315700)</li>
<li>Fixed an issue where web extension service worker registration database files accumulated on each Safari launch, causing performance degradation. (175484888)</li>
</ul>
<h2><a name="networking"></a>Networking</h2>
<h3><a name="secure-cookies-on-loopback"></a>Secure cookies on loopback</h3>
<p>Safari 27 beta adds support for <code>Secure</code> cookies on loopback hosts. For loopback hosts using plaintext HTTP, cookies marked <code>Secure</code> can now be set via JavaScript and <code>Set-Cookie</code> headers, matching the behavior of other browsers. This simplifies local development and testing with <code>Secure</code> cookies.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed redirects to <code>data:</code> URLs to be blocked for subresources such as images and scripts, aligning with the Fetch specification. (74165956)</li>
<li>Fixed <code>XMLHttpRequest</code> incorrectly dropping the request body during redirects. (98459882)</li>
<li>Fixed <code>X-Frame-Options</code> to only strip tab or space characters, not vertical tabs. (126915315)</li>
<li>Fixed an issue where Safari’s address bar could display an internationalized domain name (IDN) homograph as a visually identical legitimate Latin domain, enabling potential phishing attacks. (166796168)</li>
<li>Fixed an issue where the preload scanner did not include integrity metadata in requests, causing incorrect Integrity-Policy violation reports. (168280745)</li>
<li>Fixed range request validation to properly handle HTTP 416 (Requested Range Not Satisfiable) responses. (168487440)</li>
<li>Fixed a regression where the referrer could be missing after a process-swap navigation. (169006635)</li>
<li>Fixed incorrect URL query percent-encoding when using non-UTF-8 character encodings such as <code>iso-8859-2</code>, <code>windows-1250</code>, and <code>gbk</code>. (169566553)</li>
<li>Fixed an issue where the multipart form data parser incorrectly required CRLF after the closing delimiter, causing some web applications to fail to render correctly. (174348783)</li>
<li>Fixed an issue where partitioned cookies could not be deleted via <code>WKHTTPCookieStore</code>. (174557252)</li>
</ul>
<h2><a name="storage"></a>Storage</h2>
<h3><a name="maxage-in-the-cookie-store-api"></a>maxAge in the Cookie Store API</h3>
<p>Safari 27 beta now supports specifying <code>maxAge</code> when setting a cookie via the Cookie Store API.</p>
<pre><code class="js"><span class="identifier">await</span> <span class="identifier">cookieStore</span>.<span class="identifier">set</span>({
  <span class="identifier">name</span><span class="operator">:</span> <span class="string">"session"</span>,
  <span class="identifier">value</span><span class="operator">:</span> <span class="string">"abc123"</span>,
  <span class="identifier">maxAge</span><span class="operator">:</span> <span class="number">60</span> <span class="operator">*</span> <span class="number">60</span> <span class="operator">*</span> <span class="number">24</span> <span class="operator">*</span> <span class="number">7</span>, <span class="comment">// one week, in seconds
</span>});
</code></pre>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where IndexedDB could incorrectly return a version 0 database after an abort during the initial <code>onupgradeneeded</code> event. (176195526)</li>
</ul>
<h2><a name="editing"></a>Editing</h2>
<p>Safari 27 beta now supports menu items that convert editable text between Simplified and Traditional Chinese characters, now available in the “Transformations” submenu of the context menu for relevant text selections.</p>
<p class="codepen" data-height="500" data-pen-title="Convert to Simplified/Traditional Chinese." data-default-tab="result" data-slug-hash="VYmywPE" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where characters styled with <code>::first-letter</code> were not selectable. (5688237)</li>
<li>Fixed font size 13pt being incorrectly mapped to <code>&lt;font size="2"&gt;</code> (10pt) when using rich text editing. (15292320)</li>
<li>Fixed an issue where the Font Picker style selection became unusable after changing fonts when editing multiple lines of text. (110651645)</li>
<li>Fixed an issue where adjusting text selection with touch handles was prevented by JavaScript touch event handling on some websites. (151851274)</li>
<li>Fixed an issue where <code>execCommand('FormatBlock')</code> did not preserve inline styles of replaced block elements, causing text formatting to be lost when pasting content. (157657531)</li>
<li>Fixed an issue where <code>text-indent</code> flickered or was ignored on <code>contenteditable</code> elements while typing. (170280101)</li>
<li>Fixed an issue where text selection would jump unexpectedly when selecting absolutely-positioned content inside an element with <code>user-select: none</code>. (170475401)</li>
<li>Fixed an issue where text selection was lost when focus transitioned from a <code>contentEditable</code> element to a non-editable target. (171221909)</li>
<li>Fixed an issue where CJK encoding state was not reset appropriately during text decoding. (174649963)</li>
</ul>
<h2><a name="svg"></a>SVG</h2>
<p>Safari 27 beta adds support for the <code>lang</code> and <code>xml:lang</code> attribute in SVG. You can now specify the language of text content in SVG, enabling correct language-aware text rendering and accessibility announcements.</p>
<p class="codepen" data-height="500" data-pen-title="SVG lang attribute" data-default-tab="result" data-slug-hash="QwGagqy" data-user="ntim" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed <code>offsetX</code> and <code>offsetY</code> for SVG elements to use the outermost SVG as the base for coordinate calculation. (168548585)</li>
<li>Fixed an issue where backslash-escaped dot characters in SVG animation timing attribute ID references were not parsed correctly. (94260935)</li>
<li>Fixed an issue where SMIL animations of <code>href</code> or <code>xlink:href</code> on SVG <code>&lt;image&gt;</code> elements had no visual effect. (96316808)</li>
<li>Fixed an issue where SVG animation did not clear the animated CSS property when <code>attributeName</code> was dynamically changed. (97097883)</li>
<li>Fixed <code>:visited</code> link color to properly propagate to SVG through <code>currentColor</code>. (98776770)</li>
<li>Fixed an issue where a CSS filter referencing an SVG filter via <code>url(#id)</code> was not invalidated when the filter content changed. (101870430)</li>
<li>Fixed SVG2 systemLanguage attribute to improve parsing and compliance with the specification. (116427520)</li>
<li>Fixed removing an item from <code>SVGTransformList</code> to properly allow attribute removal. (117840533)</li>
<li>Fixed an issue where the XML document parser did not defer inline script execution until pending stylesheets had loaded. (122574381)</li>
<li>Fixed an issue where animated SVG images referenced via an <code>&lt;img&gt;</code> tag did not animate correctly due to repaint artifacts with <code>object-fit</code>. (141815698)</li>
<li>Fixed an SVG <code>&lt;tspan&gt;</code> positioning bug with <code>xml:space="preserve"</code> that caused multi-line text to render incorrectly. (143722975)</li>
<li>Fixed an issue where SVG elements referencing non-existent filter IDs were not rendered. (164046592)</li>
<li>Fixed an issue where URL fragments were not percent-decoded before being used for SVG references. (169582378)</li>
<li>Fixed: Updated the default values of <code>fx</code> and <code>fy</code> attributes on <code>SVGRadialGradientElement</code> to <code>50%</code> to align with the SVG2 specification. (169645572)</li>
<li>Fixed <code>SVGAnimatedRect.baseVal</code> to ignore invalid values set on the <code>viewBox</code> attribute, such as negative width or height, aligning with Firefox and Chrome. (170214971)</li>
<li>Fixed SVG length attributes to reset to their default values when removed, rather than retaining previously set values. (170360351)</li>
<li>Fixed an issue where <code>getScreenCTM()</code> did not include CSS transforms and zoom contributions in the legacy SVG rendering path. (171525696)</li>
<li>Fixed an issue where an invalid attribute type in one SVG animation group prevented all subsequent animation groups from running. (172593109)</li>
<li>Fixed a regression where wheel events were not dispatched to an empty <code>&lt;svg&gt;</code> root element. (172909441)</li>
<li>Fixed an issue where SMIL <code>parseClockValue</code> did not reject out-of-range minutes and seconds values per the SMIL timing specification. (173577212)</li>
<li>Fixed the SMIL <code>values</code> attribute to preserve empty values and handle trailing semicolons. (173594455)</li>
<li>Fixed SMIL <code>repeat(n)</code> event conditions not triggering animations. (173599629)</li>
<li>Fixed SVG2 <code>getStartPositionOfChar</code> and <code>getEndPositionOfChar</code> to be more compliant with the specification. (174145885)</li>
<li>Fixed <code>glyph-orientation-vertical: auto</code> to use UTR#50 Vertical Orientation properties for correct character orientation in vertical text. (175064567)</li>
<li>Fixed SVG intrinsic aspect ratio being incorrectly suppressed when <code>preserveAspectRatio</code> is set to <code>none</code>. (175173375)</li>
<li>Fixed SVG images without complete intrinsic dimensions incorrectly using ratio-based scaling for <code>background-size</code>. (175345107)</li>
<li>Fixed the SMIL clock value parser to accept hours greater than 99 and reject malformed seconds values. (175593583)</li>
<li>Fixed <code>stroke-dasharray</code> interpolation to use least common multiple for list length matching and corrected composition behavior. (175598175)</li>
<li>Fixed an issue where <code>@prefers-color-scheme</code> in an SVG image will sometimes not follow the system color preference. (176413340)</li>
</ul>
<h2><a name="wkwebview"></a>WKWebView</h2>
<p>Safari 27 brings a significant expansion of WKWebView public API for native app developers. The additions make it easier to build advanced browser and web-hosting experiences on top of WebKit:</p>
<ul>
<li><strong><code>WKSerializedNode</code></strong> — clone DOM nodes, including shadow roots, between different <code>WKWebView</code> instances.</li>
<li><strong><code>WKJSHandle</code></strong> — use JavaScript object references from native code.</li>
<li><strong><code>WKContentWorldConfiguration</code></strong> — configure content world properties such as autofill scripting, shadow root access, and inspectability when creating a <code>WKContentWorld</code>.</li>
<li><strong><code>alternateRequest</code> and <code>overrideReferrerForAllRequests</code> on <code>WKWebpagePreferences</code></strong> — modify the main resource request during navigation and apply custom referrer headers across all resource loads.</li>
<li><strong><code>willSubmitForm</code> callback on <code>WKNavigationDelegate</code></strong> — receive notification of HTML form submissions via a new <code>WKFormInfo</code> object.</li>
<li><strong><code>mainFrameNavigation</code> on <code>WKNavigationAction</code> and <code>mainFrameNavigation</code> on <code>WKNavigationResponse</code></strong> — correlate navigation actions and responses with each other and their originating loads.</li>
<li><code>WKWebView.load(url:)</code> — load a URL directly without wrapping it in an <code>NSURLRequest</code>.</li>
<li><strong><code>WKHTTPCookieStore.cookies(for:)</code></strong> — retrieve cookies matching a specific URL without fetching the entire cookie store.</li>
</ul>
<h2><a name="web-inspector"></a>Web Inspector</h2>
<p>Several Web Inspector updates in Safari 27 beta make common debugging tasks easier.</p>
<p>The Color Picker now shows <strong>color contrast information</strong> inline as you edit — no more switching tools mid-decision to check whether a color combination is accessible. This works when you’re editing both foreground and background colors at the same time.</p>
<figure><picture><source srcset="https://webkit.org/wp-content/uploads/color-picker-DARK-2.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/color-picker-LIGHT-2.png" alt="Color picker in Web Inspector showing color contrast information" width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<p>The Color Picker’s <strong>format and gamut controls</strong> are also now visible upfront instead of hidden. If you’ve ever gone hunting for those options, this will help.</p>
<figure><picture><source srcset="https://webkit.org/wp-content/uploads/color-picker-format-DARK-2.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/color-picker-format-LIGHT-2.png" alt="Color picker in Web Inspector showing dropdown of formats." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<p>In the Network tab, when a resource redirects, you can now see <strong>every request in the chain</strong> rather than just the final destination. It’s much easier to figure out what’s actually happening.</p>
<figure><picture><source srcset="https://webkit.org/wp-content/uploads/network-requests-DARK-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/network-requests-LIGHT-scaled.png" alt="The network tab in Web Inspector showing three redirects." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<p>The Elements tab adds <strong>Subgrid and Grid-Lanes badges</strong> that make it easy to identify subgrid and grid-lanes layout contexts as you explore a page.</p>
<figure><picture><source srcset="https://webkit.org/wp-content/uploads/grid-subgrid-DARK-scaled.png" type="image/png" media="(prefers-color-scheme: dark)"><img loading="lazy" decoding="async" src="https://webkit.org/wp-content/uploads/grid-subgrid-LIGHT-scaled.png" alt="Shows the subgrid lines in Web Inspector on top of Stripe's Dev page." width="1920" height="1080" class="aligncenter size-full wp-image-17357 preserve-color" /></picture></figure>
<p>The Timeline tab now includes the <strong>layout root element</strong> in Layout event details, so you can see which element triggered a layout pass.</p>
<h3><a name="additional-bug-fixes"></a>Additional bug fixes:</h3>
<ul>
<li>Fixed an issue where CSS properties added to new rules were not applied and were marked as invalid. (103548968)</li>
<li>Fixed an issue in the Network panel where the Request / Response menu did not remember the user’s previously selected value. (108231795)</li>
<li>Fixed editing inline <code>style</code> attribute values in the Elements panel resulting in truncated or malformed content. (149523483)</li>
<li>Fixed an issue where the input field for recording canvas frames in the Graphics tab was sometimes too small to type in and only allowed typing one character at a time. (157787230)</li>
<li>Fixed the Network tab filtering by resource type not working after clearing a filter that had no matches. (161570940)</li>
<li>Fixed an issue where CSS rules added via the &#8220;Add New Rule&#8221; button in the Styles panel were intermittently not applied or would vanish after entering a property. (164971557)</li>
<li>Fixed an issue where tree outlines in Web Inspector would intermittently show blank content while scrolling when a filter was active. (169502061)</li>
<li>Fixed an issue where an active recording in the Timelines tab would stop when navigating or reloading the current page even when the setting to stop recording once the page loads was turned off. (169732727)</li>
<li>Fixed an issue in the Timelines tab where rows containing object previews were sometimes not visible in the heap snapshot data grid. (170164522)</li>
<li>Fixed context menu items in the Elements tab to only display relevant options when multiple DOM nodes are selected. (170307979)</li>
<li>Fixed an issue where previewing resources in the Network tab displayed an error upon navigating away and Preserve Log was enabled. (171216835)</li>
<li>Fixed an issue where selected DOM node keys in a Map in the Scope Chain sidebar had unreadable white text on a light background. (171840122)</li>
<li>Fixed an issue where the WebAssembly debugger had no source bytes for modules compiled via <code>WebAssembly.instantiateStreaming</code>, preventing source-level debugging in LLDB. (174362152)</li>
<li>Fixed the WebAssembly debugger to generate human-readable module names from the WebAssembly name section and fetch URL, replacing bare address-based fallback names in LLDB’s image list. (174465437)</li>
<li>Fixed the Safari Develop menu and WebDriver to launch Device Hub instead of Simulator when available in Xcode. (174276041)</li>
<li>Fixed the Layers 3D view to correctly map textures to composited bounds and use proper selection highlighting instead of tinting textures. (174355052)</li>
<li>Fixed the Layers 3D view to re-snapshot preserved layers after a repaint instead of displaying stale textures. (174358757)</li>
<li>Fixed an issue where all folder tree elements were expanded after filtering for a resource in the Sources panel. (175009135)</li>
<li>Fixed an erroneous &#8220;There are unread messages that have been filtered&#8221; banner appearing in the Console when <code>console.groupCollapsed()</code> is used. (175279759)</li>
<li>Fixed an issue in the Storage tab where filtering by storage type did not reveal the popup with options. (175444192)</li>
<li>Fixed Timeline recordings showing unrelated events incorrectly nested inside longer events. (176309164)</li>
<li>Fixed Web Inspector toolbar buttons rendering at incorrect sizes. (176508343)</li>
</ul>
<h2><a name="accessibility"></a>Accessibility</h2>
<ul>
<li>Fixed an issue where calling <code>speechSynthesis.cancel()</code> removed utterances queued by subsequent <code>speechSynthesis.speak()</code> calls. (46151521)</li>
<li>Fixed an issue where SVG <code>&lt;use&gt;</code> elements referencing <code>&lt;symbol&gt;</code> elements inside an <code>&lt;img&gt;</code> were incorrectly included as unnamed images in VoiceOver’s Images rotor. (98999595)</li>
<li>Fixed an issue where changing the <code>id</code> attribute of an element targeted by <code>aria-owns</code> did not update the accessibility tree. (107644248)</li>
<li>Fixed slot elements referenced by <code>aria-labelledby</code> to correctly use their assigned slotted content for accessible names and ignore hidden slotted nodes. (114500560)</li>
<li>Fixed <code>&lt;meter&gt;</code> element to have consistent labels between <code>aria-label</code> and <code>title</code> attributes. (127460695)</li>
<li>Fixed elements with <code>display: contents</code> and content in a shadow root to have their content properly read when referenced by <code>aria-labelledby</code>. (129361833)</li>
<li>Fixed <code>aria-labelledby</code> to use the checkbox name instead of its value when the checkbox name comes from an associated <code>&lt;label&gt;</code> element. (141564913)</li>
<li>Fixed VoiceOver cursor positioning for elements focused via the <code>drawFocusIfNeeded()</code> canvas API. (146323788)</li>
<li>Fixed grid elements with child rows in a shadow root to properly work with VoiceOver. (153134654)</li>
<li>Fixed an issue where VoiceOver read text within images that have <code>role="presentation"</code>. (159304061)</li>
<li>Fixed an issue where content within dynamically expanded <code>&lt;details&gt;</code> elements was not exposed in the accessibility tree. (159865815)</li>
<li>Fixed an issue where the <code>contextmenu</code> event was not fired for elements inside iframes when triggered by keyboard or assistive technology actions such as VoiceOver’s VO+Shift+M. (164128676)</li>
<li>Fixed an issue where changes to <code>&lt;input type="button"&gt;</code> elements inside live regions were not announced by assistive technologies. (168200460)</li>
<li>Fixed <code>::first-letter</code> text not being exposed in the accessibility tree when no other text accompanies it. (168458291)</li>
<li>Fixed an issue where VoiceOver was unable to access <code>aria-owned</code> rows and their cells in grids and tables. (168770938)</li>
<li>Fixed an issue where VoiceOver could not find focusable splitter elements when navigating to the next or previous form control. (170187464)</li>
<li>Fixed an issue where color picker inputs could not be activated using VoiceOver’s press action. (172218114)</li>
<li>Fixed an issue where interactive elements containing an <code>&lt;svg&gt;</code> named by a child <code>&lt;title&gt;</code> element did not expose an accessible name. (172559238)</li>
<li>Fixed an issue where incorrect bounding boxes were computed for MathML table rows and cells. (172851295)</li>
<li>Fixed an issue where comboboxes did not forward focus to their <code>aria-activedescendant</code>, preventing assistive technologies from interacting with list items. (172931277)</li>
<li>Fixed an issue where <code>aria-owns</code> was not respected when computing the accessible name from element content. (173249317)</li>
<li>Fixed VoiceOver line-by-line reading skipping content in read-only documents. (174349841)</li>
<li>Fixed invalidation of aria-hidden=&#8221;true&#8221; when focus lands inside the aria-hidden subtree. (174449524)</li>
</ul>
<h2><a name="forms"></a>Forms</h2>
<ul>
<li>Fixed an issue where keyboard commands such as paste did not work in form fields that restrict input to numbers. (4360235)</li>
<li>Fixed an issue where keyboard tabbing position was lost when a focused button became disabled, causing focus to jump to the beginning of the page. (120676409)</li>
<li>Fixed an issue where small range input slider thumbs were difficult to interact with on iPadOS and visionOS by expanding their touch hit area. (147428926)</li>
<li>Fixed <code>&lt;datalist&gt;</code> suggestions appearing with with white text on a white background in dark mode after typing. (168676757)</li>
<li>Fixed an issue on iOS where typing into an <code>&lt;input&gt;</code> element associated with a <code>&lt;datalist&gt;</code> was intercepted by type-to-select behavior. (173346270)</li>
<li>Fixed: Made the <code>&lt;input type="checkbox" switch&gt;</code> control behave more like other controls with regards to native appearance CSS properties. (173487610)</li>
<li>Fixed an issue where date and time input types without <code>min</code> or <code>max</code> attributes incorrectly matched the <code>:in-range</code> pseudo-class. (174829899)</li>
<li>Fixed an issue where cloned <code>&lt;input&gt;</code> and <code>&lt;textarea&gt;</code> elements did not preserve their user-modified state. (174892989)</li>
<li>Fixed <code>field-sizing: content</code> clipping the placeholder on number inputs that have no value. (175883299)</li>
</ul>
<h2><a name="printing"></a>Printing</h2>
<ul>
<li>Fixed an issue where animations were ignored during print, causing missing content on animated pages. (36901701)</li>
<li>Fixed an issue where printing light text on a dark background with backgrounds disabled could result in invisible text. (170070133)</li>
<li>Fixed a regression where printing a WebView embedded in an enclosing <code>NSPrintOperation</code> dropped all text. (174756900)</li>
</ul>
<h2><a name="updating-to-safari-27"></a>Updating to Safari 27</h2>
<p>Safari 27 beta is available on <a href="https://www.apple.com/os/macos/">Golden Gate (macOS 27)</a>, <a href="https://www.apple.com/os/ios/">iOS 27</a>, <a href="https://www.apple.com/os/ipados/">iPadOS27</a> and <a href="https://www.apple.com/os/visionos/">visionOS 27</a>.</p>
<p>To try Safari 27 beta, install the developer beta on your Apple device. You can also install <a href="https://developer.apple.com/safari/technology-preview/">Safari Technology Preview</a> for macOS 27 beta and macOS 26.</p>
<h2><a name="feedback"></a>Feedback</h2>
<p>We love hearing from you. To share your thoughts, find our web evangelists online: Jen Simmons on <a href="https://bsky.app/profile/jensimmons.bsky.social">Bluesky</a> / <a href="https://front-end.social/@jensimmons">Mastodon</a>, Saron Yitbarek on <a href="https://bsky.app/profile/saron.bsky.social">BlueSky</a>, and Jon Davis on <a href="https://bsky.app/profile/jondavis.bsky.social">Bluesky</a> / <a href="https://mastodon.social/@jondavis">Mastodon</a>. You can follow WebKit <a href="https://www.linkedin.com/in/apple-webkit/">on LinkedIn</a>. If you run into any issues, we welcome your <a href="https://feedbackassistant.apple.com/">feedback</a> on Safari UI (learn more about <a href="https://developer.apple.com/bug-reporting/">filing Feedback</a>), or your <a href="https://bugs.webkit.org/">WebKit bug report</a> about web technologies or Web Inspector. If you run into a website that isn’t working as expected, please file a report at <a href="https://webcompat.com/">webcompat.com</a>. Filing issues really does make a difference.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Release Notes for Safari Technology Preview 244</title>
		<link>https://webkit.org/blog/17962/release-notes-for-safari-technology-preview-244/</link>
		
		<dc:creator/>
		<pubDate>Thu, 21 May 2026 23:00:26 +0000</pubDate>
				<category><![CDATA[Safari Technology Preview]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17962</guid>

					<description><![CDATA[Safari Technology Preview Release 244 is now available for download for macOS Tahoe and macOS Sequoia.]]></description>
										<content:encoded><![CDATA[<p><a href="https://webkit.org/blog/6017/introducing-safari-technology-preview/">Safari Technology Preview</a> Release 244 is now <a href="https://developer.apple.com/safari/resources/">available for download</a> for macOS Tahoe and macOS Sequoia. If you already have Safari Technology Preview installed, you can update it in System Settings under General → Software Update.</p>
<p>This release includes WebKit changes between: <a href="https://github.com/WebKit/WebKit/compare/4c22d3192a194f0a17bcb35996864803f9e5dcef...bc59681571095d4c238aab49e33c533532e96399">312008@main&#8230;312964@main</a>.</p>
<h3>Accessibility</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed VoiceOver cursor positioning for elements focused via the <code>drawFocusIfNeeded()</code> canvas API. (<a href="https://commits.webkit.org/312024@main">312024@main</a>)  (146323788)</li>
<li>Fixed an issue where interactive elements containing an <code>&lt;svg&gt;</code> named by a child <code>&lt;title&gt;</code> element did not expose an accessible name. (<a href="https://commits.webkit.org/312953@main">312953@main</a>)  (172559238)</li>
<li>Fixed VoiceOver line-by-line reading skipping content in read-only documents. (<a href="https://commits.webkit.org/312263@main">312263@main</a>)  (174349841)</li>
</ul>
<h3>Animations</h3>
<h4>New Features</h4>
<ul>
<li>Added the <code>animation</code> property to <code>AnimationEvent</code> and <code>TransitionEvent</code> interfaces. (<a href="https://commits.webkit.org/312859@main">312859@main</a>)  (176527591)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed CSS anchor-positioned elements not updating correctly when their anchors have their transform animated. (<a href="https://commits.webkit.org/312752@main">312752@main</a>)  (175896047)</li>
</ul>
<h3>CSS</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>normal</code> and <code>none</code> values on the <code>position-anchor</code> CSS property. (<a href="https://commits.webkit.org/312378@main">312378@main</a>)  (172097721)</li>
<li>Added support for transform-aware anchor positioning. (<a href="https://commits.webkit.org/312317@main">312317@main</a>)  (175401339)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>-webkit-text-fill-color</code> incorrectly overrode <code>text-decoration-color</code>. (<a href="https://commits.webkit.org/312789@main">312789@main</a>)  (47010945)</li>
<li>Fixed <code>shape-outside</code> computing incorrect text wrapping in RTL writing modes. (<a href="https://commits.webkit.org/312516@main">312516@main</a>)  (56890238)</li>
<li>Fixed CSS <code>zoom</code> interacting incorrectly with <code>font-weight</code>, <code>font-style</code>, and <code>font-variant</code> on iPad. (<a href="https://commits.webkit.org/312944@main">312944@main</a>)  (152173269)</li>
<li>Fixed <code>FontFace.loaded</code> to reject when a <code>local()</code> font source fails to load. (<a href="https://commits.webkit.org/312933@main">312933@main</a>)  (174631384)</li>
<li>Fixed CSS trigonometric functions to correctly convert degrees to radians. (<a href="https://commits.webkit.org/312860@main">312860@main</a>)  (175575617)</li>
<li>Fixed <code>sibling-index()</code> and <code>sibling-count()</code> inside calc() functions to be correctly simplified. (<a href="https://commits.webkit.org/312026@main">312026@main</a>)  (175590806)</li>
<li>Fixed <code>sibling-index()</code> and <code>sibling-count()</code>to correctly return 0 when used in cross-tree <code>::part()</code> styling. (<a href="https://commits.webkit.org/312544@main">312544@main</a>)  (175592607)</li>
<li>Fixed the CSS <code>resize</code> handle not working on an element when the handle overlaps a child iframe. (<a href="https://commits.webkit.org/312099@main">312099@main</a>)  (175621855)</li>
<li>Fixed flex container baseline alignment being incorrectly computed for scroll containers by clamping to the border edge. (<a href="https://commits.webkit.org/312206@main">312206@main</a>)  (175631095)</li>
<li>Fixed an issue where inline-level boxes with <code>calc()</code> margins or padding lost the fixed component during intrinsic width computation. (<a href="https://commits.webkit.org/312081@main">312081@main</a>)  (175669222)</li>
<li>Fixed floats with <code>margin-start</code> incorrectly overlapping adjacent floats. (<a href="https://commits.webkit.org/312083@main">312083@main</a>)  (175669464)</li>
<li>Fixed <code>aspect-ratio</code> calculations for block-level elements with size constraints. (<a href="https://commits.webkit.org/312084@main">312084@main</a>)  (175669713)</li>
<li>Fixed <code>aspect-ratio</code> calculations for flex items with percentage cross-size constraints. (<a href="https://commits.webkit.org/312085@main">312085@main</a>)  (175669774)</li>
<li>Fixed an issue where <code>block-size: stretch</code> resolved incorrectly for absolutely positioned elements with orthogonal writing modes. (<a href="https://commits.webkit.org/312086@main">312086@main</a>)  (175669844)</li>
<li>Fixed <code>aspect-ratio</code> calculations for flex items with definite cross-size values. (<a href="https://commits.webkit.org/312108@main">312108@main</a>)  (175690028)</li>
<li>Fixed <code>revert-layer</code> computing incorrectly when there is a leading empty or space substitution value. (<a href="https://commits.webkit.org/312721@main">312721@main</a>)  (175729680)</li>
<li>Fixed <code>:has()</code> invalidation incorrectly resetting sibling relation bits, causing style invalidation failures for first-in-sibling-chain elements. (<a href="https://commits.webkit.org/312221@main">312221@main</a>)  (175738008)</li>
<li>Fixed an issue where absolutely positioned tables with content exceeding their declared CSS width were incorrectly positioned. (<a href="https://commits.webkit.org/312197@main">312197@main</a>)  (175755871)</li>
<li>Fixed height calculations for absolutely positioned tables with percentage-sized children. (<a href="https://commits.webkit.org/312204@main">312204@main</a>)  (175762381)</li>
<li>Fixed an issue where absolutely positioned tables with explicit percentage or fixed heights did not resolve correctly against their containing block. (<a href="https://commits.webkit.org/312280@main">312280@main</a>)  (175852400)</li>
<li>Fixed absolutely positioned tables ignoring <code>min-height</code> and shrinking below their content height. (<a href="https://commits.webkit.org/312313@main">312313@main</a>)  (175883577)</li>
<li>Fixed absolutely positioned tables ignoring <code>max-height</code> constraints. (<a href="https://commits.webkit.org/312357@main">312357@main</a>)  (175932457)</li>
<li>Fixed an issue where a flex item with <code>aspect-ratio</code> and <code>content-box</code> padding computed the wrong height in a column flex container. (<a href="https://commits.webkit.org/312441@main">312441@main</a>)  (176033726)</li>
<li>Fixed an issue where flex items with explicit <code>min-height: min-content</code> were incorrectly treated as scrollable, zeroing out their minimum size. (<a href="https://commits.webkit.org/312517@main">312517@main</a>)  (176173688)</li>
<li>Fixed <code>:has()</code> invalidation performance when used inside nested <code>:is()</code> selectors. (<a href="https://commits.webkit.org/312715@main">312715@main</a>)  (176354723)</li>
<li>Fixed <code>sibling-count()</code> &amp; <code>sibling-index()</code> used in <code>@keyframes</code> to re-resolve when siblings change. (<a href="https://commits.webkit.org/312895@main">312895@main</a>)  (176531901)</li>
</ul>
<h3>Forms</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>&lt;datalist&gt;</code> suggestions appearing with a white background on white text in dark mode after typing. (<a href="https://commits.webkit.org/312889@main">312889@main</a>)  (168676757)</li>
<li>Fixed the select picker appearing at an incorrect position when the <code>&lt;select&gt;</code> element is anchor positioned. (<a href="https://commits.webkit.org/312811@main">312811@main</a>)  (175454476)</li>
<li>Fixed <code>field-sizing: content</code> clipping the placeholder on number inputs that have no value. (<a href="https://commits.webkit.org/312936@main">312936@main</a>)  (175883299)</li>
<li>Fixed <code>&lt;option&gt;</code> and <code>&lt;optgroup&gt;</code> elements to match the <code>:disabled</code> pseudo-class when inside a disabled <code>&lt;select&gt;</code>. (<a href="https://commits.webkit.org/312890@main">312890@main</a>)  (176559708)</li>
</ul>
<h3>HTML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for <code>tabindex</code>, <code>focus()</code>, <code>blur()</code>, and <code>autofocus</code> on MathML elements per the HTML Standard. (<a href="https://commits.webkit.org/312609@main">312609@main</a>)  (176258900)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>history.pushState()</code> and <code>history.replaceState()</code> URL rewriting to match the updated specification. (<a href="https://commits.webkit.org/312738@main">312738@main</a>)  (83203469)</li>
<li>Fixed sequential focus navigation to skip elements that do not meet the specification&#8217;s focusability requirements. (<a href="https://commits.webkit.org/312032@main">312032@main</a>)  (103370883)</li>
<li>Fixed <code>innerText</code> to no longer emit newlines for <code>visibility: hidden</code> block elements. (<a href="https://commits.webkit.org/312010@main">312010@main</a>)  (175569426)</li>
<li>Fixed <code>innerText</code> to correctly emit blank lines around <code>&lt;p&gt;</code> elements regardless of their CSS <code>display</code> value. (<a href="https://commits.webkit.org/312169@main">312169@main</a>)  (175729427)</li>
<li>Fixed the speculative preload scanner to no longer incorrectly preload scripts inside SVG elements. (<a href="https://commits.webkit.org/312327@main">312327@main</a>)  (175800116)</li>
<li>Fixed <code>innerText</code> on tables to no longer emit spurious trailing newlines and to preserve row-exit newlines after empty rows. (<a href="https://commits.webkit.org/312941@main">312941@main</a>)  (176635985)</li>
</ul>
<h3>Images</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>naturalWidth</code> and <code>naturalHeight</code> returning incorrect values for SVG images without intrinsic dimensions. (<a href="https://commits.webkit.org/312552@main">312552@main</a>)  (141196049)</li>
<li>Fixed an issue where HDR images would flicker and lose their HDR appearance when overlapping layers animate. (<a href="https://commits.webkit.org/312702@main">312702@main</a>)  (163382580)</li>
</ul>
<h3>JavaScript</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where parse errors in workers were not reported to the parent. (<a href="https://commits.webkit.org/312701@main">312701@main</a>)  (175610725)</li>
<li>Fixed a performance issue with module resolution by limiting cache population to star-resolution and indirect-resolution cases. (<a href="https://commits.webkit.org/312416@main">312416@main</a>)  (175826413)</li>
<li>Fixed a performance issue with <code>TypedArray.prototype.lastIndexOf</code> by adding SIMD-accelerated reverse search for numeric types. (<a href="https://commits.webkit.org/312383@main">312383@main</a>)  (175904377)</li>
<li>Fixed a performance issue where building a module namespace with many <code>export *</code> statements was significantly slower than necessary. (<a href="https://commits.webkit.org/312370@main">312370@main</a>)  (175949532)</li>
<li>Fixed <code>DataView</code> constructor to match specification-defined argument validation order and error throwing behavior. (<a href="https://commits.webkit.org/312483@main">312483@main</a>)  (176110210)</li>
<li>Fixed an issue where <code>Array.prototype.concat</code> could produce incorrect results when combining arrays with incompatible indexing types. (<a href="https://commits.webkit.org/312560@main">312560@main</a>)  (176219964)</li>
</ul>
<h3>MathML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for multiple-character operators in MathML. (<a href="https://commits.webkit.org/312867@main">312867@main</a>)  (170907545)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>padding</code> and <code>border</code> rendering on <code>&lt;msqrt&gt;</code> and <code>&lt;mroot&gt;</code> elements and corrected token sizing for <code>mathvariant</code>. (<a href="https://commits.webkit.org/312902@main">312902@main</a>)  (173081436)</li>
<li>Fixed absolute positioning of elements inside MathML by ensuring logical height is updated. (<a href="https://commits.webkit.org/312905@main">312905@main</a>)  (173088146)</li>
<li>Fixed <code>tabIndex</code> values not being set correctly for MathML elements. (<a href="https://commits.webkit.org/312681@main">312681@main</a>)  (174734133)</li>
</ul>
<h3>Media</h3>
<h4>New Features</h4>
<ul>
<li>Added support for synchronized video playback on displays using genlock on macOS. (<a href="https://commits.webkit.org/311815@main">311815@main</a>, <a href="https://commits.webkit.org/312166@main">312166@main</a>)  (175197574)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed video playback failing when the declared MIME type in a <code>&lt;source&gt;</code> element does not match the actual content type served by the server. (<a href="https://commits.webkit.org/312399@main">312399@main</a>)  (166181001)</li>
<li>Fixed <code>ImageCapture</code> to correctly queue <code>takePhoto()</code> and <code>applyConstraints()</code> requests to avoid concurrent capture session reconfiguration. (<a href="https://commits.webkit.org/312196@main">312196@main</a>)  (174950018)</li>
<li>Fixed <code>::cue()</code> selectors to correctly match the WebVTT root object in addition to child nodes. (<a href="https://commits.webkit.org/312292@main">312292@main</a>)  (175550173)</li>
<li>Fixed Media Source Extensions <code>readyState</code> not being updated immediately when playback stalls due to a gap in buffered data. (<a href="https://commits.webkit.org/312694@main">312694@main</a>)  (176330683)</li>
</ul>
<h3>Networking</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>XMLHttpRequest</code> incorrectly dropping the request body during redirects. (<a href="https://commits.webkit.org/312092@main">312092@main</a>)  (98459882)</li>
<li>Fixed an issue where partitioned cookies could not be deleted via <code>WKHTTPCookieStore</code>. (<a href="https://commits.webkit.org/312478@main">312478@main</a>)  (174557252)</li>
</ul>
<h3>Rendering</h3>
<h4>New Features</h4>
<ul>
<li>Added support for <code>anchor-valid</code> and <code>anchor-visible</code> as aliases of <code>anchors-valid</code> and <code>anchors-visible</code> in <code>position-visibility</code>. (<a href="https://commits.webkit.org/312080@main">312080@main</a>)  (174438361)</li>
<li>Added support for the Dutch IJ digraph in <code>text-transform: capitalize</code> and <code>::first-letter</code>, correctly titlecasing &#8220;ij&#8221; to &#8220;IJ&#8221; at word starts when the content language is Dutch. (<a href="https://commits.webkit.org/312335@main">312335@main</a>)  (175912959)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where a block formatting context with <code>margin-start</code> could overlap an adjacent float. (<a href="https://commits.webkit.org/312082@main">312082@main</a>)  (93187697)</li>
<li>Fixed boxes in the top layer to use the initial containing block as their static-position rectangle. (<a href="https://commits.webkit.org/312908@main">312908@main</a>)  (155495104)</li>
<li>Fixed an issue where form controls with <code>height: 100%</code> in auto-height containers incorrectly resolved to zero height. (<a href="https://commits.webkit.org/312526@main">312526@main</a>)  (161699543)</li>
<li>Fixed text being incorrectly truncated in RTL containers when combined with <code>text-overflow: ellipsis</code> and an <code>inline-block</code> pseudo-element. (<a href="https://commits.webkit.org/312799@main">312799@main</a>)  (168875614)</li>
<li>Fixed an issue where <code>height: 100%</code> was incorrectly calculated for replaced elements like images serving as grid items nested inside a flexbox. (<a href="https://commits.webkit.org/312281@main">312281@main</a>)  (169431440)</li>
<li>Fixed an issue where if a document in an iframe uses <code>@prefers-color-scheme</code>, it does not follow the <code>color-scheme</code> set by grandparents of the iframe. (<a href="https://commits.webkit.org/312212@main">312212@main</a>)  (172229372)</li>
<li>Fixed an issue where list markers rendered on the wrong line when list items started with empty inline elements. (<a href="https://commits.webkit.org/312356@main">312356@main</a>)  (172762578)</li>
<li>Fixed an issue where a child element with <code>filter: blur()</code> ignored <code>border-radius</code> overflow clipping from its parent. (<a href="https://commits.webkit.org/312531@main">312531@main</a>)  (175519148)</li>
<li>Fixed incorrect event type mappings where <code>mousemove</code> and <code>mouseup</code> event listener region types were reversed. (<a href="https://commits.webkit.org/312142@main">312142@main</a>)  (175651369)</li>
<li>Fixed an issue where containers with block-in-inline content did not expand when <code>max-height</code> was removed. (<a href="https://commits.webkit.org/312608@main">312608@main</a>)  (175799547)</li>
<li>Fixed always-on scrollbar thumbs not rendering on the root element of nested documents with <code>display: flex</code>. (<a href="https://commits.webkit.org/312300@main">312300@main</a>)  (175866046)</li>
<li>Fixed <code>scrollbar-gutter</code> placement on the root element in RTL layouts. (<a href="https://commits.webkit.org/312360@main">312360@main</a>)  (175939512)</li>
<li>Fixed an issue where numbered list item markers rendered with more spacing between the marker and list content than in other browsers. (<a href="https://commits.webkit.org/312515@main">312515@main</a>)  (176027025)</li>
<li>Fixed an issue where block-level boxes nested within inline elements were not properly aligned when using <code>align-content: center</code>. (<a href="https://commits.webkit.org/312514@main">312514@main</a>)  (176173122)</li>
<li>Fixed a regression where <code>height: stretch</code> on children of flex items incorrectly resolved to viewport height instead of behaving as <code>auto</code> when the flex container lacked an explicit height. (<a href="https://commits.webkit.org/312916@main">312916@main</a>)  (176288044)</li>
<li>Fixed intrinsic sizing for non-replaced elements with percentage dimensions. (<a href="https://commits.webkit.org/312828@main">312828@main</a>)  (176493856)</li>
</ul>
<h3>SVG</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed SMIL <code>repeat(n)</code> event conditions not triggering animations. (<a href="https://commits.webkit.org/312346@main">312346@main</a>)  (173599629)</li>
<li>Fixed <code>glyph-orientation-vertical: auto</code> to use UTR#50 Vertical Orientation properties for correct character orientation in vertical text. (<a href="https://commits.webkit.org/312008@main">312008@main</a>)  (175064567)</li>
<li>Fixed the SMIL clock value parser to accept hours greater than 99 and reject malformed seconds values. (<a href="https://commits.webkit.org/312350@main">312350@main</a>)  (175593583)</li>
<li>Fixed <code>stroke-dasharray</code> interpolation to use least common multiple for list length matching and corrected composition behavior. (<a href="https://commits.webkit.org/312055@main">312055@main</a>)  (175598175)</li>
</ul>
<h3>Security</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>Content-Security-Policy</code> <code>object-src</code> with an empty or invalid source list to block empty <code>&lt;object&gt;</code> and <code>&lt;embed&gt;</code> elements consistently with <code>object-src 'none'</code>. (<a href="https://commits.webkit.org/312899@main">312899@main</a>)  (171298717)</li>
</ul>
<h3>Storage</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where IndexedDB could incorrectly return a version 0 database after an abort during the initial <code>onupgradeneeded</code> event. (<a href="https://commits.webkit.org/312535@main">312535@main</a>)  (176195526)</li>
<li>Fixed <code>FileSystemHandle</code> serialization and deserialization when no storage is available. (<a href="https://commits.webkit.org/312616@main">312616@main</a>)  (176267344)</li>
</ul>
<h3>Web API</h3>
<h4>New Features</h4>
<ul>
<li>Added support for creating dedicated workers inside shared workers per the HTML Standard. (<a href="https://commits.webkit.org/312503@main">312503@main</a>)  (118945089)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed the parent window&#8217;s <code>history.state</code> being set to <code>null</code> when <code>history.pushState</code> is called from a child iframe. (<a href="https://commits.webkit.org/312475@main">312475@main</a>)  (50019069)</li>
<li>Fixed clicking on a scrollbar of an overflow container blurring the current <code>activeElement</code>. (<a href="https://commits.webkit.org/312924@main">312924@main</a>)  (92367314)</li>
<li>Fixed an issue where an <code>Event</code> object&#8217;s <code>target</code> property could lose its JavaScript wrapper due to premature garbage collection. (<a href="https://commits.webkit.org/312017@main">312017@main</a>)  (175439759)</li>
<li>Fixed <code>FileSystemDirectoryHandle.resolve()</code> to return the correct path array for child entries. (<a href="https://commits.webkit.org/312061@main">312061@main</a>)  (175645387)</li>
<li>Fixed <code>PerformanceNavigationTiming.domInteractive</code> and <code>domContentLoadedEventEnd</code> incorrectly returning 0 instead of the correct timestamps. (<a href="https://commits.webkit.org/312500@main">312500@main</a>)  (175739835)</li>
<li>Fixed <code>FileSystemDirectoryHandle.removeEntry()</code> to correctly remove entries. (<a href="https://commits.webkit.org/312193@main">312193@main</a>)  (175745157)</li>
<li>Fixed <code>CryptoKey</code> to correctly remain associated with its secure context. (<a href="https://commits.webkit.org/312502@main">312502@main</a>)  (176157712)</li>
<li>Fixed: Improved cross-origin isolation enforcement for workers. (<a href="https://commits.webkit.org/312518@main">312518@main</a>)  (176175488)</li>
<li>Fixed <code>SharedArrayBuffer</code> cloning and agent cluster ID assignment. (<a href="https://commits.webkit.org/312800@main">312800@main</a>)  (176465817)</li>
</ul>
<h3>Web Extensions</h3>
<h4>New Features</h4>
<ul>
<li>Added support for propagating user gestures through <code>sendMessage()</code>, <code>connect()</code>, <code>postMessage()</code>, and <code>executeScript()</code> APIs, enabling extensions to perform gesture-requiring actions like media playback. (<a href="https://commits.webkit.org/312463@main">312463@main</a>)  (175797617)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where web extension service worker registration database files accumulated on each Safari launch, causing performance degradation. (<a href="https://commits.webkit.org/312231@main">312231@main</a>)  (175484888)</li>
</ul>
<h3>Web Inspector</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where the input field for recording canvas frames in the Graphics tab was sometimes too small to type in and only allowed typing one character at a time. (<a href="https://commits.webkit.org/312433@main">312433@main</a>)  (157787230)</li>
<li>Fixed Timeline recordings showing unrelated events incorrectly nested inside longer events. (<a href="https://commits.webkit.org/312649@main">312649@main</a>)  (176309164)</li>
</ul>
<h3>WebAssembly</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a regression where <code>RegisterSet::normalizeWidths()</code> lost vector-width information, causing v128 argument corruption in WebAssembly SIMD thunks. (<a href="https://commits.webkit.org/312610@main">312610@main</a>)  (176035764)</li>
</ul>
<h3>WebGL</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>compressedTexImage</code> not validating whether the compressed texture format extension has been enabled. (<a href="https://commits.webkit.org/312180@main">312180@main</a>)  (175652171)</li>
<li>Fixed some <code>texImage</code> functions reporting errors with incorrect function names. (<a href="https://commits.webkit.org/312156@main">312156@main</a>)  (175652807)</li>
<li>Fixed some WebGL context state properties not being correctly reset on context loss. (<a href="https://commits.webkit.org/312605@main">312605@main</a>)  (176190808)</li>
</ul>
<h3>WebGPU</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>GPUDevice.onuncapturederror</code> event handler attribute not working. (<a href="https://commits.webkit.org/312043@main">312043@main</a>)  (149577124)</li>
<li>Fixed: Restored <code>maxStorageBuffersInFragmentStage</code> and related WebGPU limits. (<a href="https://commits.webkit.org/312387@main">312387@main</a>)  (160800947)</li>
</ul>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>WebKit Features for Safari 26.5</title>
		<link>https://webkit.org/blog/17938/webkit-features-for-safari-26-5/</link>
		
		<dc:creator/>
		<pubDate>Mon, 11 May 2026 17:00:05 +0000</pubDate>
				<category><![CDATA[News]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17938</guid>

					<description><![CDATA[Safari 26.5 is here, delivering the :open pseudo-class, the element-scoped keyword for random(), color-interpolation for SVG gradients, the ToggleEvent.source property for popovers, and the Origin API.]]></description>
										<content:encoded><![CDATA[<p>Safari 26.5 is here, delivering the <code>:open</code> pseudo-class, the <code>element-scoped</code> keyword for <code>random()</code>, <code>color-interpolation</code> for SVG gradients, the <code>ToggleEvent.source</code> property for popovers, and the Origin API.</p>
<p>Alongside new features, this release continues our ongoing efforts to greatly improve the quality of WebKit. There are 63 bug fixes in total — making this the biggest May release of WebKit yet. The improvements span SVG, WebRTC, networking, editing, and more. Scroll-driven animations and Anchor Positioning both get multiple fixes. Rendering at different zoom levels works better. And work continues improving the handling layout whenever a block-level element lives inside an inline element.</p>
<h2>CSS</h2>
<h3>The :open pseudo-class</h3>
<p>The new <code>:open</code> pseudo-class in CSS provides a clean way to style the open state of elements like <code>&lt;details&gt;</code>, <code>&lt;dialog&gt;</code>, <code>&lt;select&gt;</code>, and <code>&lt;input&gt;</code>.</p>
<p>Previously, you might have used the <code>[open]</code> attribute selector for <code>&lt;details&gt;</code> and <code>&lt;dialog&gt;</code>. It works on those elements, but doesn’t work on <code>&lt;select&gt;</code> or <code>&lt;input&gt;</code>. Plus, it’s an attribute selector doing the job better handled by a pseudo-class. Now <code>:open</code> provides a single, consistent pattern that works across all of these element types.</p>
<p>For <code>&lt;dialog&gt;</code>, it now matches when the dialog is showing — whether opened with <code>showModal()</code> or <code>show()</code>. And for <code>&lt;input&gt;</code>, it applies when an associated picker is displayed, like a date or color picker.</p>
<p class="codepen" data-height="500" data-pen-title="The :open pseudo-class" data-default-tab="css,result" data-slug-hash="KwgEyBx" data-editable="true" data-user="jensimmons" style="height: 500px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<p><script async src="https://public.codepenassets.com/embed/index.js"></script></p>
<p>For <code>&lt;select&gt;</code>, <code>:open</code> matches when the drop-down is expanded.</p>
<pre><code class="css"><span class="keyword">select</span><span class="preprocessor">:open</span> {
  <span class="attribute">border</span>: <span class="number">1px</span> <span class="identifier">solid</span> <span class="identifier">skyblue</span>;
}
</code></pre>
<p>This is a practical improvement to everyday CSS. The progressive enhancement is straightforward — browsers that don’t yet support <code>:open</code> simply won’t apply those rules, and the underlying elements still function normally.</p>
<h3>Improvements to CSS random()</h3>
<p>We were proud to be the first browser to ship the new CSS <code>random()</code> function last December, in Safari 26.2. Since then, the CSS Working Group adjusted how named random values work. Using a named value in the syntax, like <code>random(--size, 100px, 200px)</code>, now creates a global result, instead of something scoped to each individual element. Safari 26.5 implements these changes, including a new <code>element-scoped</code> keyword for when you need per-element behavior.</p>
<p>For example, imagine you have eight instances of <code>&lt;div class="box"&gt;</code> and apply the following CSS.</p>
<pre><code class="css"><span class="keyword builtin">.box</span> {
  <span class="attribute">width</span>: <span class="identifier">random</span>(<span class="number">100px</span>, <span class="number">200px</span>); 
  <span class="attribute">height</span>: <span class="identifier">random</span>(<span class="number">100px</span>, <span class="number">200px</span>);
  <span class="attribute">border</span>: <span class="number">2px</span> <span class="identifier">solid</span> <span class="identifier">black</span>;
}
</code></pre>
<p>You get eight completely differently sized rectangles. This is because each time the random function is used, it generates a brand new number, in this case between 100px and 200px. This is how <code>random()</code> has worked since Safari 26.2.</p>
<p>If, instead, you want all eight boxes to be the same size with the same randomly generated height and width, you can write:</p>
<pre><code class="css"><span class="keyword builtin">.box</span> {
  <span class="attribute">width</span>: <span class="identifier">random</span>(<span class="identifier">--w</span>, <span class="number">100px</span>, <span class="number">200px</span>); 
  <span class="attribute">height</span>: <span class="identifier">random</span>(<span class="identifier">--h</span>, <span class="number">100px</span>, <span class="number">200px</span>);
}
</code></pre>
<p>This chooses a random number, names it (as <code>--w</code> or separately <code>--h</code>), and reuses the named number on each box. (Before Safari 26.5, a cache name was scoped to the individual element, each single box. Now it is global.)</p>
<p>If you want all eight boxes to be square, you can use:</p>
<pre><code class="css"><span class="keyword builtin">.box</span> {
  <span class="attribute">width</span>: <span class="identifier">random</span>(<span class="identifier">--s</span>, <span class="number">100px</span>, <span class="number">200px</span>); 
  <span class="attribute">height</span>: <span class="identifier">random</span>(<span class="identifier">--s</span>, <span class="number">100px</span>, <span class="number">200px</span>);
}
</code></pre>
<p>The <code>--s</code> ties the two sizes together. The height and width is random, but it’s the same number. Before Safari 26.5, this would give you eight differently-sized squares. Now it will give you a single random size for all eight squares.</p>
<p>If you want eight differently sized squares, you can now use the <code>element-scoped</code> keyword to scope the name to the element, like this:</p>
<pre><code class="css"><span class="keyword builtin">.box</span> {
  <span class="attribute">width</span>: <span class="identifier">random</span>(<span class="identifier">--s</span> <span class="identifier">element-scoped</span>, <span class="number">100px</span>, <span class="number">200px</span>); 
  <span class="attribute">height</span>: <span class="identifier">random</span>(<span class="identifier">--s</span> <span class="identifier">element-scoped</span>, <span class="number">100px</span>, <span class="number">200px</span>);
}
</code></pre>
<p>Now the name applies only to a single element. You can put <code>element-scoped</code> before or after the name, meaning this works too: <code>random(element-scoped --s, 100px, 200px)</code>. Lastly, the <code>element-shared</code> keyword has been removed from Safari 26.5, since the new default behavior covers this use case and the CSS Working Group removed it from the specification.</p>
<h3>Improvements to Anchor Positioning</h3>
<p>CSS anchor positioning continues to mature in this release, with several fixes addressing real-world usage patterns.</p>
<ul>
<li>Fixed an issue where media queries failed to re-evaluate during viewport resizing when CSS anchor positioning and viewport units were both in use. (172864699)</li>
<li>Fixed an issue where chains of three or more anchor-positioned elements didn’t resolve correctly. (173357622)</li>
<li>Fixed an issue where <code>anchor()</code> fallback values did not accept unitless zero. (173554237)</li>
<li>Fixed an issue where an element with <code>display: contents</code> did not establish an anchor scope when using <code>anchor-scope</code>. (173718365)</li>
<li>Fixed an issue where fixed-position boxes anchored to children of sticky-positioned boxes did not stick correctly. (173722628)</li>
</ul>
<h3>Improvements to Hanging Punctuation</h3>
<p>This release includes two fixes for hanging-punctuation.</p>
<ul>
<li>Fixed <code>hanging-punctuation</code> to correctly treat U+0027 (apostrophe) and U+0022 (quotation mark) as hangable quote characters. (172668971)</li>
<li>Fixed an issue where ideographic space did not hang when using <code>hanging-punctuation: first</code>. (172669250)</li>
</ul>
<p class="codepen" data-height="610" data-pen-title="Hanging Punctuation" data-default-tab="css,result" data-slug-hash="dPOyYLK" data-editable="true" data-user="jensimmons" data-token="e86065f2743d41bcdb554c5131c6c85f" style="height: 610px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<h3>Improvements to Scroll-Driven Animations</h3>
<p>Scroll-driven animations are a powerful recent addition to CSS, and this release includes four fixes that improve their reliability.</p>
<ul>
<li>Fixed support for the <code>scroll</code> animation timeline range name in scroll-driven animations. (171630023)</li>
<li>Fixed an issue where scroll-driven animations were not properly paused when <code>animation-play-state</code> was dynamically set to <code>paused</code>. (171630127)</li>
<li>Fixed an issue where view timeline animations near the 0% and 100% thresholds reported incorrect progress values. (171630157)</li>
<li>Fixed an issue where animation timelines could fail to restore correctly after navigating back to a page from the back-forward cache. (174561577)</li>
</ul>
<h3>Improvements to Block-in-Inline Layout</h3>
<p>Work continues on the layout engine rewrite for block-in-inline contexts, with several fixes in this release.</p>
<ul>
<li>Fixed an issue where content inside inline elements with block-level children and rendering layers was not displayed correctly. (171101386)</li>
<li>Fixed an issue where <code>getClientRects()</code> could return rects with zero width and height for spans in multi-column layouts. (171101490)</li>
<li>Fixed an issue where an empty <code>&lt;span&gt;</code> with decoration was incorrectly positioned when a sibling block margin was present inside a block-in-inline context. (171101555)</li>
<li>Fixed an issue where a <code>&lt;br&gt;</code> element was incorrectly positioned inside a block-in-inline context when a block margin was present. (171101748)</li>
<li>Fixed a layout regression where absolutely positioned elements inside block-in-inline containers were incorrectly overlapping adjacent content. (171732203)</li>
</ul>
<h3>Improvements to Grid, Flexbox, Tables, Multicolumn</h3>
<ul>
<li>Fixed an issue where a <code>display: grid</code> subgrid inside a <code>grid-lanes</code> container incorrectly contributed its items&#8217; intrinsic sizes to the parent&#8217;s track sizing algorithm. (171230544)</li>
<li>Fixed an issue in collapsed border tables where the border style of a cell adjacent to a <code>rowspan</code> cell was incorrectly applied across the full length of the spanning cell&#8217;s border. (171634786)</li>
<li>Fixed an issue where images could appear stretched inside certain flex and grid layout configurations. (172224411)</li>
<li>Fixed a regression where content with <code>column-count: 1</code> could fail to display text. (172306151)</li>
</ul>
<h3>Improvements to zoom</h3>
<p>This release includes a focused quality pass on rendering behavior at different zoom levels.</p>
<ul>
<li>Fixed an issue where grid and flex layout could cause elements to shift position at certain zoom levels. (172118478)</li>
<li>Fixed an issue where text content could get cut off inside overflow containers when the page was zoomed in. (172118721)</li>
<li>Fixed an issue where pinch-to-zoom could cause web content to jump or disappear on some websites. (172507916)</li>
<li>Fixed an issue where <code>lh</code> and <code>rlh</code> units resolved with double-zoom when <code>line-height</code> is a number. (173515568)</li>
<li>Fixed an issue where the <code>rlh</code> unit was double-zoomed when resolving with evaluation-time zoom for unzoomed properties. (173518838)</li>
<li>Fixed an issue where <code>aspect-ratio</code> was not honored correctly when the page was zoomed in. (174498486)</li>
</ul>
<h3>Even more improvements to CSS</h3>
<ul>
<li>Fixed an issue where <code>@font-face</code> rules with different styles could incorrectly fall back to glyphs from other faces in the same family, rather than proceeding to the next family as specified by the font matching algorithm. (172390840)</li>
<li>Fixed an issue where images inside transformed containers were not properly centered. (172475726)</li>
<li>Fixed an issue where user-installed font variants could interfere with system font matching, causing incorrect fonts to be selected. (173345107)</li>
<li>Fixed a regression where animating to an implicit value for individual transform properties failed to animate. (173717819)</li>
<li>Fixed an issue where <code>:has(:empty)</code> was not invalidated when the content of a child element changed from empty to non-empty. (174501418)</li>
</ul>
<h2>SVG</h2>
<p>WebKit for Safari 26.5 adds support for the <code>color-interpolation</code> attribute on SVG gradients, enabling <code>linearRGB</code> color space interpolation.</p>
<pre><code class="html"><span class="tag">&lt;<span class="keyword">linearGradient</span> <span class="keyword attribute">color-interpolation</span>=<span class="attribute value string">"linearRGB"</span>&gt;</span>
  <span class="tag">&lt;<span class="keyword">stop</span> <span class="keyword attribute">offset</span>=<span class="attribute value string">"0%"</span> <span class="keyword attribute">stop-color</span>=<span class="attribute value string">"red"</span> /&gt;</span>
  <span class="tag">&lt;<span class="keyword">stop</span> <span class="keyword attribute">offset</span>=<span class="attribute value string">"100%"</span> <span class="keyword attribute">stop-color</span>=<span class="attribute value string">"blue"</span> /&gt;</span>
<span class="tag">&lt;/<span class="keyword">linearGradient</span>&gt;</span>
</code></pre>
<p>By default, SVG gradients interpolate colors in the <code>sRGB</code> color space. Setting <code>color-interpolation="linearRGB"</code> on a gradient element now produces more perceptually even color transitions, especially noticeable in gradients between saturated colors, where <code>sRGB</code> interpolation can produce a darker or muddier midpoint than expected.</p>
<p class="codepen" data-height="527" data-pen-title="SVG Gradient Color Interpolation" data-default-tab="html,result" data-slug-hash="XJNWqKa" data-editable="true" data-user="jensimmons" style="height: 527px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;">
<h3>Improvements to SVG</h3>
<p>The work continues making significant improvements to SVG.</p>
<ul>
<li>Fixed an issue where <code>removeAttribute</code> for <code>width</code> or <code>height</code> on an SVG root element did not reset to the initial default values. (172132798)</li>
<li>Fixed event name mapping for <code>onbegin</code>, <code>onend</code>, and <code>onrepeat</code> on <code>SVGAnimationElement</code> and added the missing <code>onend</code> event handler. (172581017)</li>
<li>Fixed an issue where an SVG <code>&lt;image&gt;</code> element was not repainted when its <code>href</code> attribute was removed. (172875166)</li>
<li>Fixed an issue where UI events such as wheel failed to fire for inner SVG elements. (173009454)</li>
<li>Fixed an issue where SVG cursors set via <code>cursor: url()</code> appeared blurry on high DPI displays. (173950927)</li>
</ul>
<h2>Web API</h2>
<h3>ToggleEvent.source</h3>
<p>Safari 26.5 adds support for the <code>source</code> property on <code>ToggleEvent</code>. Now, when a popover or other toggleable element is toggled, the event includes a reference to the element that triggered the action, such as the invoker button that opened a popover. This makes it straightforward to coordinate behavior between a trigger and its target without manually tracking that relationship in your own code.</p>
<pre><code class="js"><span class="identifier">popover</span>.<span class="identifier">addEventListener</span>(<span class="string">"toggle"</span>, (<span class="identifier">e</span>) <span class="operator">=</span><span class="operator">&gt;</span> {                                                                           
  <span class="keyword control">if</span> (<span class="identifier">e</span>.<span class="identifier">newState</span> <span class="operator">=</span><span class="operator">=</span><span class="operator">=</span> <span class="string">"open"</span>) {                                                                                        
    <span class="identifier">console</span>.<span class="identifier">log</span>(<span class="string">"Opened by:"</span>, <span class="identifier">e</span>.<span class="identifier">source</span>);                                                                              
  }                                                                                                                   
}); 
</code></pre>
<h3>Origin API</h3>
<p>Safari 26.5 also adds support for the Origin API, which exposes origin information as a structured <code>Origin</code> object rather than requiring string parsing. This also enables you to perform same-site comparisons between origins without having to pull in the Public Suffix List. <code>Origin.from(value)</code> allows you to construct an <code>Origin</code> object from a string or built-in object, such as <code>MessageEvent</code>. When the origins from built-in objects are opaque, you can still compare them. This wasn’t possible before as you only had access to the serialized origin, which is “<code>null</code>” for opaque origins.</p>
<pre><code class="js"><span class="keyword type">const</span> <span class="identifier">messageOrigin</span> <span class="operator">=</span> <span class="identifier">Origin</span>.<span class="identifier">from</span>(<span class="identifier">messageEvent</span>);
<span class="keyword type">const</span> <span class="identifier">localOrigin</span> <span class="operator">=</span> <span class="identifier">Origin</span>.<span class="identifier">from</span>(<span class="string">"https://social.example"</span>);
<span class="keyword control">if</span> (<span class="identifier">messageOrigin</span>.<span class="identifier">isSameSite</span>(<span class="identifier">localOrigin</span>))
    <span class="identifier">grantAccess</span>();
</code></pre>
<h3>Improvements to Web API</h3>
<ul>
<li>Fixed an issue where <code>DecompressionStream</code> discarded valid decompressed output when extra trailing bytes were present after the compressed stream, instead of enqueuing the output before throwing. (171020155)</li>
<li>Fixed an issue where calling <code>preventDefault()</code> on <code>pointerdown</code> events did not prevent page scrolling when only passive touch event listeners are installed. (173988278)</li>
</ul>
<h2>Additional Resolved Issues</h2>
<p>In addition to all the fixes described above, WebKit for Safari 26.5 also includes the following improvements:</p>
<h3>Accessibility</h3>
<ul>
<li>Fixed an issue where the accessibility tree could permanently be empty if built during early page load when only a scroll area and web area were present. (174244620)</li>
</ul>
<h3>Editing</h3>
<ul>
<li>Fixed an issue where pressing backspace on a line below an image in a <code>contenteditable</code> region could place the cursor in the wrong position. (171850465)</li>
<li>Fixed an issue where emoji images copied from websites and pasted into other sites appeared broken due to cross-origin resource policy blocking the SVG image sources. (172775070)</li>
<li>Fixed an issue where pasting text into an empty list item created an extra blank bullet. (173275372)</li>
</ul>
<h3>Forms</h3>
<ul>
<li>Fixed an issue where a <code>readonly</code> date <code>&lt;input&gt;</code> could still be edited via keyboard using the date picker. (171535893)</li>
<li>Fixed an issue on iOS and iPadOS where <code>datalist</code> suggestions were presented directly over the associated input, obscuring it. (174264299)</li>
</ul>
<h3>HTML</h3>
<ul>
<li>Fixed <code>dragenter</code> and <code>dragleave</code> events to include <code>relatedTarget</code> in the event object. (172048448)</li>
<li>Fixed an issue on iOS where the drag thumbnail could show an incorrect image after long-pressing an image with an embedded link. (172293971)</li>
</ul>
<h3>Images</h3>
<ul>
<li>Fixed a regression where images with <code>srcset</code> and <code>sizes</code> attributes containing <code>calc()</code> expressions with division by zero were not displayed. (173954748)</li>
</ul>
<h3>JavaScript</h3>
<ul>
<li>Fixed <code>TypedArray.prototype.sort()</code> failing when the comparison function accesses the <code>.buffer</code> property of the typed array. (172516044)</li>
</ul>
<h3>Media</h3>
<ul>
<li>Fixed an issue where the media controls volume button was mispositioned and overlapped with other controls in right-to-left locales. (171182590)</li>
<li>Fixed an issue where <code>MediaCapabilities.decodingInfo()</code> always returned <code>false</code> for <code>spatialRendering</code>. (172689752)</li>
</ul>
<h3>Networking</h3>
<ul>
<li>Fixed an issue where downloaded files used the file extension from the URL path instead of the HTTP <code>Content-Type</code> header. (173705083)</li>
<li>Fixed an issue where downloaded files were saved with incorrect or missing file extensions when the URL path extension did not match the HTTP <code>Content-Type</code> header. (173945210)</li>
</ul>
<h3>Scrolling</h3>
<ul>
<li>Fixed an issue where scroll-snap re-snapping after layout changes could cause incorrect scroll positions, resulting in the wrong content being shown. (171541221)</li>
</ul>
<h3>Storage</h3>
<ul>
<li>Fixed an issue where IndexedDB connections could become permanently broken until the page was reloaded. (172247569)</li>
<li>Fixed an issue where <code>document.hasStorageAccess()</code> could return a Promise that never resolves. (172424614)</li>
</ul>
<h3>Web Extensions</h3>
<ul>
<li>Fixed an issue where extensions with a trailing comma in <code>manifest.json</code> failed to load in Safari. (172120877)</li>
</ul>
<h3>WebGL</h3>
<ul>
<li>Fixed WebGL shader compilation to properly handle <code>NaN</code> and <code>infinity</code> values. (166699074)</li>
</ul>
<h3>WebRTC</h3>
<ul>
<li>Fixed <code>RTCIceCandidate.toJSON()</code> to include the <code>usernameFragment</code> property in its serialized output. (172689343)</li>
<li>Fixed <code>RTCRtpSender</code> to allow a <code>maxFramerate</code> value of 0. (172689374)</li>
<li>Fixed <code>RTCRtpSynchronizationSource.timestamp</code> to use the correct time base. (172689387)</li>
<li>Fixed an issue where remote audio and video track IDs were incorrectly derived from SDP. (172689452)</li>
<li>Fixed <code>RTCRtpTransceiver.setCodecPreferences()</code> to accept codecs with case-insensitive <code>mimeType</code> matching. (172689477)</li>
<li>Fixed an issue where the camera did not turn on automatically in Google Meet when media permissions were set to &#8220;Allow&#8221;. (174023905)</li>
</ul>
<h2>Updating to Safari 26.5</h2>
<p>Safari 26.5 is available on iOS 26.5, iPadOS 26.5, visionOS 26.5, macOS Tahoe 26.5, plus macOS Sequoia, and macOS Sonoma. On iOS, iPadOS, and visionOS, you can update to Safari 26.5 as part of the OS update in Settings > General > Software Update. On macOS, Safari updates are delivered through System Settings > General > Software Update.</p>
<h2>Feedback</h2>
<p>We love hearing from you. To share your thoughts, find us online: Jen Simmons on <a href="https://bsky.app/profile/jensimmons.bsky.social">Bluesky</a> / <a href="https://front-end.social/@jensimmons">Mastodon</a>, Saron Yitbarek on <a href="https://bsky.app/profile/saron.bsky.social">BlueSky</a> / <a href="https://front-end.social/@saron">Mastodon</a>, and Jon Davis on <a href="https://bsky.app/profile/jondavis.bsky.social">Bluesky</a> / <a href="https://mastodon.social/@jondavis">Mastodon</a>. You can follow WebKit <a href="https://www.linkedin.com/in/apple-webkit/">on LinkedIn</a>.</p>
<p>If you run into any issues, we welcome your <a href="https://bugs.webkit.org/">bug report</a>. Filing issues really does make a difference.</p>
<p>You can also find this information in the <a href="https://developer.apple.com/documentation/safari-release-notes/">Safari release notes</a>.</p>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Release Notes for Safari Technology Preview 243</title>
		<link>https://webkit.org/blog/17953/release-notes-for-safari-technology-preview-243/</link>
		
		<dc:creator/>
		<pubDate>Thu, 07 May 2026 22:06:53 +0000</pubDate>
				<category><![CDATA[Safari Technology Preview]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17953</guid>

					<description><![CDATA[Safari Technology Preview Release 243 is now available for download for macOS Tahoe and macOS Sequoia.]]></description>
										<content:encoded><![CDATA[<p><a href="https://webkit.org/blog/6017/introducing-safari-technology-preview/">Safari Technology Preview</a> Release 243 is now <a href="https://developer.apple.com/safari/resources/">available for download</a> for macOS Tahoe and macOS Sequoia. If you already have Safari Technology Preview installed, you can update it in System Settings under General → Software Update.</p>
<p>This release includes WebKit changes between: <a href="https://github.com/WebKit/WebKit/compare/f037d92e0ac2bad469eee55c1bb0447e004f6970...f6d1b6eb589dcf909f1770238f5a682260990f73">310600@main&#8230;312007@main</a>.</p>
<h3>Accessibility</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where the <code>contextmenu</code> event was not fired for elements inside iframes when triggered by keyboard or assistive technology actions such as VoiceOver&#8217;s VO+Shift+M. (<a href="https://commits.webkit.org/310897@main">310897@main</a>)  (164128676)</li>
<li>Fixed an issue where color picker inputs could not be activated using VoiceOver&#8217;s press action. (<a href="https://commits.webkit.org/311168@main">311168@main</a>)  (172218114)</li>
<li>Fixed invalidation of aria-hidden=&#8221;true&#8221; when focus lands inside the aria-hidden subtree. (<a href="https://commits.webkit.org/311648@main">311648@main</a>)  (174449524)</li>
<li>Fixed VoiceOver support for base <code>&lt;select&gt;</code> elements, including closing the popover on selection and correcting accessibility path positioning when CSS transforms are present. (<a href="https://commits.webkit.org/311587@main">311587@main</a>)  (175058883)</li>
</ul>
<h3>Animations</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>!important</code> declarations did not override CSS animation values when CSS transitions were also running on the same property. (<a href="https://commits.webkit.org/310810@main">310810@main</a>)  (174367827)</li>
<li>Fixed an issue where identity matrix decomposition generated invalid quaternions, resulting in incorrect transform animations. (<a href="https://commits.webkit.org/311267@main">311267@main</a>)  (174813328)</li>
</ul>
<h3>CSS</h3>
<h4>New Features</h4>
<ul>
<li>Added support for <code>contain: style</code> applying to CSS quote counters, as specified in CSS Containment Level 2. (<a href="https://commits.webkit.org/311785@main">311785@main</a>)  (84758186)</li>
<li>Added support for the <code>insert</code> keyword for the <code>text-autospace</code> property. (<a href="https://commits.webkit.org/311503@main">311503@main</a>)  (175031507)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed flex layout to use the used <code>flex-basis</code> instead of the specified value for definiteness evaluation. (<a href="https://commits.webkit.org/311579@main">311579@main</a>)  (85707621)</li>
<li>Fixed an issue where element positioning was incorrect when the containing block was an anonymous block. (<a href="https://commits.webkit.org/311275@main">311275@main</a>)  (96548847)</li>
<li>Fixed an issue where <code>box-shadow</code> did not work on <code>display: table-row</code> elements. (<a href="https://commits.webkit.org/310609@main">310609@main</a>)  (96914376)</li>
<li>Fixed <code>text-indent</code> with <code>calc()</code> containing percentages to correctly treat percentage components as zero for intrinsic size contributions. (<a href="https://commits.webkit.org/310759@main">310759@main</a>)  (97025949)</li>
<li>Fixed an issue where out-of-flow content had an incorrect height when set to <code>fit-content</code>. (<a href="https://commits.webkit.org/311375@main">311375@main</a>)  (97492632)</li>
<li>Fixed an issue with percentage size resolution in flex items in quirks mode. (<a href="https://commits.webkit.org/311590@main">311590@main</a>)  (100183902)</li>
<li>Fixed an issue where <code>clip-path: inset()</code> border-radius values did not render correctly at certain element and clip-path sizes. (<a href="https://commits.webkit.org/310643@main">310643@main</a>)  (110847266)</li>
<li>Fixed <code>-webkit-box</code> flexbox emulation not sizing children correctly inside <code>&lt;fieldset&gt;</code> elements. (<a href="https://commits.webkit.org/311784@main">311784@main</a>)  (114094538)</li>
<li>Fixed: Improved performance on pages using <code>:where</code> and <code>:is</code> selectors. (<a href="https://commits.webkit.org/311212@main">311212@main</a>)  (114904007)</li>
<li>Fixed an issue where elements with <code>display: table</code> could have incorrect layout when borders were present. (<a href="https://commits.webkit.org/311276@main">311276@main</a>)  (116110440)</li>
<li>Fixed an issue where elements with <code>border</code>, <code>position: absolute</code>, and <code>aspect-ratio: 1</code> were not rendered as squares. (<a href="https://commits.webkit.org/311310@main">311310@main</a>)  (126292577)</li>
<li>Fixed an issue where <code>perspective-origin</code> failed to resolve <code>var()</code> references when used as the second value, preventing animations from being applied. (<a href="https://commits.webkit.org/310650@main">310650@main</a>)  (131288246)</li>
<li>Fixed <code>:focus-visible</code> incorrectly matching after a programmatic <code>focus()</code> call triggered by clicking a button with child elements. (<a href="https://commits.webkit.org/311768@main">311768@main</a>)  (134337357)</li>
<li>Fixed an issue where the bottom margin of a last child element collapsed out of a parent with <code>min-height</code>. (<a href="https://commits.webkit.org/311274@main">311274@main</a>)  (134356544)</li>
<li>Fixed an issue where <code>:has(:empty)</code> continued to match after the targeted element&#8217;s content was dynamically changed to no longer be empty. (<a href="https://commits.webkit.org/310932@main">310932@main</a>)  (143864358)</li>
<li>Fixed an issue where floats and out-of-flow objects could be incorrectly adjacent to anonymous blocks. (<a href="https://commits.webkit.org/311226@main">311226@main</a>)  (144481961)</li>
<li>Fixed an issue where text gradually disappeared when toggling <code>text-transform</code> on elements with <code>::first-letter</code> styling. (<a href="https://commits.webkit.org/311201@main">311201@main</a>)  (145550507)</li>
<li>Fixed an issue where <code>height: max-content</code> resolved to zero on absolutely positioned elements when a child had <code>max-height: 100%</code>. (<a href="https://commits.webkit.org/311084@main">311084@main</a>)  (147333178)</li>
<li>Fixed an issue where an <code>inline-flex</code> container with <code>flex-direction: column</code> did not update its width to match the intrinsic size of a child image when the image was not cached. (<a href="https://commits.webkit.org/311141@main">311141@main</a>)  (150260401)</li>
<li>Fixed an issue where non-replaced elements with <code>aspect-ratio</code> enforced the automatic minimum size even when <code>min-width</code> was explicitly set to <code>0</code>. (<a href="https://commits.webkit.org/311096@main">311096@main</a>)  (156837730)</li>
<li>Fixed an issue where an element can&#8217;t anchor to its previous sibling. (<a href="https://commits.webkit.org/310970@main">310970@main</a>)  (162903640)</li>
<li>Fixed a regression where <code>@scope</code> styles did not apply to slotted elements in web components. (<a href="https://commits.webkit.org/311333@main">311333@main</a>)  (171383788)</li>
<li>Fixed an issue where dynamically inserting text before existing content did not update <code>::first-letter</code> styling. (<a href="https://commits.webkit.org/310719@main">310719@main</a>)  (171649994)</li>
<li>Fixed an issue where ordered list numbers with large starting values were clipped off-screen. (<a href="https://commits.webkit.org/311332@main">311332@main</a>)  (172515216)</li>
<li>Fixed a regression where the <code>ic</code> length unit was incorrectly affected by page scaling. (<a href="https://commits.webkit.org/311238@main">311238@main</a>)  (173198587)</li>
<li>Fixed <code>:placeholder-shown</code> to correctly match input elements that have an empty <code>placeholder</code> attribute. (<a href="https://commits.webkit.org/310781@main">310781@main</a>)  (173604635)</li>
<li>Fixed computed value of auto insets or margins as returned by <code>getComputedStyle()</code> to be zero, if the element uses <code>position-area</code> or <code>anchor-center</code>. (<a href="https://commits.webkit.org/311016@main">311016@main</a>)  (173885561)</li>
<li>Fixed <code>position-area</code> not being able to anchor to an element positioned using anchor functions. (<a href="https://commits.webkit.org/311601@main">311601@main</a>)  (173964030)</li>
<li>Fixed CSS variable cycle detection to match the CSS Values Level 5 specification. (<a href="https://commits.webkit.org/310610@main">310610@main</a>)  (174105259)</li>
<li>Fixed <code>url()</code> token serialization in CSS custom properties. (<a href="https://commits.webkit.org/310628@main">310628@main</a>)  (174144616)</li>
<li>Fixed <code>text-autospace</code> to correctly handle supplementary Unicode characters. (<a href="https://commits.webkit.org/310633@main">310633@main</a>)  (174148315)</li>
<li>Fixed an issue where flex items with different <code>order</code> values caused incorrect baseline alignment. (<a href="https://commits.webkit.org/310704@main">310704@main</a>)  (174241817)</li>
<li>Fixed an issue where hovering over <code>::first-letter</code> text showed a pointer cursor instead of the expected I-beam cursor. (<a href="https://commits.webkit.org/310730@main">310730@main</a>)  (174258447)</li>
<li>Fixed an issue where <code>display: grid</code> on a <code>&lt;fieldset&gt;</code> element added extra unnecessary space below its content. (<a href="https://commits.webkit.org/311078@main">311078@main</a>)  (174301311)</li>
<li>Fixed outline radii rendering for elements with a non-auto <code>outline-style</code>. (<a href="https://commits.webkit.org/310784@main">310784@main</a>)  (174328839)</li>
<li>Fixed an issue where <code>aspect-ratio</code> was not honored when the page was zoomed in. (<a href="https://commits.webkit.org/310931@main">310931@main</a>)  (174361289)</li>
<li>Fixed replaced elements to use the transferred size through intrinsic aspect ratio for min-content and max-content sizing. (<a href="https://commits.webkit.org/310885@main">310885@main</a>)  (174386310)</li>
<li>Fixed an issue where <code>height: 100%</code> on a child element altered the layout when the parent&#8217;s height was defined via <code>aspect-ratio</code>. (<a href="https://commits.webkit.org/310877@main">310877@main</a>)  (174448267)</li>
<li>Fixed margin collapse to be allowed when the preferred block size behaves as auto, per the CSS Sizing specification. (<a href="https://commits.webkit.org/311011@main">311011@main</a>)  (174547610)</li>
<li>Fixed an issue where <code>document.styleSheets</code> and <code>shadowRoot.styleSheets</code> incorrectly included adopted style sheets, which per the CSSOM specification should only appear in the final CSS style sheets list used for style resolution. (<a href="https://commits.webkit.org/311074@main">311074@main</a>)  (174583340)</li>
<li>Fixed the CSSOM preferred style sheet set name to be established at sheet creation time based on insertion order rather than tree order. (<a href="https://commits.webkit.org/311077@main">311077@main</a>)  (174586058)</li>
<li>Fixed highlight pseudo-elements such as <code>::selection</code> and <code>::highlight</code> to disallow vendor-prefixed properties, aligning with the CSS Pseudo-Elements specification. (<a href="https://commits.webkit.org/311073@main">311073@main</a>)  (174590593)</li>
<li>Fixed cycle detection and nested function call handling in CSS custom functions. (<a href="https://commits.webkit.org/311178@main">311178@main</a>)  (174609179)</li>
<li>Fixed an issue where <code>word-break: break-all</code> incorrectly allowed CJK close punctuation to appear at the start of a line. (<a href="https://commits.webkit.org/311088@main">311088@main</a>)  (174656971)</li>
<li>Fixed an issue where <code>word-break: keep-all</code> incorrectly suppressed line break opportunities at CJK punctuation characters. (<a href="https://commits.webkit.org/311090@main">311090@main</a>)  (174658701)</li>
<li>Fixed the <code>FontFace</code> constructor to reject with a <code>SyntaxError</code> instead of a <code>NetworkError</code> when a <code>BufferSource</code> fails to parse, per the CSS Font Loading specification. (<a href="https://commits.webkit.org/311146@main">311146@main</a>)  (174669738)</li>
<li>Fixed the <code>FontFace</code> <code>family</code> attribute to return the serialization of the parsed value. (<a href="https://commits.webkit.org/311478@main">311478@main</a>)  (174698351)</li>
<li>Fixed grid layout to correctly handle percentage and <code>calc()</code> values for the specified size suggestion. (<a href="https://commits.webkit.org/311344@main">311344@main</a>)  (174863227)</li>
<li>Fixed <code>:has()</code> sibling invalidation issues related to relation forwarding. (<a href="https://commits.webkit.org/311583@main">311583@main</a>)  (175006235)</li>
<li>Fixed an issue where <code>min-width: auto</code> was not correctly computed for flex items. (<a href="https://commits.webkit.org/311578@main">311578@main</a>)  (175157619)</li>
<li>Fixed an issue where percentage heights inside flex items did not resolve correctly in quirks mode. (<a href="https://commits.webkit.org/311581@main">311581@main</a>)  (175158571)</li>
<li>Fixed an issue where <code>margin-trim: block-start</code> did not apply to blocks nested inside inline boxes. (<a href="https://commits.webkit.org/311584@main">311584@main</a>)  (175162899)</li>
<li>Fixed an issue where dynamically changing <code>display: contents</code> on a <code>&lt;fieldset&gt;</code> legend caused incorrect rendering. (<a href="https://commits.webkit.org/311585@main">311585@main</a>)  (175163337)</li>
<li>Fixed: Improved <code>:has()</code> invalidation performance by including the full selector context in invalidation selectors. (<a href="https://commits.webkit.org/311642@main">311642@main</a>)  (175177078)</li>
<li>Fixed the CSS preload scanner to resolve relative <code>@import</code> URLs against the <code>&lt;base&gt;</code> element URL. (<a href="https://commits.webkit.org/311744@main">311744@main</a>)  (175305190)</li>
<li>Fixed <code>-webkit-box</code> flex distribution for children with orthogonal writing modes. (<a href="https://commits.webkit.org/311787@main">311787@main</a>)  (175323734)</li>
<li>Fixed <code>calc(infinity)</code> as a <code>flex-grow</code> factor not stretching a flex item to 100% width. (<a href="https://commits.webkit.org/311956@main">311956@main</a>)  (175431146)</li>
<li>Fixed <code>:has()</code> sibling invalidation failing due to an internal bitfield overflow, causing stale styles when siblings are added or removed. (<a href="https://commits.webkit.org/311870@main">311870@main</a>)  (175433733)</li>
<li>Fixed <code>:has()</code> invalidation for sibling combinators when elements are inserted or removed from the DOM. (<a href="https://commits.webkit.org/311893@main">311893@main</a>)  (175441568)</li>
<li>Fixed <code>transition-property</code> not preserving the specified case of <code>&lt;custom-ident&gt;</code> values during serialization. (<a href="https://commits.webkit.org/311909@main">311909@main</a>)  (175467206)</li>
<li>Fixed the <code>will-change</code> property not serializing correctly when used with non-property identifiers or identifiers in a non-standard case. (<a href="https://commits.webkit.org/311918@main">311918@main</a>)  (175482352)</li>
<li>Fixed percentage <code>top</code> and <code>bottom</code> values on relatively positioned elements not resolving when the containing block has <code>aspect-ratio</code>. (<a href="https://commits.webkit.org/311942@main">311942@main</a>)  (175502356)</li>
<li>Fixed: Updated the enhanced <code>&lt;select&gt;</code> element to use <code>self-*</code> keywords for anchor positioning. (<a href="https://commits.webkit.org/311944@main">311944@main</a>)  (175505107)</li>
<li>Fixed <code>text-indent</code> computation when tab stop positions are involved. (<a href="https://commits.webkit.org/311971@main">311971@main</a>)  (175529961)</li>
<li>Fixed <code>calc()</code> margin computations in flex layout. (<a href="https://commits.webkit.org/311977@main">311977@main</a>)  (175532405)</li>
<li>Fixed <code>calc()</code> margin computations for block, fieldset, and table caption layouts. (<a href="https://commits.webkit.org/311987@main">311987@main</a>)  (175548980)</li>
<li>Fixed handling of <code>&lt;li&gt;</code> <code>value</code> attributes in reversed ordered lists. (<a href="https://commits.webkit.org/311996@main">311996@main</a>)  (175558324)</li>
</ul>
<h3>Canvas</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where conic gradients applied to canvas arc strokes were not rendered correctly. (<a href="https://commits.webkit.org/310865@main">310865@main</a>)  (173536875)</li>
</ul>
<h3>Editing</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where characters styled with <code>::first-letter</code> were not selectable. (<a href="https://commits.webkit.org/311287@main">311287@main</a>)  (5688237)</li>
<li>Fixed font size 13pt being incorrectly mapped to <code>&lt;font size="2"&gt;</code> (10pt) when using rich text editing. (<a href="https://commits.webkit.org/311700@main">311700@main</a>)  (15292320)</li>
<li>Fixed an issue where adjusting text selection with touch handles was prevented by JavaScript touch event handling on some websites. (<a href="https://commits.webkit.org/311216@main">311216@main</a>)  (151851274)</li>
<li>Fixed an issue where text selection was lost when focus transitioned from a <code>contentEditable</code> element to a non-editable target. (<a href="https://commits.webkit.org/310670@main">310670@main</a>)  (171221909)</li>
</ul>
<h3>Encoding</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where CJK encoding state was not reset appropriately during text decoding. (<a href="https://commits.webkit.org/311075@main">311075@main</a>)  (174649963)</li>
</ul>
<h3>Forms</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>&lt;select&gt;</code> control rendering was broken in vertical writing mode. (<a href="https://commits.webkit.org/310622@main">310622@main</a>)  (174068353)</li>
<li>Fixed a performance issue where parsing <code>&lt;select&gt;</code> elements with thousands of <code>&lt;option&gt;</code> children via <code>innerHTML</code> caused O(n²) overhead due to repeated list recalculation. (<a href="https://commits.webkit.org/310930@main">310930@main</a>)  (174244946)</li>
<li>Fixed an issue where date and time input types without <code>min</code> or <code>max</code> attributes incorrectly matched the <code>:in-range</code> pseudo-class. (<a href="https://commits.webkit.org/311279@main">311279@main</a>)  (174829899)</li>
<li>Fixed an issue where cloned <code>&lt;input&gt;</code> and <code>&lt;textarea&gt;</code> elements did not preserve their user-modified state. (<a href="https://commits.webkit.org/311346@main">311346@main</a>)  (174892989)</li>
<li>Fixed <code>&lt;option&gt;</code> elements to correctly implement the HTML specification&#8217;s dirtiness concept for tracking user-modified <code>selected</code> state. (<a href="https://commits.webkit.org/311746@main">311746@main</a>)  (175306111)</li>
<li>Fixed the default <code>display</code> value for <code>&lt;optgroup&gt;</code> and <code>&lt;option&gt;</code> elements to <code>block</code>, matching the behavior of other browsers. (<a href="https://commits.webkit.org/311911@main">311911@main</a>)  (175473184)</li>
</ul>
<h3>HTML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>shadowrootslotassignment</code> attribute on declarative shadow roots. (<a href="https://commits.webkit.org/311295@main">311295@main</a>)  (173227340)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed parsing of <code>javascript:</code> URLs to align with the specification. (<a href="https://commits.webkit.org/311381@main">311381@main</a>)  (147612682)</li>
<li>Fixed the HTML preload scanner to skip preloading stylesheets that have the <code>disabled</code> attribute. (<a href="https://commits.webkit.org/311776@main">311776@main</a>)  (173378582)</li>
<li>Fixed document named item collection to include all <code>&lt;object&gt;</code> elements, aligning with other browser engines. (<a href="https://commits.webkit.org/310974@main">310974@main</a>)  (174537345)</li>
<li>Fixed <code>window.open()</code> to correctly consume user activation when creating a new browsing context, aligning with the HTML specification. (<a href="https://commits.webkit.org/311026@main">311026@main</a>)  (174587258)</li>
<li>Fixed remaining issues with <code>&lt;img sizes="auto"&gt;</code> to fully align with the specification. (<a href="https://commits.webkit.org/311138@main">311138@main</a>)  (174684058)</li>
<li>Fixed an issue where <code>dir=auto</code> on <code>&lt;slot&gt;</code> elements did not update when slotted content changed. (<a href="https://commits.webkit.org/311325@main">311325@main</a>)  (174871706)</li>
<li>Fixed an issue where <code>&lt;option&gt;</code> elements rendered incorrectly when the <code>label</code> attribute was empty. (<a href="https://commits.webkit.org/311421@main">311421@main</a>)  (174979446)</li>
<li>Fixed an issue where the preload scanner incorrectly skipped <code>&lt;source&gt;</code> elements with an empty <code>type</code> attribute inside <code>&lt;picture&gt;</code>. (<a href="https://commits.webkit.org/311568@main">311568@main</a>)  (175094037)</li>
<li>Fixed <code>innerText</code> to emit a newline for empty <code>&lt;option&gt;</code> or <code>&lt;optgroup&gt;</code> inside <code>&lt;select&gt;</code>. (<a href="https://commits.webkit.org/311673@main">311673@main</a>)  (175245381)</li>
<li>Fixed HTML floating-point number parsing to correctly handle values with a leading <code>+</code> sign. (<a href="https://commits.webkit.org/311735@main">311735@main</a>)  (175300431)</li>
<li>Fixed keyboard focus getting stuck when tabbing through iframes that do not contain any focusable elements. (<a href="https://commits.webkit.org/311922@main">311922@main</a>)  (175375806)</li>
</ul>
<h4>Deprecations</h4>
<ul>
<li>Deprecated the <code>href</code> attribute on all MathML elements except <code>&lt;a&gt;</code>. (<a href="https://commits.webkit.org/311550@main">311550@main</a>)  (173996661)</li>
</ul>
<h3>JavaScript</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed multiple top-level await correctness bugs with a rewrite of the ES module loader for standards compliance. (<a href="https://commits.webkit.org/311236@main">311236@main</a>)  (97370038)</li>
<li>Fixed regular expressions in Unicode mode to not count non-capturing groups and modifiers toward the number of available backreferences. (<a href="https://commits.webkit.org/311974@main">311974@main</a>)  (167746769)</li>
<li>Fixed an issue where regular expressions with non-BMP characters could skip valid match positions when alternating between patterns. (<a href="https://commits.webkit.org/310677@main">310677@main</a>)  (174200307)</li>
<li>Fixed an issue where regular expression captures were not properly cleared when backtracking out of fixed-count parenthesized groups and negative lookaheads. (<a href="https://commits.webkit.org/310679@main">310679@main</a>)  (174201284)</li>
<li>Fixed an issue where <code>import { "*" as x }</code> was incorrectly treated as a namespace import instead of a named import using the string <code>"*"</code> as a ModuleExportName. (<a href="https://commits.webkit.org/310776@main">310776@main</a>)  (174314099)</li>
<li>Fixed an issue where <code>RegExp.prototype.exec</code> and <code>RegExp.prototype.test</code> could match against a stale pattern if <code>lastIndex</code> has a <code>valueOf</code> that calls <code>RegExp.prototype.compile</code>. (<a href="https://commits.webkit.org/310887@main">310887@main</a>)  (174461752)</li>
<li>Fixed an issue where async functions using module-scoped variables could fail when the DFG JIT optimized scope resolution. (<a href="https://commits.webkit.org/311044@main">311044@main</a>)  (174626957)</li>
<li>Fixed an issue where <code>Intl.Segmenter</code> with <code>granularity: "word"</code> incorrectly reported <code>isWordLike: false</code> for numeric segments. (<a href="https://commits.webkit.org/311507@main">311507@main</a>)  (175057894)</li>
<li>Fixed <code>Object.defineProperties</code> to call Proxy traps in the correct order. (<a href="https://commits.webkit.org/311520@main">311520@main</a>)  (175068687)</li>
<li>Fixed an issue where <code>Intl.Locale</code> did not canonicalize before overriding the language. (<a href="https://commits.webkit.org/311538@main">311538@main</a>)  (175092327)</li>
<li>Fixed time zone identifiers to return primary IANA time zone IDs instead of legacy ICU identifiers. (<a href="https://commits.webkit.org/311604@main">311604@main</a>)  (175098682)</li>
<li>Fixed <code>Intl.DateTimeFormat</code> to preserve the original legacy timezone identifier instead of replacing it with the primary IANA ID. (<a href="https://commits.webkit.org/311724@main">311724@main</a>)  (175206605)</li>
<li>Fixed <code>Promise.prototype.finally</code> to throw a <code>TypeError</code> when <code>@@species</code> is not a constructor, matching the behavior of other browsers. (<a href="https://commits.webkit.org/311725@main">311725@main</a>)  (175290627)</li>
<li>Fixed the regular expression engine to reject dangling hyphens in character class syntax when using the <code>/v</code> flag. (<a href="https://commits.webkit.org/311999@main">311999@main</a>)  (175559808)</li>
</ul>
<h3>Media</h3>
<h4>New Features</h4>
<ul>
<li>Added support for setting <code>TextTrackCue.endTime</code> to <code>Infinity</code> to represent an unbounded cue duration. (<a href="https://commits.webkit.org/311730@main">311730@main</a>)  (71042767)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue on iPad where exiting fullscreen on a media document incorrectly navigated back to the previous page instead of returning to the inline view. (<a href="https://commits.webkit.org/310718@main">310718@main</a>)  (137220651)</li>
<li>Fixed an issue where the darkening overlay on inline video controls made accurate scrubbing difficult and displayed video content incorrectly on macOS. (<a href="https://commits.webkit.org/311473@main">311473@main</a>)  (161271114)</li>
<li>Fixed <code>HTMLMediaElement.currentTime</code> to report smoothly progressing values instead of updating only at fixed intervals. (<a href="https://commits.webkit.org/311867@main">311867@main</a>)  (170115677)</li>
<li>Fixed Encrypted Media Extensions to check support for the full content type including codecs, rather than only the MIME type. (<a href="https://commits.webkit.org/310696@main">310696@main</a>)  (173852931)</li>
<li>Fixed an issue where the volume slider in video media controls could not be dragged. (<a href="https://commits.webkit.org/311328@main">311328@main</a>)  (174179871)</li>
<li>Fixed an issue where setting <code>HTMLMediaElement.volume</code> had no effect when the element was connected to an <code>AudioContext</code>. (<a href="https://commits.webkit.org/310958@main">310958@main</a>)  (174278899)</li>
<li>Fixed a regression where videos would stop playing and lose audio after a few seconds on some websites. (<a href="https://commits.webkit.org/311698@main">311698@main</a>)  (174966899)</li>
<li>Fixed an issue where U+0000 (NULL) characters were not allowed in <code>VTTCue</code> text content. (<a href="https://commits.webkit.org/311539@main">311539@main</a>)  (175084171)</li>
<li>Fixed video content disappearing after switching to another tab and back. (<a href="https://commits.webkit.org/311771@main">311771@main</a>)  (175257980)</li>
<li>Fixed WebVTT cue settings line parsing failures. (<a href="https://commits.webkit.org/311729@main">311729@main</a>)  (175296476)</li>
</ul>
<h3>Networking</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed redirects to <code>data:</code> URLs to be blocked for subresources such as images and scripts, aligning with the Fetch specification. (<a href="https://commits.webkit.org/311023@main">311023@main</a>)  (74165956)</li>
<li>Fixed an issue where the multipart form data parser incorrectly required CRLF after the closing delimiter, causing some web applications to fail to render correctly. (<a href="https://commits.webkit.org/311089@main">311089@main</a>)  (174348783)</li>
</ul>
<h3>PDF</h3>
<h4>Known Issues</h4>
<ul>
<li>Fixed PDF scrollbars to adapt to dark appearance. (<a href="https://commits.webkit.org/311985@main">311985@main</a>)  (174763396)</li>
</ul>
<h3>Rendering</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>::first-letter</code> styles caused <code>Range.getClientRects()</code> and <code>Range.getBoundingClientRect()</code> to return incorrect dimensions. (<a href="https://commits.webkit.org/311085@main">311085@main</a>)  (71546397)</li>
<li>Fixed incorrect distributed height in table rows when a <code>&lt;td&gt;</code> element has an explicit height set. (<a href="https://commits.webkit.org/311001@main">311001@main</a>)  (78549188)</li>
<li>Fixed <code>position: relative</code> on table rows (<code>&lt;tr&gt;</code>) to correctly establish a containing block for absolutely positioned descendants. (<a href="https://commits.webkit.org/310995@main">310995@main</a>)  (94294819)</li>
<li>Fixed incorrect box sizing on inline elements when they have no siblings and their <code>padding-left</code> plus <code>margin-left</code> equals zero. (<a href="https://commits.webkit.org/311080@main">311080@main</a>)  (162376969)</li>
<li>Fixed an issue where space-taking scrollbars did not trigger a proper re-layout when the box size depends on content size. (<a href="https://commits.webkit.org/311766@main">311766@main</a>)  (166836126)</li>
<li>Fixed an issue where images with <code>min-width: fit-content</code> rendered at an incorrect width. (<a href="https://commits.webkit.org/310994@main">310994@main</a>)  (169359566)</li>
<li>Fixed an issue where overlay backgrounds would briefly dim incorrectly when de-compositing in a scrollable container. (<a href="https://commits.webkit.org/311198@main">311198@main</a>)  (171024685)</li>
<li>Fixed a regression where table content intermittently disappeared and reappeared. (<a href="https://commits.webkit.org/311411@main">311411@main</a>)  (171179878)</li>
<li>Fixed an issue with outside list markers when blockification prevents line-box parenting. (<a href="https://commits.webkit.org/311221@main">311221@main</a>)  (173417560)</li>
<li>Fixed an inverted Y-axis comparison that could cause incorrect caret positioning. (<a href="https://commits.webkit.org/310626@main">310626@main</a>)  (174144220)</li>
<li>Fixed an issue where <code>&lt;br&gt;</code> elements with <code>line-height: 0</code> still created extra vertical space, failing to respect the declared line height. (<a href="https://commits.webkit.org/310839@main">310839@main</a>)  (174400946)</li>
<li>Fixed auto outlines to more closely follow the border radii of elements. (<a href="https://commits.webkit.org/310900@main">310900@main</a>)  (174466854)</li>
<li>Fixed rendering of gradients in non-sRGB color spaces. (<a href="https://commits.webkit.org/311406@main">311406@main</a>)  (174880197)</li>
<li>Fixed <code>image-orientation</code> being ignored for <code>background-image</code>, <code>border-image</code>, and <code>list-style-image</code>. (<a href="https://commits.webkit.org/311390@main">311390@main</a>)  (174894122)</li>
<li>Fixed a <code>white-space: pre-wrap</code> layout issue with justified text. (<a href="https://commits.webkit.org/311385@main">311385@main</a>)  (174937310)</li>
<li>Fixed an issue where minimum height was not correctly computed for flex items. (<a href="https://commits.webkit.org/311443@main">311443@main</a>)  (174999995)</li>
<li>Fixed an issue with <code>flex-wrap</code> and flex factor computation for wrapping flex items. (<a href="https://commits.webkit.org/311456@main">311456@main</a>)  (175012395)</li>
<li>Fixed vertical <code>writing-mode</code> content incorrectly wrapping when the parent has <code>auto</code> height. (<a href="https://commits.webkit.org/311630@main">311630@main</a>)  (175123356)</li>
<li>Fixed minimum height calculation for flex items. (<a href="https://commits.webkit.org/311623@main">311623@main</a>)  (175195518)</li>
<li>Fixed incorrect bounding box position for newline characters. (<a href="https://commits.webkit.org/311668@main">311668@main</a>)  (175243361)</li>
</ul>
<h3>SVG</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where backslash-escaped dot characters in SVG animation timing attribute ID references were not parsed correctly. (<a href="https://commits.webkit.org/310805@main">310805@main</a>)  (94260935)</li>
<li>Fixed SVG2 systemLanguage attribute to improve parsing and compliance with the specification. (<a href="https://commits.webkit.org/311439@main">311439@main</a>)  (116427520)</li>
<li>Fixed the SMIL <code>values</code> attribute to preserve empty values and handle trailing semicolons. (<a href="https://commits.webkit.org/311502@main">311502@main</a>)  (173594455)</li>
<li>Fixed SVG2 <code>getStartPositionOfChar</code> and <code>getEndPositionOfChar</code> to be more compliant with the specification. (<a href="https://commits.webkit.org/311450@main">311450@main</a>)  (174145885)</li>
<li>Fixed SVG intrinsic aspect ratio being incorrectly suppressed when <code>preserveAspectRatio</code> is set to <code>none</code>. (<a href="https://commits.webkit.org/311723@main">311723@main</a>)  (175173375)</li>
<li>Fixed SVG images without complete intrinsic dimensions incorrectly using ratio-based scaling for <code>background-size</code>. (<a href="https://commits.webkit.org/311817@main">311817@main</a>)  (175345107)</li>
</ul>
<h3>Scrolling</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where tabbing in a scroll container with <code>scroll-padding</code> did not scroll the focused element into view. (<a href="https://commits.webkit.org/311512@main">311512@main</a>)  (147513379)</li>
<li>Fixed rubberbanding behaving incorrectly when a site triggers a smooth scroll to the top during a rubberband. (<a href="https://commits.webkit.org/311641@main">311641@main</a>)  (170705188)</li>
<li>Fixed an issue on iOS where composited layers would briefly flash blank when <code>window.scrollTo()</code> was called synchronously with a DOM layout change. (<a href="https://commits.webkit.org/310864@main">310864@main</a>)  (173197381)</li>
<li>Fixed an issue where calling <code>scrollIntoView()</code> on a scrollable element incorrectly scrolled the element&#8217;s own contents. (<a href="https://commits.webkit.org/310734@main">310734@main</a>)  (174173683)</li>
<li>Fixed scroll anchoring interfering with rubberbanding on some websites. (<a href="https://commits.webkit.org/311686@main">311686@main</a>)  (175195943)</li>
</ul>
<h3>Spatial Web</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue on visionOS where fullscreen video would sometimes jump when exiting fullscreen if the browser window was narrower than the video. (<a href="https://commits.webkit.org/311116@main">311116@main</a>)  (174454557)</li>
</ul>
<h3>UI</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed: Tab key behaves incorrectly inside a PopupMenu  (174468005)</li>
</ul>
<h3>Web API</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed Web IDL bindings to correctly reject <code>SharedArrayBuffer</code> where <code>[AllowShared]</code> is not specified. (<a href="https://commits.webkit.org/311536@main">311536@main</a>)  (107786134)</li>
<li>Fixed an issue on visionOS where the <code>gamepadconnected</code> event did not fire unless gamepad permission had already been granted. (<a href="https://commits.webkit.org/311465@main">311465@main</a>)  (141623162)</li>
<li>Fixed an issue where <code>CSPViolationReportBody</code> did not include the source line number in Content Security Policy violation reports. (<a href="https://commits.webkit.org/311040@main">311040@main</a>)  (152607402)</li>
<li>Fixed an issue where <code>history.replaceState()</code> on a traversed history entry incorrectly changed <code>navigation.currentEntry.key</code> to a new UUID instead of preserving the original key. (<a href="https://commits.webkit.org/310849@main">310849@main</a>)  (173388766)</li>
<li>Fixed the Credential Management API to properly define which credential types are allowed in the same <code>get()</code> request. (<a href="https://commits.webkit.org/311988@main">311988@main</a>)  (173918198)</li>
<li>Fixed an issue where <code>event.target</code> was not set after dispatching an event in a shadow tree with no listeners. (<a href="https://commits.webkit.org/310621@main">310621@main</a>)  (174136382)</li>
<li>Fixed an issue where <code>navigator.credentials.create()</code> and <code>navigator.credentials.get()</code> discarded the <code>AbortSignal</code> reason and always rejected with a generic <code>AbortError</code>. (<a href="https://commits.webkit.org/310782@main">310782@main</a>)  (174220589)</li>
<li>Fixed a missing <code>return</code> in the Navigation API&#8217;s <code>performTraversal</code> that caused incorrect behavior when traversing to an unknown key. (<a href="https://commits.webkit.org/311161@main">311161@main</a>)  (174513305)</li>
<li>Fixed <code>Range.extractContents()</code> to not extract out-of-bounds nodes when the end container is removed during extraction. (<a href="https://commits.webkit.org/310770@main">310770@main</a>)  (174307275)</li>
<li>Fixed <code>document.createEvent()</code> to throw an exception for <code>"MutationEvents"</code>, <code>"MutationEvent"</code>, <code>"PopStateEvent"</code>, and <code>"WheelEvent"</code>, aligning with other browser engines. (<a href="https://commits.webkit.org/310792@main">310792@main</a>)  (174339775)</li>
<li>Fixed <code>ParentNode.append()</code> to correctly de-duplicate nodes when the same node is passed multiple times. (<a href="https://commits.webkit.org/310807@main">310807@main</a>)  (174365465)</li>
<li>Fixed an issue where <code>MutationObserver</code> delivered <code>childList</code> records in the wrong order when script ran during node insertion. (<a href="https://commits.webkit.org/310812@main">310812@main</a>)  (174368989)</li>
<li>Fixed an issue where setting a <code>URL</code> object&#8217;s <code>port</code> property to whitespace behaved incorrectly. (<a href="https://commits.webkit.org/310919@main">310919@main</a>)  (174484035)</li>
<li>Fixed <code>Blob.slice()</code> to correctly clamp fractional <code>start</code> and <code>end</code> parameters using round-half-to-even rounding per the File API specification, which may change how edge-case fractional values like <code>0.5</code> are rounded. (<a href="https://commits.webkit.org/310992@main">310992@main</a>)  (174555334)</li>
<li>Fixed <code>postMessage()</code> to validate transferable object states after serialization, aligning with the HTML specification. (<a href="https://commits.webkit.org/310996@main">310996@main</a>)  (174558047)</li>
<li>Fixed <code>structuredClone()</code> and <code>window.postMessage()</code> to correctly throw a <code>DataCloneError</code> when serializing a <code>SharedArrayBuffer</code> outside of cross-origin isolated contexts. (<a href="https://commits.webkit.org/310998@main">310998@main</a>)  (174562553)</li>
<li>Fixed an issue where calling <code>Element.blur()</code> on an <code>&lt;iframe&gt;</code> did not reset <code>document.activeElement</code> to <code>&lt;body&gt;</code>. (<a href="https://commits.webkit.org/311452@main">311452@main</a>)  (174591529)</li>
<li>Fixed <code>document.styleSheets</code> to be accessible on documents created by <code>DOMParser</code>. (<a href="https://commits.webkit.org/311043@main">311043@main</a>)  (174625774)</li>
<li>Fixed <code>innerText</code> getter to correctly handle trailing newlines and blank lines for <code>&lt;p&gt;</code> elements and headings. (<a href="https://commits.webkit.org/311057@main">311057@main</a>)  (174642704)</li>
<li>Fixed <code>innerText</code> whitespace handling at inline-block boundaries. (<a href="https://commits.webkit.org/311163@main">311163@main</a>)  (174713114)</li>
<li>Fixed <code>XMLSerializer</code> namespace handling to correctly serialize elements with namespace prefixes. (<a href="https://commits.webkit.org/311184@main">311184@main</a>)  (174726401)</li>
<li>Fixed the <code>innerText</code> getter to preserve newlines for elements with <code>white-space: pre-line</code>. (<a href="https://commits.webkit.org/311185@main">311185@main</a>)  (174727341)</li>
<li>Fixed <code>innerText</code> handling of replaced elements at block boundaries. (<a href="https://commits.webkit.org/311269@main">311269@main</a>)  (174816319)</li>
<li>Fixed <code>EventSource</code> to be closed when <code>window.stop()</code> is called. (<a href="https://commits.webkit.org/311281@main">311281@main</a>)  (174830925)</li>
<li>Fixed <code>innerText</code> to not fall back to <code>textContent</code> for elements with <code>display: contents</code>. (<a href="https://commits.webkit.org/311339@main">311339@main</a>)  (174883499)</li>
<li>Fixed <code>innerText</code> to preserve the contents of <code>&lt;option&gt;</code> elements inside <code>&lt;select&gt;</code>. (<a href="https://commits.webkit.org/311449@main">311449@main</a>)  (175006854)</li>
<li>Fixed <code>Element.innerText</code> to collect option text when called directly on a <code>&lt;select&gt;</code> element. (<a href="https://commits.webkit.org/311576@main">311576@main</a>)  (175156630)</li>
<li>Fixed worker scripts to always be decoded as UTF-8, as per the specification. (<a href="https://commits.webkit.org/311761@main">311761@main</a>)  (175327455)</li>
<li>Fixed an issue where ancestors of <code>TreeWalker.currentNode</code> could be prematurely garbage collected. (<a href="https://commits.webkit.org/311873@main">311873@main</a>)  (175442228)</li>
</ul>
<h3>Web Extensions</h3>
<h4>New Features</h4>
<ul>
<li>Added reporting of uncaught JavaScript exceptions and unhandled promise rejections in Web Extension scripts. (<a href="https://commits.webkit.org/311150@main">311150@main</a>)  (174354070)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>browser.i18n.getMessage()</code> to correctly substitute named placeholders when they appear adjacent to non-space characters. (<a href="https://commits.webkit.org/311685@main">311685@main</a>)  (169146196)</li>
<li>Fixed <code>browser.i18n.getMessage()</code> to correctly substitute two adjacent named placeholders. (<a href="https://commits.webkit.org/311769@main">311769@main</a>)  (175315700)</li>
</ul>
<h3>Web Inspector</h3>
<h4>New Features</h4>
<ul>
<li>Added Subgrid and Grid-Lanes badges to the Elements tab for easier identification of subgrid and grid-lanes layout contexts. (<a href="https://commits.webkit.org/310936@main">310936@main</a>)  (173681497)</li>
<li>Added the layout root element to Layout event details in the Timeline tab. (<a href="https://commits.webkit.org/311847@main">311847@main</a>)  (175419350)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed editing  inline <code>style</code> attribute values in the Elements panel resulting in truncated or malformed content. (<a href="https://commits.webkit.org/311717@main">311717@main</a>)  (149523483)</li>
<li>Fixed the Network tab filtering by resource type not working after clearing a filter that had no matches. (<a href="https://commits.webkit.org/311947@main">311947@main</a>)  (161570940)</li>
<li>Fixed an issue where CSS rules added via the &#8220;Add New Rule&#8221; button in the Styles panel were intermittently not applied or would vanish after entering a property. (<a href="https://commits.webkit.org/310921@main">310921@main</a>)  (164971557)</li>
<li>Fixed an issue by removing a setting that incorrectly blocked the WebInspector service in the sandbox. (<a href="https://commits.webkit.org/310631@main">310631@main</a>)  (173330816)</li>
<li>Fixed an issue where the debugger selected the wrong thread when multiple WebAssembly virtual machines stopped simultaneously. (<a href="https://commits.webkit.org/310847@main">310847@main</a>)  (174187067)</li>
<li>Fixed the Layers 3D view to correctly map textures to composited bounds and use proper selection highlighting instead of tinting textures. (<a href="https://commits.webkit.org/310891@main">310891@main</a>)  (174355052)</li>
<li>Fixed the Layers 3D view to re-snapshot preserved layers after a repaint instead of displaying stale textures. (<a href="https://commits.webkit.org/310892@main">310892@main</a>)  (174358757)</li>
<li>Fixed an issue where Web Inspector showed empty source information for WebAssembly modules compiled via <code>WebAssembly.instantiateStreaming</code>. (<a href="https://commits.webkit.org/310852@main">310852@main</a>)  (174362152)</li>
<li>Fixed Web Inspector to display meaningful names for WebAssembly modules derived from the name section and source URL instead of address-based fallback names. (<a href="https://commits.webkit.org/310961@main">310961@main</a>)  (174465437)</li>
<li>Fixed an issue where all folder tree elements were expanded after filtering for a resource in the Sources panel. (<a href="https://commits.webkit.org/311459@main">311459@main</a>)  (175009135)</li>
<li>Fixed an erroneous &#8220;There are unread messages that have been filtered&#8221; banner appearing in the Console when <code>console.groupCollapsed()</code> is used. (<a href="https://commits.webkit.org/311764@main">311764@main</a>)  (175279759)</li>
<li>Fixed an issue in the Storage tab where filtering by storage type did not reveal the popup with options. (<a href="https://commits.webkit.org/311945@main">311945@main</a>)  (175444192)</li>
</ul>
<h3>WebAssembly</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed incorrect <code>IntegerOverflow</code> exceptions thrown by <code>i32.rem_s</code>, <code>i64.rem_s</code>, <code>i32.div_u</code>, <code>i64.div_u</code>, <code>i32.rem_u</code>, and <code>i64.rem_u</code> when both operands are constants. (<a href="https://commits.webkit.org/311898@main">311898@main</a>)  (175122462)</li>
</ul>
<h3>WebGPU</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>clip_distances</code> builtin value in WGSL shaders. (<a href="https://commits.webkit.org/311824@main">311824@main</a>)  (129202606)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed rendering failing when using direct <code>GPUTexture</code> objects instead of <code>GPUTextureView</code> with multisampled resolve targets in render passes. (<a href="https://commits.webkit.org/311938@main">311938@main</a>)  (175452924)</li>
</ul>
<h3>WebRTC</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed WebRTC VP9 encoders to correctly propagate frame colorspace information. (<a href="https://commits.webkit.org/311065@main">311065@main</a>)  (174008548)</li>
<li>Fixed a regression where <code>RTCPeerConnection</code> with <code>iceTransportPolicy: "relay"</code> failed to gather ICE candidates. (<a href="https://commits.webkit.org/311432@main">311432@main</a>)  (174794660)</li>
<li>Fixed <code>RTCInboundRtpStreamStats.trackIdentifier</code> to match <code>MediaStreamTrack.id</code>. (<a href="https://commits.webkit.org/311455@main">311455@main</a>)  (174938984)</li>
</ul>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Release Notes for Safari Technology Preview 242</title>
		<link>https://webkit.org/blog/17934/release-notes-for-safari-technology-preview-242/</link>
		
		<dc:creator/>
		<pubDate>Thu, 23 Apr 2026 20:04:50 +0000</pubDate>
				<category><![CDATA[Safari Technology Preview]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17934</guid>

					<description><![CDATA[Safari Technology Preview Release 242 is now available for download for macOS Tahoe and macOS Sequoia.]]></description>
										<content:encoded><![CDATA[<p><a href="https://webkit.org/blog/6017/introducing-safari-technology-preview/">Safari Technology Preview</a> Release 242 is now <a href="https://developer.apple.com/safari/resources/">available for download</a> for macOS Tahoe and macOS Sequoia. If you already have Safari Technology Preview installed, you can update it in System Settings under General → Software Update.</p>
<p>This release includes WebKit changes between: <a href="https://github.com/WebKit/WebKit/compare/f91abd9528154fcf24a3ea90d43fdde378d9793b...b53493b67d659fd4026d0a21d03b63620daf704e">310187@main&#8230;310599@main</a>.</p>
<h3>Accessibility</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where VoiceOver read text within images that have <code>role="presentation"</code>. (<a href="https://commits.webkit.org/310483@main">310483@main</a>)  (159304061)</li>
<li>Fixed macOS accessibility support for customizable <code>&lt;select&gt;</code> elements using <code>appearance: base-select</code>. (<a href="https://commits.webkit.org/310441@main">310441@main</a>)  (173696010)</li>
</ul>
<h3>CSS</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the CSS <code>attr()</code> function from CSS Values Level 5. (<a href="https://commits.webkit.org/310246@main">310246@main</a>)  (173700363)</li>
<li>Added support for the <code>oblique-only</code> value for <code>font-synthesis-style</code> as defined in CSS Fonts Level 4. (<a href="https://commits.webkit.org/310409@main">310409@main</a>)  (173730766)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>@media (prefers-color-scheme: dark)</code> inside an iframe did not match when the iframe&#8217;s <code>color-scheme</code> was set to <code>dark</code>. (<a href="https://commits.webkit.org/310465@main">310465@main</a>)  (142072593)</li>
<li>Fixed <code>position-try-order</code> to interpret logical axis values using the containing block&#8217;s writing mode instead of the element&#8217;s own writing mode. (<a href="https://commits.webkit.org/310277@main">310277@main</a>)  (169501069)</li>
<li>Fixed an issue where percent-height replaced elements computed stale preferred widths in shrink-to-fit containers. (<a href="https://commits.webkit.org/310194@main">310194@main</a>)  (171184282)</li>
<li>Fixed an issue where the table cell <code>nowrap</code> minimum width calculation quirk was applied outside of quirks mode. (<a href="https://commits.webkit.org/310195@main">310195@main</a>)  (171410252)</li>
<li>Fixed an issue where checkbox outlines appeared misaligned. (<a href="https://commits.webkit.org/310323@main">310323@main</a>)  (172742551)</li>
<li>Fixed an issue where anchor-positioned elements anchored to children of sticky-positioned boxes did not stick correctly. (<a href="https://commits.webkit.org/310255@main">310255@main</a>)  (172884148)</li>
<li>Fixed an issue where pseudo-elements were not sorted correctly when sorting anchor elements by tree order. (<a href="https://commits.webkit.org/310407@main">310407@main</a>)  (173032203)</li>
<li>Fixed an issue where ligatures caused a non-zero layout width for text with <code>font-size: 0</code>. (<a href="https://commits.webkit.org/310394@main">310394@main</a>)  (173840866)</li>
<li>Fixed <code>:in-range</code> and <code>:out-of-range</code> pseudo-classes to correctly update when the <code>readonly</code> attribute changes. (<a href="https://commits.webkit.org/310484@main">310484@main</a>)  (173978657)</li>
<li>Fixed an issue where <code>view-timeline-inset</code> serialization failed to coalesce identical values. (<a href="https://commits.webkit.org/310590@main">310590@main</a>)  (174096313)</li>
</ul>
<h3>Forms</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>&lt;select multiple&gt;</code> did not always fire <code>onchange</code> when the mouse button was released far outside the element. (<a href="https://commits.webkit.org/310482@main">310482@main</a>)  (173882861)</li>
</ul>
<h3>HTML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>closedby</code> attribute on <code>&lt;dialog&gt;</code> elements. (<a href="https://commits.webkit.org/310487@main">310487@main</a>)  (173974767)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed the HTML parser fast path to correctly process escaped attribute values longer than one character. (<a href="https://commits.webkit.org/310209@main">310209@main</a>)  (173673581)</li>
<li>Fixed the HTML parser fast path to correctly detect nested <code>&lt;li&gt;</code> elements. (<a href="https://commits.webkit.org/310492@main">310492@main</a>)  (173983892)</li>
<li>Fixed the HTML parser fast path to use the adjusted current node for MathML and SVG integration point checks. (<a href="https://commits.webkit.org/310593@main">310593@main</a>)  (174096305)</li>
</ul>
<h3>Images</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where inserting an image with a <code>srcset</code> attribute into a dynamically created iframe resulted in an invisible image. (<a href="https://commits.webkit.org/310446@main">310446@main</a>)  (66849050)</li>
</ul>
<h3>JavaScript</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where class instance field initializers did not have the correct evaluation context when used inside arrow functions and nested scopes. (<a href="https://commits.webkit.org/310594@main">310594@main</a>)  (173296563)</li>
<li>Fixed <code>%ArrayIteratorPrototype%.next()</code> to return <code>{ done: true }</code> instead of throwing a <code>TypeError</code> when the source TypedArray is detached and the iterator has already completed. (<a href="https://commits.webkit.org/310292@main">310292@main</a>)  (173759106)</li>
<li>Fixed an issue where a fixed-count mixed-width character class in a regular expression did not correctly restore the index on backtrack. (<a href="https://commits.webkit.org/310477@main">310477@main</a>)  (173972458)</li>
</ul>
<h3>Media</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where scrubbing a video in full-screen mode could cause it to exit full-screen. (<a href="https://commits.webkit.org/310415@main">310415@main</a>)  (172682230)</li>
<li>Fixed an issue where <code>HTMLMediaElement.preservesPitch = true</code> did not work when the element was connected to an <code>AudioContext</code>. (<a href="https://commits.webkit.org/310521@main">310521@main</a>)  (173727365)</li>
</ul>
<h3>Networking</h3>
<h4>New Features</h4>
<ul>
<li>Added support for secure cookies on loopback hosts. (<a href="https://commits.webkit.org/310542@main">310542@main</a>)  (137604100)</li>
</ul>
<h3>Rendering</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a regression where nested column flexboxes could cause content to render at the wrong size. (<a href="https://commits.webkit.org/310253@main">310253@main</a>)  (173321492)</li>
<li>Fixed a regression where nested empty inline boxes accumulated an incorrect vertical offset, causing inline elements to stack as block-level elements. (<a href="https://commits.webkit.org/310313@main">310313@main</a>)  (173723162)</li>
<li>Fixed an issue where pseudo-elements were incorrectly included in outline rect collection. (<a href="https://commits.webkit.org/310531@main">310531@main</a>)  (174033087)</li>
</ul>
<h3>SVG</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>lang</code> and <code>xml:lang</code> attribute in SVG. (<a href="https://commits.webkit.org/310495@main">310495@main</a>)  (143751056)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where SMIL animations of <code>href</code> or <code>xlink:href</code> on SVG <code>&lt;image&gt;</code> elements had no visual effect. (<a href="https://commits.webkit.org/310236@main">310236@main</a>)  (96316808)</li>
<li>Fixed an issue where SVG gradient animations did not work unless <code>y1</code> and <code>y2</code> attributes were explicitly specified. (<a href="https://commits.webkit.org/310257@main">310257@main</a>)  (123457088)</li>
<li>Fixed an SVG <code>&lt;tspan&gt;</code> positioning bug with <code>xml:space="preserve"</code> that caused multi-line text to render incorrectly. (<a href="https://commits.webkit.org/310347@main">310347@main</a>)  (143722975)</li>
<li>Fixed an issue where URL fragments were not percent-decoded before being used for SVG references. (<a href="https://commits.webkit.org/310443@main">310443@main</a>)  (169582378)</li>
</ul>
<h3>Scrolling</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where sticky-positioned elements could flicker rapidly after scrolling. (<a href="https://commits.webkit.org/310545@main">310545@main</a>)  (173680821)</li>
<li>Fixed an issue where scroll anchoring could cause a page to scroll to the top or bottom automatically. (<a href="https://commits.webkit.org/310574@main">310574@main</a>)  (173885027)</li>
</ul>
<h3>Tables</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue with a collapsed border color mismatch when the table cell has a different writing-mode. (<a href="https://commits.webkit.org/310303@main">310303@main</a>)  (173655092)</li>
</ul>
<h3>Web API</h3>
<h4>New Features</h4>
<ul>
<li>Added support for <code>getAllRecords()</code> and <code>IDBGetAllOptions</code> in the IndexedDB API. (<a href="https://commits.webkit.org/310462@main">310462@main</a>)  (173881825)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>document.open()</code> incorrectly aliased the caller&#8217;s security origin. (<a href="https://commits.webkit.org/310543@main">310543@main</a>)  (173369038)</li>
<li>Fixed an issue where <code>Object.prototype</code> could not be serialized by <code>structuredClone()</code>. (<a href="https://commits.webkit.org/310363@main">310363@main</a>)  (173728983)</li>
<li>Fixed an issue where backslashes were not handled correctly in non-special URLs. (<a href="https://commits.webkit.org/310290@main">310290@main</a>)  (173757759)</li>
<li>Fixed a URL parsing bug in the special relative or authority state. (<a href="https://commits.webkit.org/310300@main">310300@main</a>)  (173772241)</li>
<li>Fixed an issue where event listener <code>once</code> and <code>passive</code> flags were not preserved when copying listeners between elements. (<a href="https://commits.webkit.org/310355@main">310355@main</a>)  (173834642)</li>
<li>Fixed `Preserve existing listener options (such as passive defaulting) when overwriting event handler attributes. (<a href="https://commits.webkit.org/310362@main">310362@main</a>)  (173842822)</li>
</ul>
<h3>WebRTC</h3>
<h4>New Features</h4>
<ul>
<li>Added support for <code>RTCRtpReceiver.jitterBufferTarget</code>. (<a href="https://commits.webkit.org/310285@main">310285@main</a>)  (173676035)</li>
<li>Added support for video source <code>width</code> and <code>height</code> in RTC stats. (<a href="https://commits.webkit.org/310295@main">310295@main</a>)  (173677615)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where I420 BT709 <code>VideoFrame</code> was encoded in an incorrect color space when encoding to VP9. (<a href="https://commits.webkit.org/310306@main">310306@main</a>)  (169425608)</li>
<li>Fixed an issue where <code>RTCRtpSender.setParameters</code> did not clear parameters that were unset by the web application. (<a href="https://commits.webkit.org/310286@main">310286@main</a>)  (173678165)</li>
</ul>
]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>Release Notes for Safari Technology Preview 241</title>
		<link>https://webkit.org/blog/17917/release-notes-for-safari-technology-preview-241/</link>
		
		<dc:creator/>
		<pubDate>Wed, 08 Apr 2026 21:21:17 +0000</pubDate>
				<category><![CDATA[Safari Technology Preview]]></category>
		<guid isPermaLink="false">https://webkit.org/?p=17917</guid>

					<description><![CDATA[Safari Technology Preview Release 241 is now available for download for macOS Tahoe and macOS Sequoia.]]></description>
										<content:encoded><![CDATA[<p><a href="https://webkit.org/blog/6017/introducing-safari-technology-preview/">Safari Technology Preview</a> Release 241 is now <a href="https://developer.apple.com/safari/resources/">available for download</a> for macOS Tahoe and macOS Sequoia. If you already have Safari Technology Preview installed, you can update it in System Settings under General → Software Update.</p>
<p>This release includes WebKit changes between: <a href="https://github.com/WebKit/WebKit/compare/f4d9aee8564bd69af3b62913cf0dc558055e460b...0432220790bcd2f3133408195256b93866db0315">309287@main&#8230;310186@main</a>.</p>
<h3>Accessibility</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where calling <code>speechSynthesis.cancel()</code> removed utterances queued by subsequent <code>speechSynthesis.speak()</code> calls. (<a href="https://commits.webkit.org/309349@main">309349@main</a>)  (46151521)</li>
<li>Fixed an issue where incorrect bounding boxes were computed for MathML table rows and cells. (<a href="https://commits.webkit.org/309640@main">309640@main</a>)  (172851295)</li>
<li>Fixed an issue where comboboxes did not forward focus to their <code>aria-activedescendant</code>, preventing assistive technologies from interacting with list items. (<a href="https://commits.webkit.org/309641@main">309641@main</a>)  (172931277)</li>
<li>Fixed an issue where <code>aria-owns</code> was not respected when computing the accessible name from element content. (<a href="https://commits.webkit.org/310020@main">310020@main</a>)  (173249317)</li>
</ul>
<h3>Animations</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>animation-fill-mode</code> did not correctly apply viewport-based units after the viewport was resized. (<a href="https://commits.webkit.org/310007@main">310007@main</a>)  (80075191)</li>
</ul>
<h3>CSS</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>stretch</code> keyword in box sizing properties. (<a href="https://commits.webkit.org/309405@main">309405@main</a>)  (132539604)</li>
<li>Added stable support for CSS scroll anchoring. (<a href="https://commits.webkit.org/310113@main">310113@main</a>)  (171840378)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where U+2028 LINE SEPARATOR was not rendered as a forced line break per the CSS specification. (<a href="https://commits.webkit.org/309701@main">309701@main</a>)  (88470339)</li>
<li>Fixed an issue where <code>outline-offset</code> was inflated for <code>outline: auto</code> on macOS. (<a href="https://commits.webkit.org/309812@main">309812@main</a>)  (94116168)</li>
<li>Fixed <code>font-family</code> serialization to preserve quotes around family names that match CSS-wide keywords or generic families. (<a href="https://commits.webkit.org/309959@main">309959@main</a>)  (125334960)</li>
<li>Fixed an issue where a font was downloaded despite no characters in the document falling within its <code>unicode-range</code>. (<a href="https://commits.webkit.org/309360@main">309360@main</a>)  (140674753)</li>
<li>Fixed an issue where a flex item containing a percentage-height image did not shrink correctly around the image. (<a href="https://commits.webkit.org/309544@main">309544@main</a>)  (156902823)</li>
<li>Fixed an issue where View Transition snapshots were incorrectly stored in sRGB, causing rendering issues with non-sRGB colors. (<a href="https://commits.webkit.org/310012@main">310012@main</a>)  (167634138)</li>
<li>Fixed a performance issue where <code>contain: layout</code> caused significantly slower forced layouts when all siblings created their own formatting context. (<a href="https://commits.webkit.org/310173@main">310173@main</a>)  (171545381)</li>
<li>Fixed an issue where underlines were split when a ruby base was expanded due to long ruby text. (<a href="https://commits.webkit.org/309356@main">309356@main</a>)  (171653095)</li>
<li>Fixed an issue where changing <code>color-scheme</code> did not repaint the background of composited iframes. (<a href="https://commits.webkit.org/309567@main">309567@main</a>)  (171658244)</li>
<li>Fixed an issue where nested children of a popover element failed to render when using <code>position: absolute</code>. (<a href="https://commits.webkit.org/310019@main">310019@main</a>)  (171735933)</li>
<li>Fixed an issue where <code>color: initial</code> resolved to the wrong color in dark appearance mode. (<a href="https://commits.webkit.org/309430@main">309430@main</a>)  (172320282)</li>
<li>Fixed an issue where an element with <code>display: contents</code> did not establish an anchor scope when using <code>anchor-scope</code>. (<a href="https://commits.webkit.org/309946@main">309946@main</a>)  (172355302)</li>
<li>Fixed a regression where media queries could fail to resolve correctly in the presence of viewport units and anchors, causing styles to not update on viewport changes. (<a href="https://commits.webkit.org/309470@main">309470@main</a>)  (172385594)</li>
<li>Fixed a regression where absolutely positioned elements with intrinsic height incorrectly resolved percentage heights, causing content to not render on some sites. (<a href="https://commits.webkit.org/309513@main">309513@main</a>)  (172513516)</li>
<li>Fixed <code>&lt;general-enclosed&gt;</code> in media queries to reject content with unmatched close brackets per the <code>&lt;any-value&gt;</code> grammar. (<a href="https://commits.webkit.org/309497@main">309497@main</a>)  (172575115)</li>
<li>Fixed an issue where a right-floated table could overlap another table. (<a href="https://commits.webkit.org/309316@main">309316@main</a>)  (172655655)</li>
<li>Fixed an issue where grid containers failed to avoid float boxes. (<a href="https://commits.webkit.org/309317@main">309317@main</a>)  (172655720)</li>
<li>Fixed an issue where checkboxes could overlap with adjacent text. (<a href="https://commits.webkit.org/310015@main">310015@main</a>)  (172741572)</li>
<li>Fixed an issue where the <code>rlh</code> unit was double-zoomed with evaluation-time CSS zoom. (<a href="https://commits.webkit.org/309654@main">309654@main</a>)  (172798163)</li>
<li>Fixed <code>outline: auto</code> to correctly respect zoom. (<a href="https://commits.webkit.org/309926@main">309926@main</a>)  (173068660)</li>
<li>Fixed <code>:active</code>, <code>:focus-within</code>, and <code>:hover</code> pseudo-classes to correctly account for elements in the top layer. (<a href="https://commits.webkit.org/309755@main">309755@main</a>)  (173145294)</li>
<li>Fixed the <code>shape()</code> function to omit default control point anchors in computed value serialization per the CSS Shapes specification. (<a href="https://commits.webkit.org/309851@main">309851@main</a>)  (173233716)</li>
<li>Fixed: Updated SVG and MathML user agent style sheets to use <code>:focus-visible</code> instead of <code>:focus</code>. (<a href="https://commits.webkit.org/309912@main">309912@main</a>)  (173321368)</li>
<li>Fixed an issue where view transition snapshots could capture stale transform values for accelerated CSS transform animations. (<a href="https://commits.webkit.org/309982@main">309982@main</a>)  (173323193)</li>
<li>Fixed an issue where <code>lh</code> and <code>rlh</code> units resolved with double-zoom when <code>line-height</code> was a number value. (<a href="https://commits.webkit.org/310043@main">310043@main</a>)  (173448638)</li>
<li>Fixed <code>outline-width</code> to be ignored when <code>outline-style</code> is <code>auto</code>, matching the specification. (<a href="https://commits.webkit.org/310145@main">310145@main</a>)  (173567890)</li>
<li>Fixed <code>:in-range</code> and <code>:out-of-range</code> pseudo-classes for time inputs with reversed ranges. (<a href="https://commits.webkit.org/310156@main">310156@main</a>)  (173589851)</li>
</ul>
<h3>Canvas</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where a 2D canvas element unnecessarily forced a compositing layer. (<a href="https://commits.webkit.org/309599@main">309599@main</a>)  (172864747)</li>
</ul>
<h3>Forms</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where keyboard commands such as paste did not work in form fields that restrict input to numbers. (<a href="https://commits.webkit.org/309300@main">309300@main</a>)  (4360235)</li>
<li>Fixed: Made the <code>&lt;input type="checkbox" switch&gt;</code> control behave more like other controls with regards to native appearance CSS properties. (<a href="https://commits.webkit.org/310143@main">310143@main</a>)  (173487610)</li>
</ul>
<h3>HTML</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>auto</code> keyword in the <code>sizes</code> attribute on <code>&lt;img&gt;</code> elements, enabling automatic size calculation based on the rendered layout width. (<a href="https://commits.webkit.org/309476@main">309476@main</a>)  (172827205)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where an HTML <code>map</code> element without a <code>name</code> attribute did not match its associated image using the <code>id</code> attribute. (<a href="https://commits.webkit.org/309490@main">309490@main</a>)  (12359382)</li>
<li>Fixed an issue where <code>replaceWith()</code> stopped processing remaining nodes if a script in the replacement removed a sibling. (<a href="https://commits.webkit.org/309411@main">309411@main</a>)  (172753019)</li>
<li>Fixed an issue where HEIC images were incorrectly converted to JPEG when uploaded via drag-and-drop. (<a href="https://commits.webkit.org/309872@main">309872@main</a>)  (173206598)</li>
<li>Fixed an issue where setting the <code>rel</code> attribute on an <code>&lt;a&gt;</code> element multiple times did not clear prior link relations. (<a href="https://commits.webkit.org/310144@main">310144@main</a>)  (173567839)</li>
</ul>
<h3>Images</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where adopting a standalone <code>img</code> element did not update its image data. (<a href="https://commits.webkit.org/309523@main">309523@main</a>)  (172856773)</li>
</ul>
<h3>JavaScript</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>Array.prototype.concat</code> to correctly handle arrays with indexed accessors, preventing getter reentry from bypassing <code>Symbol.isConcatSpreadable</code> checks. (<a href="https://commits.webkit.org/309423@main">309423@main</a>)  (172237596)</li>
<li>Fixed an issue where a greedy or non-greedy non-BMP character class in a regular expression could advance the index past the end of input. (<a href="https://commits.webkit.org/309968@main">309968@main</a>)  (172978772)</li>
<li>Fixed TypedArray <code>[[Set]]</code> to check the receiver before writing to the typed array. (<a href="https://commits.webkit.org/309967@main">309967@main</a>)  (173386404)</li>
</ul>
<h3>MathML</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where symmetric non-stretchy large operators were not centered around the math axis. (<a href="https://commits.webkit.org/309778@main">309778@main</a>)  (170905663)</li>
<li>Fixed an issue where <code>minsize</code> and <code>maxsize</code> defaults and percentages did not use the unstretched size as specified. (<a href="https://commits.webkit.org/309764@main">309764@main</a>)  (170908253)</li>
</ul>
<h3>Media</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>preservesPitch</code> and <code>playbackRate</code> were not correctly handled on an <code>HTMLMediaElement</code> connected to an <code>AudioContext</code> via <code>createMediaElementSource</code>. (<a href="https://commits.webkit.org/310098@main">310098@main</a>)  (93275149)</li>
<li>Fixed an issue where video captions could be hidden behind other elements during inline playback. (<a href="https://commits.webkit.org/309505@main">309505@main</a>)  (171023402)</li>
<li>Fixed an issue where seeking in a WebM video did not work correctly while content was still loading. (<a href="https://commits.webkit.org/309373@main">309373@main</a>)  (172473039)</li>
<li>Fixed an issue where media playback could not move to the next item in a playlist when the tab was in the background. (<a href="https://commits.webkit.org/309879@main">309879@main</a>)  (172676372)</li>
<li>Fixed an issue where HDR video content appeared washed out due to colorspace information being lost during processing. (<a href="https://commits.webkit.org/309502@main">309502@main</a>)  (172721079)</li>
</ul>
<h3>Networking</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed a regression where the referrer could be missing after a process-swap navigation. (<a href="https://commits.webkit.org/309382@main">309382@main</a>)  (169006635)</li>
</ul>
<h3>Printing</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where animations were not rendered during print, causing missing content on animated pages. (<a href="https://commits.webkit.org/309488@main">309488@main</a>)  (36901701)</li>
<li>Fixed an issue where printing light text on a dark background with backgrounds disabled could result in invisible text. (<a href="https://commits.webkit.org/309604@main">309604@main</a>)  (170070133)</li>
</ul>
<h3>Rendering</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where the document background color did not align with the CSS specification, causing incorrect background colors when pinch-zooming out. (<a href="https://commits.webkit.org/309332@main">309332@main</a>)  (23607800)</li>
<li>Fixed an issue where <code>WidthIterator</code> consumed the first character twice, potentially causing incorrect text measurement. (<a href="https://commits.webkit.org/309437@main">309437@main</a>)  (128492167)</li>
<li>Fixed a regression where hovering over elements could leave repaint artifacts on the page. (<a href="https://commits.webkit.org/309861@main">309861@main</a>)  (169112402)</li>
<li>Fixed an issue where Find in Page scrolled to the wrong location when matching text inside elements with <code>user-select: none</code>. (<a href="https://commits.webkit.org/309923@main">309923@main</a>)  (170477571)</li>
<li>Fixed an issue where remote snapshotting could flip part of the page. (<a href="https://commits.webkit.org/309441@main">309441@main</a>)  (170868383)</li>
<li>Fixed an issue where an anonymous block created for list markers was not properly collapsed when block content prevented line-box parenting. (<a href="https://commits.webkit.org/309466@main">309466@main</a>)  (172686060)</li>
<li>Fixed an issue where elements flickered when scrolling. (<a href="https://commits.webkit.org/309493@main">309493@main</a>)  (172701438)</li>
<li>Fixed an issue where U+2029 PARAGRAPH SEPARATOR was not treated as a forced line break. (<a href="https://commits.webkit.org/309706@main">309706@main</a>)  (173106856)</li>
<li>Fixed an issue where tiles were missing after navigating back in history. (<a href="https://commits.webkit.org/309966@main">309966@main</a>)  (173288233)</li>
</ul>
<h3>SVG</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where SVG animation did not clear the animated CSS property when <code>attributeName</code> was dynamically changed. (<a href="https://commits.webkit.org/309621@main">309621@main</a>)  (97097883)</li>
<li>Fixed an issue where a CSS filter referencing an SVG filter via <code>url(#id)</code> was not invalidated when the filter content changed. (<a href="https://commits.webkit.org/309495@main">309495@main</a>)  (101870430)</li>
<li>Fixed an issue where invalid SVG filter effects were rendered instead of being suppressed. (<a href="https://commits.webkit.org/309463@main">309463@main</a>)  (130951885)</li>
<li>Fixed an issue where <code>getScreenCTM()</code> did not include CSS transforms and zoom contributions in the legacy SVG rendering path. (<a href="https://commits.webkit.org/309354@main">309354@main</a>)  (171525696)</li>
<li>Fixed an issue where an SVG <code>&lt;image&gt;</code> element was not repainted when the <code>href</code> attribute was removed. (<a href="https://commits.webkit.org/309397@main">309397@main</a>)  (172530834)</li>
<li>Fixed an issue where an invalid attribute type in one SVG animation group prevented all subsequent animation groups from running. (<a href="https://commits.webkit.org/309436@main">309436@main</a>)  (172593109)</li>
<li>Fixed a regression where wheel events were not dispatched to an empty <code>&lt;svg&gt;</code> root element. (<a href="https://commits.webkit.org/310013@main">310013@main</a>)  (172909441)</li>
<li>Fixed an issue where SMIL <code>parseClockValue</code> did not reject out-of-range minutes and seconds values per the SMIL timing specification. (<a href="https://commits.webkit.org/310184@main">310184@main</a>)  (173577212)</li>
</ul>
<h4>Deprecations</h4>
<ul>
<li>Removed the <code>SVGLocatable</code> and <code>SVGTransformable</code> interfaces to align with the SVG2 specification. (<a href="https://commits.webkit.org/309396@main">309396@main</a>)  (104668934)</li>
<li>Removed the <code>viewTarget</code> property from <code>SVGViewSpec</code> to align with the SVG2 specification. (<a href="https://commits.webkit.org/309424@main">309424@main</a>)  (172590438)</li>
</ul>
<h3>Storage</h3>
<h4>New Features</h4>
<ul>
<li>Added support for setting <code>maxAge</code> in the Cookie Store API via <code>cookieStore.set()</code>. (<a href="https://commits.webkit.org/309738@main">309738@main</a>)  (166301541)</li>
</ul>
<h3>Web API</h3>
<h4>New Features</h4>
<ul>
<li>Added support for fractional coordinates in <code>PointerEvent</code> and <code>TouchEvent</code> properties such as <code>clientX/clientY</code>, <code>pageX/pageY</code>, <code>offsetX/offsetY</code>, and <code>screenX/screenY</code>, while <code>MouseEvent</code> values remain whole. (<a href="https://commits.webkit.org/298383@main">298383@main</a>)  (9564176)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed <code>NavigateEvent.navigationType</code> to return <code>"replace"</code> when navigating to a URL that matches the active document&#8217;s URL. (<a href="https://commits.webkit.org/309871@main">309871@main</a>)  (169999046)</li>
<li>Fixed an issue where <code>navigation.currentEntry.key</code> did not change in private browsing windows after calling history.pushState(). (<a href="https://commits.webkit.org/309489@main">309489@main</a>)  (171147417)</li>
<li>Fixed a performance issue where <code>ResizeObserver</code> callbacks became increasingly sluggish over time. (<a href="https://commits.webkit.org/309376@main">309376@main</a>)  (172718139)</li>
<li>Fixed an issue where <code>IntersectionObserver</code> could get sluggish over time due to O(n^2) iteration when observing many elements. (<a href="https://commits.webkit.org/309387@main">309387@main</a>)  (172727210)</li>
<li>Fixed an issue where <code>navigation.currentEntry.id</code> did not change in private browsing windows after calling <code>history.replaceState()</code>. (<a href="https://commits.webkit.org/309560@main">309560@main</a>)  (172897962)</li>
</ul>
<h3>Web Inspector</h3>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where an active recording in the Timelines tab would stop when navigating or reloading the current page even when the setting to stop recording once the page loads was turned off. (<a href="https://commits.webkit.org/309566@main">309566@main</a>)  (169732727)</li>
<li>Fixed an issue where clicking the resource type selectors in the Network and Sources tabs did not show any options and just used the previously selected option. (<a href="https://commits.webkit.org/310437@main">310437@main</a>)  (173857179)</li>
</ul>
<h3>WebRTC</h3>
<h4>New Features</h4>
<ul>
<li>Added support for the <code>RTCRtpCodec</code> dictionary and related constructs. (<a href="https://commits.webkit.org/309610@main">309610@main</a>)  (172745579)</li>
</ul>
<h4>Resolved Issues</h4>
<ul>
<li>Fixed an issue where <code>RTCDataChannel</code> did not check the SCTP buffered amount synchronously. (<a href="https://commits.webkit.org/309322@main">309322@main</a>)  (172386678)</li>
<li>Fixed an issue where <code>MediaStreamTrack</code> could have incorrect settings if the source settings changed while the track was being transferred. (<a href="https://commits.webkit.org/309458@main">309458@main</a>)  (172657570)</li>
<li>Fixed an issue where a remote WebRTC track was not unmuted when the first packet was received. (<a href="https://commits.webkit.org/309987@main">309987@main</a>)  (172904930)</li>
<li>Fixed validation of RTC send encodings to better align with the specification. (<a href="https://commits.webkit.org/310055@main">310055@main</a>)  (172997814)</li>
</ul>
]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>