公開日: 2025 年 10 月 1 日
特に記載がない限り、これらの変更は Android、ChromeOS、Linux、macOS、Windows 向けの Chrome 142 ベータ版チャンネル リリースに適用されます。これらの機能について詳しくは、提供されているリンクまたは ChromeStatus.com をご覧ください。Chrome 142 ベータ版は、パソコンの場合は Google.com から、Android の場合は Google Play ストアからダウンロードできます。
CSS と UI
:target-before 疑似クラスと :target-after 疑似クラス
これらの疑似クラスは、フラット ツリーの順序で決定される、同じスクロール マーカー グループ内のアクティブ マーカー（:target-current に一致）の前後のスクロール マーカーに一致します。
:target-before: グループ内のフラット ツリー順でアクティブなマーカーより前のすべてのスクロール マーカーに一致します。:target-after: グループ内のフラット ツリー順でアクティブなマーカーの後に続くすべてのスクロール マーカーと一致します。
::view-transition 要素の絶対位置指定
ビュー遷移では、要素の疑似サブツリーが使用されます。::view-transition はその遷移のルートです。以前は、::view-transition 要素は position: fixed を持つように指定されていました。CSS Working Group はこれを position: absolute にすることを決定したため、Chrome はその変更を反映するようになりました。
この要素の包含ブロックは、絶対位置または固定位置のいずれの場合でもスナップショットの包含ブロックのままなので、この変更は目立たないはずです。目立った違いは getComputedStyle のみです。
ドキュメントの activeViewTransition プロパティ
View Transitions API を使用すると、開発者はさまざまな状態間の視覚的な遷移を開始できます。メインの SPA エントリ ポイントは startViewTransition() で、遷移オブジェクトを返します。このオブジェクトには、移行の進行状況を追跡するためのいくつかの Promise と機能が含まれており、移行をスキップしたり、移行のタイプを変更したりするなど、移行を操作できます。
Chrome 142 以降では、デベロッパーはこのオブジェクトを保存する必要がなくなります。document.activeViewTransition プロパティはこのオブジェクトを表します。進行中のトランジションがない場合は null になります。
これは MPA の遷移にも当てはまります。この場合、オブジェクトは pageswap イベントと pagereveal イベントでのみ使用できます。この更新では、移行期間中、document.activeViewTransition がこのオブジェクトに設定されます。
スタイル コンテナ クエリと if() の範囲構文
Chrome では、範囲構文のサポートを追加することで、CSS スタイルクエリと if() 関数が強化されています。
これにより、スタイルクエリが完全一致（style(--theme: dark) など）を超えて拡張されます。デベロッパーは、比較演算子（> や < など）を使用して、カスタム プロパティ、リテラル値（10px や 25% など）、置換関数（attr() や env() など）の値を比較できます。有効な比較を行うには、両側が同じデータ型に解決される必要があります。次の数値型に限定されます: <length>、<number>、<percentage>、<angle>、<time>、<frequency>、<resolution>。
例:
カスタム プロパティをリテラル長と比較します。
@container style(--inner-padding > 1em) {
.card {
border: 2px solid;
}
}
2 つのリテラル値を比較する
@container style(1em < 20px) {
/* ... */
}
if() でスタイル範囲を使用する:
.item-grid {
background-color: if(style(attr(data-columns, type<number>) > 2): lightblue; else: white);
}
インタレスト起動元（interestfor 属性）
Chrome は <button> 要素と <a> 要素に interestfor 属性を追加します。この属性は、要素に「関心」の動作を追加します。ユーザーが要素に「関心を示す」と、ターゲット要素に対してアクションがトリガーされます（ポップオーバーの表示など）。ユーザーが要素にカーソルを合わせる、キーボードの特別なホットキーを押す、タッチスクリーンの要素を長押しするなどの方法で、ユーザーが要素に「関心を示した」ことをユーザー エージェントが検出します。関心が示された場合や失われた場合、ターゲットで InterestEvent が発生します。このターゲットには、ポップオーバーの表示や非表示など、ポップオーバーのデフォルトのアクションが設定されています。
font-language-override プロパティ
Chrome で font-language-override CSS プロパティのサポートが導入されました。このプロパティを使用すると、デベロッパーは CSS で 4 文字の言語タグを直接指定して、OpenType グリフの置換に使用されるシステム言語をオーバーライドできます。
これにより、きめ細かいタイポグラフィ制御が可能になります。これは、多言語コンテンツや言語固有のグリフ バリエーションを含むフォントで特に便利です。
SVG <a> 要素の download 属性
Chrome では、SVG 2 仕様に沿って、SVGAElement インターフェースの download 属性のサポートが導入されました。download 属性を使用すると、SVG ハイパーリンクのリンク先に移動するのではなく、リンク先をダウンロードすることを指定できます。これは、HTMLAnchorElement で既にサポートされている動作を反映したものです。これにより、主要なブラウザ間の相互運用性が促進され、HTML と SVG の <a> 要素間の動作の一貫性が確保され、デベロッパー エクスペリエンスとユーザーの期待が向上します。
特定の要素のレンダリング モードにおけるモバイルとパソコンの同等性
size 属性と multiple 属性を使用すると、<select> 要素をページ内リストボックスまたはポップアップ付きのボタンとしてレンダリングできます。ただし、これらのモードはモバイル版 Chrome とパソコン版 Chrome で一貫して利用できるわけではありません。モバイルではページ内リストボックスのレンダリングが利用できず、パソコンでは multiple 属性が存在する場合にポップアップ付きのボタンが利用できません。
この更新により、モバイルにリストボックスが追加され、パソコンに複数選択ポップアップが追加されます。また、size 属性と multiple 属性を含むオプトインがモバイルとパソコンで同じレンダリング モードになるようになります。変更内容は次のとおりです。
size属性の値が1より大きい場合、常にページ内レンダリングが使用されます。モバイル デバイスではこれまで無視されていました。size属性なしでmultiple属性が設定されている場合は、ページ内レンダリングが使用されます。モバイル デバイスでは、以前はページ内リストボックスではなくポップアップが使用されていました。multiple属性がsize=1で設定されている場合、ポップアップが使用されます。以前は、パソコンでページ内リストボックスを使用していました。
同一オリジン レンダラによって開始されたナビゲーション全体でユーザー アクティベーションを維持
Chrome では、ページが同じオリジンの別のページに移動した後も、ユーザーの固定アクティベーション状態が維持されます。ナビゲーション後のページでユーザーがアクティブ化されていないと、自動フォーカスで仮想キーボードを表示するなどのユースケースが一部機能しません。これにより、SPA よりも MPA を構築したいと考えているデベロッパーがブロックされてきました。
ブラウザで開始されたナビゲーション リクエスト（再読み込み、履歴ナビゲーション、アドレスバーに入力された URL など）は対象外です。
ウェブ API
WebGPU: primitive_index 機能
WebGPU に、新しい WGSL シェーダー組み込み関数 primitive_index を公開する新しいオプション機能が追加されました。vertex_index や instance_index の組み込み関数と同様に、サポートされているハードウェア上のフラグメント シェーダーにプリミティブごとのインデックスを提供します。プリミティブ インデックスは、仮想化されたジオメトリなどの高度なグラフィック技術に役立ちます。
WebGPU: テクスチャ形式 tier1 と tier2
レンダリング アタッチメント、ブレンディング、マルチサンプリング、解決、storage_binding などの機能で GPU テクスチャ形式のサポートを拡張します。
insertFromPaste、insertFromDrop、insertReplacementText 入力イベントの DataTransfer プロパティ
contenteditable 要素での編集オペレーション中にクリップボードとドラッグ＆ドロップのデータにアクセスできるように、入力イベントの dataTransfer プロパティに insertFromPaste、insertFromDrop、insertReplacementText の inputType 値を設定します。
dataTransfer オブジェクトには、beforeinput イベント中に利用可能だったデータと同じデータが含まれています。
この機能は contenteditable 要素にのみ適用されます。フォーム コントロール (textarea、input の動作はこれまでと変わりません。
このプロパティにより、Chrome は Safari や Firefox と相互運用できるようになります。
メディア セッション: enterpictureinpicture アクションの詳細に理由を追加
Media Session API の enterpictureinpicture アクションに送信される MediaSessionActionDetails に enterPictureInPictureReason を追加します。これにより、デベロッパーは、ユーザーによって明示的にトリガーされた enterpictureinpicture アクション（ユーザー エージェントのボタンなど）と、コンテンツが隠されたためにユーザー エージェントによって自動的にトリガーされた enterpictureinpicture アクションを区別できます。
Web Speech API のコンテキスト バイアス
このアップデートにより、ウェブサイトは Web Speech API に認識フレーズ リストを追加することで、音声認識のコンテキスト バイアスをサポートできるようになります。
デベロッパーは、フレーズのリストを指定して更新し、それらのフレーズを優先するように音声認識モデルにバイアスをかけることができます。これにより、ドメイン固有の音声認識とパーソナライズされた音声認識の精度と関連性を高めることができます。
JSON モジュールの *+json MIME トークン検証の厳格化
*+json と一致する場合、MIME タイプのタイプまたはサブタイプに HTTP 以外のトークン コードポイント（スペースなど）が含まれている JSON モジュール スクリプト レスポンスを拒否します。これは、MIME Sniffing 仕様や他のエンジンと一致しています。これは Interop2025 モジュールの重点分野の一部です。
FedCM - UI でサードパーティの iframe オリジンを表示するサポート
Chrome 142 より前では、FedCM は常に最上位サイトを UI に表示していました。
これは、iframe が概念的にファーストパーティである場合（たとえば、foo.com に iframe foostatic.com があるが、ユーザーにとって意味がない場合）に有効です。
ただし、iframe が実際にはサードパーティのものである場合は、ユーザーが認証情報を共有する相手をよりよく理解できるように、UI に iframe のオリジンを表示することをおすすめします。たとえば、書籍出版ウェブアプリに写真エディタが埋め込まれていて、ユーザーが以前に写真エディタで保存したファイルにアクセスできるようにしたい場合があります。この機能はすでにご利用いただけるようになっています。
オリジンキー プロセス分離
プロセス分離ポリシーを、プロセスをサイト（example.com など）にロックするものから、特定のオリジン（foo.example.com など）にロックするものに変更します。
セキュリティをさらに強化するため、Chrome では「オリジン分離」と呼ばれるより粒度の細かいプロセス分離モデルに移行しています。Chrome では、同じサイトの異なるオリジン（a.example.com や b.example.com など）を 1 つのレンダラ プロセスにグループ化する「サイト分離」が使用されていました。
オリジン分離では、個々のオリジン（https://foo.example.com など）が独自のレンダラ プロセスで分離されます。プロセス境界をウェブの基本的なオリジンベースのセキュリティ モデルに合わせることで、Chrome のセキュリティ アーキテクチャを強化し、サイト内の潜在的な脆弱性に対する保護を強化します。
相互運用可能な pointerrawupdate イベントをセキュア コンテキストでのみ公開
PointerEvents 仕様では、2020 年に pointerrawupdate を安全なコンテキストに制限し、イベントの発生とグローバル イベント リスナーの両方を安全でないコンテキストから隠蔽しました。このアップデートにより、Chrome は更新された仕様に準拠し、他の主要ブラウザとの相互運用が可能になります。
進行中のオリジン トライアル
Chrome 142 では、次の新しいオリジン トライアルにオプトインできます。
デバイスにバインドされたセッション認証情報
ウェブサイトがセッションを単一のデバイスに安全にバインドする方法。
これにより、サーバーはセッションをデバイスに安全にバインドできます。ブラウザは、サーバーからリクエストされたときに、秘密鍵の所有証明とともにセッションを定期的に更新します。
トップレベル サイトごとの TCP ソケット プール
この試験では、プロファイルごとの TCP ソケット プールサイズを 256（デフォルト）から 513 に変更し、トップレベル サイトごとの上限を 256 に設定した場合の影響を評価します（2 つのタブがプールを使い切ることがないようにするため）。プロファイルあたりの上限を 512 に引き上げる可能性について検討した結果、悪影響はないことがわかりました。トップレベル サイトごとの上限 256 は、プロファイルごとのデフォルトの上限と同じであるため、パフォーマンスに悪影響を及ぼすことはありません。これらの上限は、WebSocket プールと通常の（HTTP）ソケットプールに個別に適用されます。
悪影響が発生しない場合は、このテストを直接リリースする予定です。