2025 年 2 月に安定版とベータ版のウェブブラウザに導入された興味深い機能をご紹介します。
公開日: 2025 年 2 月 28 日
安定版ブラウザ リリース
2025 年 2 月に Firefox 135 と Chrome 133 が安定版になりました。この記事では、ウェブ プラットフォームに追加された新機能を紹介します。
WebAuthn の機能を確認する
Firefox 135 と Chrome 133 の両方で、PublicKeyCredential.getClientCapabilities() 静的メソッドのサポートが追加されました。これにより、ブラウザのスニッフィングに頼ることなく、ブラウザが Web Authentication API の機能をサポートしているかどうかを確認できます。
Firefox 135 には、ソース付き JSON 解析プロポーザルの機能(JSON.parse reviver パラメータ context 引数、JSON.isRawJSON()、JSON.rawJSON())も含まれています。
ポップオーバー属性のヒント値
Chrome 133 では、popover 属性に 3 つ目の値 popover="hint" が追加されます。ヒントは、ほとんどの場合「ツールチップ」タイプの動作に関連付けられますが、動作は若干異なります。既存の自動ポップオーバーのスタックが開いたまま、無関係なヒント ポップオーバーを開けるようになりました。
典型的な例は、<select> 選択ツールが開いている(popover="auto")状態で、ホバーによってトリガーされるツールチップ(popover="hint")が表示されている場合です。この操作で <select> 選択ツールは閉じません。
Browser Support
詳しくは、ポップオーバー = ヒントをご覧ください。
CSS の高度な attr() 関数
Chrome 133 では、CSS の追加機能がいくつか追加されています。この Chrome リリースには、CSS レベル 5 で指定されている attr() の拡張が含まれています。これにより、<string> 以外の型が許可され、すべての CSS プロパティで使用できるようになります(疑似要素コンテンツの既存のサポートに加えて)。
Browser Support
詳しくは、CSS attr() のアップグレードをご覧ください。
CSS スクロール状態のコンテナクエリ
Chrome 133 では、コンテナクエリを使用して、スクロール状態に基づいてコンテナの子孫にスタイルを適用します。
クエリ コンテナは、スクロール コンテナ、またはスクロール コンテナのスクロール位置の影響を受ける要素のいずれかです。クエリ可能な状態は次のとおりです。
stuck: スティッキーに配置されたコンテナがスクロール ボックスのいずれかの端に固定されています。snapped: スクロール スナップが適用されたコンテナが、現在水平方向または垂直方向にスナップされています。scrollable: スクロール コンテナをクエリされた方向にスクロールできるかどうか。
また、container-type の新しい値として、コンテナをクエリできる scroll-state があります。
Browser Support
詳しくは、CSS scroll-state() をご覧ください。
CSS text-box、text-box-trim、text-box-edge
Chrome 133 の CSS には、text-box-trim プロパティと text-box-edge プロパティ、text-box ショートカット プロパティも追加されています。これにより、テキストの垂直方向の配置をより細かく制御できるようになります。
Browser Support
この便利なプロパティの詳細については、CSS text-box-trim をご覧ください。
DOM の状態を保持した移動
Chrome 133 では、要素の状態をリセットせずに DOM ツリー内で要素を移動できる DOM プリミティブ(Node.prototype.moveBefore)が追加されました。
削除と挿入ではなく移動する場合、次のような状態が保持されます。
<iframe>要素は読み込まれたままになります。- アクティブな要素はフォーカスされたままになります。
- ポップオーバー、全画面、モーダル ダイアログは開いたままになります。
- CSS の遷移とアニメーションは続行されます。
Browser Support
FileSystemObserver インターフェース
Chrome 133 で追加された FileSystemObserver インターフェースは、ファイルシステムの変更をウェブサイトに通知します。サイトは、ユーザーが以前に権限を付与したファイルとディレクトリの変更を、ユーザーのローカル デバイスまたはバケット ファイル システム(オリジンのプライベート ファイル システム)で検出し、変更タイプなどの基本的な変更情報を通知します。
Browser Support
ベータ版ブラウザのリリース
ブラウザのベータ版では、ブラウザの次の安定版に含まれる機能のプレビューを利用できます。リリース前に、サイトに影響する可能性がある新機能や削除をテストできます。新しいベータ版は、Firefox 136、Safari 18.4、Chrome 134 です。今回のリリースでは、プラットフォームに多くの優れた機能が追加されています。詳細については、リリースノートをご覧ください。主な機能は次のとおりです。
最新の Safari ベータ版には、このブラウザが安定した時点でベースラインの新機能として提供される予定の機能など、多数の追加機能と改善が含まれています。たとえば、writing-mode: sideways-rl と writing-mode: sideways-lr、ClipboardItem の supports() 静的メソッド、および Iterator Helpers プロポーザルにあるすべてのリスト。
Safari 18.4 ベータ版と Firefox 136 の両方に Cookie Store API が含まれています。この API は、両方のブラウザがリリースされると、ベースラインとして新規に利用可能になります。
Firefox 136 には、:open と :has-slotted の疑似クラスが含まれています。後者は Chrome 134 にも含まれています。また、Intl.DurationFormat も含まれており、これはベースラインとして新規に利用可能になります。
Chrome 134 には、カスタマイズ可能な <select> 要素、CSS dynamic-range-limit プロパティ、<dialog> 要素の軽い閉じる機能が含まれています。