Firefox 158 がリリースされた。JPEG XL の既定有効化、CSS calc() の typed arithmetic、Notification の navigate オプション、autocomplete="webauthn" 単独での条件付き UI が含まれる。

#JPEG XL

JPEG XL（image/jxl）が既定で有効。非可逆・可逆圧縮、透過、アニメーション、HDR に対応し、既存 JPEG の可逆変換も扱う。画像リクエストの Accept 既定値に image/jxl が含まれる。

html
<img src="photo.jxl" alt="" width="800" height="450" />

#CSS typed arithmetic

calc() で同じデータ型どうしを除算できる。単位が違ってもよく、結果は無単位の数値になる。その数値を別の型の値に掛けて変換できる。

css
.hero {
  font-size: calc(100vw / 800px * 1rem);
  opacity: calc(100vw / 2000px);
}

#Notification の navigate

Notification() コンストラクタと ServiceWorkerRegistration.showNotification() に navigate オプションが入った。通知をクリックすると指定 URL へ遷移し、click / notificationclick は発火しない。作成後の URL は Notification.navigate で読む。

js
const notification = new Notification("更新があります", {
  body: "詳細を開く",
  navigate: "/inbox",
});
console.log(notification.navigate);

#autocomplete=“webauthn”

WebAuthn の条件付き UI が autocomplete="webauthn" だけで出る。以前は autocomplete="username webauthn" のように、別のオートフィル値との併用が必要だった。

html
<input type="text" autocomplete="webauthn" />

#参考文献