220文字
1分
編集

Safari 26.5

#Safari

Safari 26.5 がリリースされた。CSS の :open 擬似クラスのサポート、ToggleEvent におけるトリガー要素の特定、Origin API の追加などが含まれる。

#:open 擬似クラス

<details>、<dialog>、<select>、<input> 要素に対して、開いた状態をスタイリングするための :open 擬似クラスがサポートされた。

css
details:open {
  background-color: #e0f7fa;
}

dialog:open {
  border: 2px solid blue;
}

#ToggleEvent.source

Popover などを開閉した際に発生する ToggleEvent に source プロパティが追加され、トグル操作のトリガーとなった要素（起動ボタンなど）を特定できるようになった。

html
<button popovertarget="my-popover" id="invoker">Toggle Popover</button>
<div id="my-popover" popover>Hello World</div>

<script>
document.getElementById("my-popover").addEventListener("toggle", (event) => {
  if (event.newState === "open") {
    // #invoker ボタンが source として参照できる
    console.log("Opened by:", event.source);
  }
});
</script>

#Origin API

オリジン情報を構造化された Origin オブジェクトとして扱うことができる Origin API がサポートされた。

javascript
const origin = new Origin("https://example.com:443");
console.log(origin.scheme); // "https"
console.log(origin.host);   // "example.com"

#参考文献