Google Developers Japan: Chrome 64 ベータ版: ポップアップブロッカーの強化、Resize Observer、import.meta

Local blog for Japanese speaking developers

Chrome 64 ベータ版: ポップアップブロッカーの強化、Resize Observer、import.meta

2018年2月5日月曜日

この記事はポップアップ表示エンジニア、Charles Harrison による Chromium Blog の記事 "Chrome 64 Beta: stronger pop-up blocker, Resize Observer, and import.meta" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。ベータ版 ポップアップブロッカーの強化不正行為防ぐ不正行為レポート

2 種類の不正行為。サイトの制御ボタンの動作が偽装されており、クリックすると別の動作が実行される。1 つは動画の再生ボタンのように見えるが、クリックすると望まないダウンロードが行われる（左）。もう 1 つは閉じるボタンに見えるが、望まないポップアップウィンドウが開く（右）。 Resize ObserverResize Observerさらに細かい制御変更の監視 const ro = new ResizeObserver((entries) => { for (const entry of entries) { const cr = entry.contentRect; console.log('Element:', entry.target); console.log(`Element size: ${cr.width}px × ${cr.height}px`); console.log(`Element padding: ${cr.top}px / ${cr.left}px`); } });
// 1 つまたは複数の要素を監視 ro.observe(someElement); 上のコードスニペットは、Resize Observer API を使って要素の変更を監視する。
import.metaimport.metaサポート今回のリリースに追加されたその他の機能 Blink > アニメーション

offset-path プロパティを使って要素を動かすパスの形状を指定することで、アニメーションを実現できるようになりました。

Blink > フォント

上線と下線がグリフに重なる場合の描画方法を、text-decoration-skip-ink CSS プロパティで制御できるようになりました。

Blink > 入力

pointerType=mouse が指定されている場合、PointerEvent の座標が端数になり、マウスの位置の計測精度が向上しました。

Blink > JavaScript

デベロッパーエクスペリエンスを改善するため、正規表現で名前付きキャプチャがサポートされるようになりました。これにより、デベロッパーは正規表現にマッチする文字列の部分に意味のある名前を割り当てることができます。
u フラグがセットされた正規表現で Unicode プロパティのエスケープ（\p{…} および \P{…}）がサポートされるようになりました。これにより、デベロッパーはさらに強力な Unicode 対応正規表現を作成できます。
国際化フォーマッタがローカルを意識した文字列形式を生成するための補助として、Intl.NumberFormat.prototype.formatToParts() を使って、数値をトークンや種類のリストにフォーマットできるようになりました。この件についてサポートしていただいた Igalia に感謝いたします。

Blink > メディア

他のブラウザの実装に合わせて、Chrome でも <video> および <audio> 要素の preload の既定値が metadata になりました。これにより、リソースのメタデータのみが読み込まれ、メディアリソース自体は読み込まれなくなるので、帯域幅やリソースの使用量が減少します。
Windows 10 が HDR モードになっている場合、HDR 動画の再生がサポートされるようになりました。これにより、デベロッパーは HDR VP9 Profile 2 10 ビット動画を利用できます。
HTML 仕様と互換性を持たせるため、メディア要素の playbackRate に、Chrome でサポートされていない値が設定されている場合、"NotSupportedError" DOMException がスローされるようになりました。たとえば、負の値などがこれに該当します。
オリジントライアルとして、Media Capabilities API がサポートされるようになりました。これにより、デベロッパーはオーディオや動画の再生が十分スムーズで電力効率がよいかどうかを把握できます。この情報は、これまでのパフォーマンス統計に基づきます。
メディアキャプチャおよびストリーム仕様に合わせるため、getUserMedia() がリジェクトされた Promise を返すようになりました。エラーがある場合は、DOMException または OverconstrainedError が含まれます。

Blink > ネットワーク

cache オプションを使用して Request のキャッシュモードを指定できるようになりました。
Request.prototype.cache を使用して Request のキャッシュモードを確認したり、リクエストが再読み込みリクエストかどうかを判定できるようになりました。

Blink > Permissions API

Permissions API の仕様に準拠するため、Permissions API を使った camera および microphone のパーミッションステータスのクエリが可能になりました。

Blink > スクロール

Focus Management API で、preventScroll 属性を使用することにより、スクロールせずに要素にフォーカスできるようになりました。

Blink > SVG

変換された SVG 要素の変換と移動ができるようにするため、SVG 要素で transform-box がサポートされるようになりました。この件についてサポートしていただいた Opera に感謝いたします。

Blink > WebAudio

カスタム AudioNode をサポートするための低レベルオーディオ処理機能を公開する API、AudioWorklet がオリジントライアルとして試験運用版フラグ付きで利用できるようになりました。

Blink > WebRTC

WebRTC 1.0 仕様に準拠するため、単一ストリームユースケースの RTCPeerConnection で addTrack() がサポートされるようになりました。同様に、removeTrack()、getSenders()、ontrack と、最低限の RTCRtpSender インターフェースも利用できます。

Blink > WindowDialog

相互運用性とエンドユーザーエクスペリエンスを改善するため、バックグラウンドのタブで window.alert() が実行されても、タブがフォアグラウンドにならなくなりました。その代わり、ユーザーがバックグラウンドタブに切り替えたときにアラートが表示されます。

UI > 通知

Notifications API または chrome.notifications で送信される Linux 版 Chrome の通知は、macOS と同様にネイティブの通知システムによって直接表示されるようになりました。

サポートの終了と相互運用性の改善

Blink > CSS

仕様に準拠するため、 getMatchedCSSRules が削除されました。デベロッパーは、代わりに Blink ポリフィルを使用できます。

Blink > DOM

Chrome 45 でサポートが終了されたことを受けて、要素で複数の Shadow Root をホストできなくなりました。

Blink > Performance API

Navigation Timing 2、nextHopProtocol、Paint Timing API などの標準化された読み込み指標 API の採用を促すため、標準ではない chrome.loadTimes API のサポートが終了します。

今回のリリースのすべての機能が記載された完全なリスト（試験運用版機能を含む）は、

Chrome 64 マイルストーンホットリストをご覧ください。

Reviewed by Eiji Kitamura - Developer Relations Team

ラベル

ブログアーカイブ

2020
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2019
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2018
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2017
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2016
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2015
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2

2014
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2013
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2012
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2011
- 12
- 11
- 10
- 9
- 8
- 7
- 6
- 5
- 4
- 3
- 2
- 1

2010
- 12
- 11

Feed

"プロダクトに関するご意見はプロダクトフォーラムにお願いします"

Google
Privacy
Terms