Jenis warna dan ruang warna CSS baru, fungsi trigonometri CSS, dan View Transitions API.
Kecuali jika dinyatakan lain, perubahan berikut berlaku untuk rilis saluran Chrome Beta terbaru untuk Android, ChromeOS, Linux, macOS, dan Windows. Pelajari lebih lanjut fitur yang tercantum di sini melalui link yang disediakan atau dari daftar di ChromeStatus.com. Chrome 111 adalah versi beta mulai 9 Februari 2023. Anda dapat mendownload versi terbaru di Google.com untuk desktop atau di Google Play Store di Android.
CSS
Jenis dan ruang warna CSS baru
Semua fitur yang dijelaskan di CSS Color Level 4 kini diaktifkan. Hal ini mencakup empat jenis warna yang tidak bergantung pada perangkat (lab, Oklab, lch, dan Oklch), fungsi color(), dan ruang warna yang ditentukan pengguna untuk gradien dan animasi.
Baca Panduan warna CSS dengan resolusi tinggi untuk mempelajari jenis dan ruang warna baru ini.
Fungsi color-mix()
Fungsi color-mix() yang sangat berguna dari CSS Color 5 juga tersedia. Fungsi ini memungkinkan pencampuran persentase satu warna ke warna lain, dalam ruang warna apa pun yang didukung. Contoh berikut ini menggabungkan 10% blue ke dalam white di SRGB.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
Pemilih CSS 4 Pseudo-Class :nth-child(an + b of S)
Memperluas :nth-child(an + b) dan :nth-last-child() untuk mengambil pemilih. Misalnya, :nth-child(3 of .c) adalah .c ketiga di bawah induk tertentu. Untuk mempelajari lebih lanjut, baca postingan Kontrol lebih besar atas pilihan :nth-child() dengan sintaksis of S.
Unit font root CSS
Menambahkan unit font root: rex, rch, ric, dan rlh ke unit font root rem yang ada.
Fungsi trigonometri CSS
Fungsi trigonometri sin(), cos(), tan(), asin(), acos(), atan(), atan2() telah ditambahkan ke ekspresi matematika CSS.
Kueri Penampung Gaya untuk Properti Khusus CSS
Menambahkan fungsi style() ke aturan @container untuk memungkinkan penerapan gaya berdasarkan nilai yang dihitung dari properti kustom elemen ancestor.
Properti baseline-source
Properti baseline-source memungkinkan developer web menentukan apakah kotak tingkat inline harus menggunakan dasar pengukuran first atau last untuk perataan dalam kotak baris.
Web API
String izin window-management dan kebijakan izin
Chrome 111 menambahkan window-management sebagai alias untuk string izin dan kebijakan izin window-placement. Hal ini adalah bagian dari upaya yang lebih besar untuk mengganti nama string dengan menghentikan penggunaan dan menghapus window-placement. Perubahan terminologi meningkatkan masa pakai deskripsi seiring perkembangan Window Management API dari waktu ke waktu.
Media Session API: Menampilkan tindakan slide
Menambahkan tindakan previousslide dan nextslide ke Media Session API yang ada.
ArrayBuffer yang dapat diubah ukurannya dan SharedArrayBuffer yang dapat diperluas
Luaskan konstruktor ArrayBuffer untuk mengambil panjang maksimum tambahan yang memungkinkan pertumbuhan dan penyusutan buffer di tempat. Demikian pula, SharedArrayBuffer diperluas untuk mengambil panjang maksimum tambahan yang memungkinkan pertumbuhan di tempat.
Aturan spekulasi: kunci kebijakan perujuk
Hal ini memperluas sintaksis aturan spekulasi untuk memungkinkan developer menentukan kebijakan perujuk yang akan digunakan dengan permintaan spekulatif yang dipicu oleh aturan spekulasi. Hal ini juga memperkenalkan kembali persyaratan "kebijakan perujuk yang cukup ketat".
Streaming shadow DOM deklaratif
Hal ini menambahkan dukungan untuk streaming, dengan melampirkan root bayangan pada tag template pembuka, bukan penutup.
View Transitions API
Memungkinkan pembuatan transisi yang rapi di Aplikasi Web Satu Halaman (SPA) dengan mengambil snapshot tampilan dan memungkinkan DOM berubah tanpa tumpang-tindih antar-status. Gunakan Transisi Tampilan untuk membuat transisi kustom, atau gunakan crossfade default sederhana untuk meningkatkan pengalaman pengguna.
Lihat artikel Developer Chrome untuk mengetahui informasi selengkapnya dan contoh transisi untuk membantu Anda memulai.
Ekstensi Scalable Video Coding WebRTC
Ekstensi ini menentukan metode standar untuk memilih antara kemungkinan konfigurasi Scalable Video Coding (SVC) pada trek video WebRTC keluar.
Atribut enabledFeatures WebXR
Menampilkan kumpulan fitur yang diaktifkan untuk XRSession ini seperti yang ditentukan oleh XRSessionInit dan Fitur Implisit yang diperlukan oleh spesifikasi untuk mode dan fitur tertentu. Untuk Sesi yang diberikan, ini akan berisi semua requiredFeatures, tetapi mungkin merupakan subkumpulan dari optionalFeatures. Sebagian besar fitur memiliki cara alternatif untuk mendeteksi apakah fitur tersebut telah diberikan; namun, untuk beberapa fitur, sinyal apakah fitur diaktifkan atau tidak mungkin terkait erat dengan data untuk fitur yang saat ini tidak tersedia, bukan data yang tidak pernah tersedia. Dengan mengkueri enabledFeatures, Anda dapat menentukan apakah ada petunjuk bermanfaat (misalnya, untuk meningkatkan atau memulai pelacakan) yang harus ditampilkan, atau apakah fitur tidak akan pernah didukung dalam sesi saat ini.
Uji coba origin sedang berlangsung
Di Chrome 111, Anda dapat memilih untuk mengikuti uji coba origin baru berikut.
Uji coba penghentian penggunaan untuk penghapusan pengabaian CSP connect-src di Web Payment API
Menghentikan penggunaan kemampuan Web Payment API untuk mengabaikan kebijakan CSP connect-src saat mengambil manifes. Setelah penghentian ini, kebijakan CSP connect-src situs harus mengizinkan URL metode pembayaran yang ditentukan dalam panggilan PaymentRequest, serta URL lain yang dihubungkan metode untuk mengambil manifesnya.
Kemampuan pengabaian ini dihapus di Chrome 111 dengan uji coba origin terbalik dari 111 hingga 113 untuk developer yang perlu mengaktifkan kembali pengabaian untuk sementara. Untuk ikut serta, daftar ke uji coba penghentian penggunaan balik untuk pengabaian CSP connect-src.
Mendokumentasikan Picture-in-Picture
Document Picture-in-Picture API adalah API baru untuk membuka jendela yang selalu berada di atas yang dapat diisi dengan konten HTML arbitrer. Ini adalah perluasan dari Picture-in-Picture API yang ada yang hanya memungkinkan HTMLVideoElement dimasukkan ke dalam jendela PiP. Hal ini memungkinkan developer web memberikan pengalaman PiP yang lebih baik kepada pengguna.
Baca dokumentasi untuk Picture-in-Picture Dokumen.
Daftar untuk Uji coba origin Picture-In-Picture Dokumen.
Penghentian dan penghapusan
Versi Chrome ini memperkenalkan penghentian penggunaan dan penghapusan yang tercantum di bawah. Buka ChromeStatus.com untuk melihat daftar penghentian penggunaan yang direncanakan, penghentian penggunaan saat ini, dan penghapusan sebelumnya.
Rilis Chrome ini menghapus tiga fitur.
Menghapus PaymentInstruments
PaymentInstruments adalah Web API yang mendukung penginstalan non-JIT aplikasi pembayaran (lihat https://w3c.github.io/payment-handler/). Fitur ini dirancang dengan asumsi bahwa browser akan menyimpan detail instrumen pembayaran yang sebenarnya, yang ternyata tidak benar, dan memiliki beberapa kebocoran privasi. Fitur ini juga belum dikirimkan di browser lain, dan kami belum melihat minat dari vendor browser lain. Oleh karena itu, API ini tidak digunakan lagi dan telah dihapus.
Menghapus pengabaian CSP connect-src di Web Payment API
Menghentikan penggunaan kemampuan Web Payment API untuk mengabaikan kebijakan CSP connect-src saat mengambil manifes. Setelah penghapusan ini, kebijakan CSP connect-src situs harus mengizinkan URL metode pembayaran yang ditentukan dalam panggilan PaymentRequest, serta URL lain yang dihubungkan metode untuk mengambil manifesnya.
Lihat informasi di bagian uji coba origin untuk mengetahui metode memilih ikut serta dalam uji coba penghentian yang memberi lebih banyak waktu untuk melakukan perubahan yang diperlukan karena penghapusan ini.
Identitas penjual dalam peristiwa canmakepayment
Peristiwa pekerja layanan canmakepayment memungkinkan penjual mengetahui apakah pengguna memiliki kartu yang tersimpan di aplikasi pembayaran yang diinstal. Peristiwa ini digunakan untuk meneruskan asal penjual dan data arbitrer secara diam-diam ke pekerja layanan dari asal aplikasi pembayaran. Komunikasi lintas origin ini terjadi pada konstruksi PaymentRequest di JavaScript, tidak memerlukan gestur pengguna, dan tidak menampilkan antarmuka pengguna apa pun. Penerusan data senyap ini telah dihapus dari peristiwa canmakepayment, dan Intent IS_READY_TO_PAY Android).