Google Chrome 83安定版リリース、Microsoftの協力でフォームの見た目&操作性が大幅アップデート

ウェブブラウザ「Google Chrome」の最新安定版であるバージョン83.0.4103.61がリリースされました。クロスサイトスクリプティング攻撃(XSS)を防止するのに役立つ仕組みが導入されたり、フォームの見た目や操作性が改善されたほか、バーコードを認識するためのAPIが導入されるなどのアップデートが行われています。

New in Chrome 83  |  Web  |  Google Developers
https://developers.google.com/web/updates/2020/05/nic83

New in Chrome 83: Trusted types, updated form controls, and more! - YouTube


◆XSSを防止するための仕組み「Trusted Types」が登場
XSSは、ユーザーからの入力を受け取ってページに表示するサイトなどで、入力を適切に処理しなかったために悪意あるコードがページ上で実行されてしまうというものです。HTMLを生成する場所によってサーバーサイドXSSとクライアントサイドXSSに分類できますが、このうち後者の原因になりうる場所を見つけてくれるのがTrusted Typesです。

Trusted Typesをオンにすることで、innerHTMLのようなXSSの原因になりうる要素に文字を代入しようとした時にエラーを出させる事が可能に。

代わりに、textContentのようにXSSを引き起こさない関数を利用したり、危険な関数への代入前にTrustedなオブジェクトに変換したり、createElementとappendChildを組み合わせたりすることでウェブサイトを安全に保つことができます。

エラーを出してサイトを停止させる代わりにレポートのみ行う機能も実装されています。詳細な仕様や実装方法はweb.devサイト上で確認可能です。

◆フォームの見た目がデバイスによらず一貫性を持つようになり、操作性も改善
下の画像の左側が以前の見た目で、右側が新しい見た目です。

見た目の他に、タッチ操作やキーボード操作が行いやすくなるようなアップデートも行われています。例えば、フォーカスされている要素を示すフォーカスリングの見た目が変更され、どのような背景色でも高い視認性を得られるようになりました。


具体的にどのような変更が行われているのかはchromiumのブログにまとめられています。なお、これらフォームのアップデートはMicrosoftのEdgeチームと協力して行われており、すでにEdgeでは新しいフォームが反映されているとのこと。

◆新機能のテストに「メモリ測定API」と「ファイルシステムAPI」が登場
開発者がChromeに搭載予定の機能を試すことができるシステムのOrigin Trialsに、メモリ測定APIとファイルシステムAPIが登場しています。メモリの測定を行うことでメモリリークを防いだり、ファイルシステムAPIを利用することでウェブアプリからPC内のファイルを簡単に操作したりすることが可能になります。

◆QRコードやバーコードを認識できるバーコード判別APIが実装
これまで、各種のバーコードを認識するためには外部のJavaScriptライブラリを読み込んで処理する必要がありましたが、Chrome 83からは画像やカメラの映像などを読み込んで各種バーコードを認識するためのAPIがブラウザに実装されています。なお、バーコードの他に顔や文字などの検出も開発中とのこと。

◆CSSの@supports構文でselectorが利用可能に
@supportsはブラウザが特定のCSS要素に対応しているかどうかによってCSSを条件分岐させることが可能な構文です。Chrome 83からは「::before」など特定のselectorに対応しているかどうかを確認できるようになりました。

◆目が見えない人の利便性を改善するARIAをアップデート
ARIAに新たな注釈要素が加わり、共同編集などの作業がより行いやすくなっています。

また、Chrome 83には38個のセキュリティバグフィックスが含まれています。