Jenis warna dan ruang warna CSS baru, fungsi trigonometri CSS, dan View Transitions API.
Kecuali jika dinyatakan lain, perubahan berikut berlaku pada rilis saluran beta Chrome 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 masih dalam versi beta mulai 9 Februari 2023. Anda dapat mendownload aplikasi terbaru di Google.com untuk desktop atau di Google Play Store di Android.
CSS
Jenis warna dan ruang CSS baru
Semua fitur yang dijelaskan di CSS Color Level 4 kini diaktifkan. Ini mencakup empat jenis warna yang tidak bergantung pada perangkat (lab, Oklab, lch, dan Oklch), fungsi color(), serta ruang warna yang ditentukan pengguna untuk gradien dan animasi.
Baca Panduan warna CSS definisi tinggi untuk mempelajari ruang dan jenis 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 yang didukung. Contoh berikut ini menggabungkan 10% blue ke dalam white dalam SRGB.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
Pemilih CSS 4 Kelas-Pseudo :nth-child(an + b dari 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.
Menata Gaya Kueri Penampung untuk Properti Khusus CSS
Menambahkan fungsi style() ke aturan @container untuk memungkinkan penerapan gaya berdasarkan nilai yang dihitung dari properti kustom dari 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 linebox.
Web API
String kebijakan izin dan izin window-management
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 pada akhirnya menghentikan penggunaan dan menghapus window-placement. Perubahan terminologi ini memperpanjang masa pakai deskriptor karena Window Management API berkembang dari waktu ke waktu.
Media Session API: Mempresentasikan tindakan slide
Menambahkan tindakan previousslide dan nextslide ke Media Session API yang ada.
ArrayBuffer yang dapat diubah ukurannya dan SharedArrayBuffer yang dapat ditumbuhkan
Memperluas konstruktor ArrayBuffer untuk mengambil panjang maksimum tambahan yang memungkinkan pertumbuhan di tempat dan penyingkatan buffer. Demikian pula, SharedArrayBuffer diperpanjang 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 "kebijakan perujuk yang memadai ketat" persyaratan.
Streaming shadow DOM deklaratif
Ini menambahkan dukungan untuk streaming, dengan melampirkan akar bayangan pada bagian pembuka, bukan tag template penutup.
Lihat Transitions API
Memungkinkan pembuatan transisi yang disempurnakan dalam Aplikasi Web Satu Halaman (SPA) dengan membuat snapshot tampilan dan memungkinkan DOM berubah tanpa tumpang-tindih antara status. Gunakan View Transitions untuk membuat transisi kustom, atau gunakan default crossfade sederhana untuk meningkatkan pengalaman pengguna.
Baca artikel Developer Chrome untuk mendapatkan informasi selengkapnya dan contoh transisi untuk membantu Anda memulai.
Ekstensi Coding Video yang Skalabel WebRTC
Ekstensi ini menentukan metode standar untuk memilih di antara kemungkinan konfigurasi Coding Video (SVC) yang Skalabel pada jalur video WebRTC keluar.
Atribut enabledFeatures WebXR
Menampilkan kumpulan fitur yang diaktifkan untuk XRSession ini seperti yang ditentukan oleh XRSessionInit dan Fitur Tersirat yang diperlukan oleh spesifikasi untuk mode dan fitur yang diberikan. Untuk Sesi tertentu, data ini akan berisi semua requiredFeatures, tetapi dapat berupa subkumpulan optionalFeatures. Sebagian besar fitur memiliki cara alternatif untuk mendeteksi apakah fitur tersebut diberikan; namun, untuk beberapa fitur, tanda apakah suatu fitur diaktifkan atau tidak mungkin terkait dengan data untuk fitur yang saat ini hanya belum tersedia, bukan data yang tidak pernah tersedia. Dengan membuat kueri enabledFeatures, Anda dapat menentukan apakah petunjuk bermanfaat (misalnya, untuk meningkatkan atau memulai pelacakan) 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 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 rantai metode itu untuk mengambil manifesnya.
Kemampuan pengabaian ini dihapus di Chrome 111 dengan uji coba origin terbalik dari 111 menjadi 113 untuk developer yang perlu mengaktifkan kembali pengabaian tersebut untuk sementara. Untuk memilih ikut serta, daftar ke uji coba penghentian penggunaan terbalik untuk pengabaian CSP connect-src.
Picture-in-Picture Dokumen
Document Picture-in-Picture API adalah API baru untuk membuka jendela yang selalu ada di atas yang dapat diisi dengan konten HTML arbitrer. Ini adalah perluasan dari Picture-in-Picture API yang sudah ada, yang hanya memungkinkan HTMLVideoElement untuk dimasukkan ke jendela PiP. Dengan begitu, developer web dapat memberikan pengalaman PiP yang lebih baik kepada pengguna.
Baca dokumentasi untuk Dokumen Picture-in-Picture.
Daftar untuk mengikuti uji coba origin Document Picture-In-Picture.
Penghentian penggunaan dan penghapusan
Versi Chrome ini memperkenalkan penghentian penggunaan dan penghapusan yang tercantum di bawah. Kunjungi ChromeStatus.com untuk melihat daftar penghentian yang direncanakan, penghentian penggunaan saat ini, dan penghapusan sebelumnya.
Rilis Chrome ini menghapus tiga fitur.
Menghapus PaymentInstrumen
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 sebenarnya, yang ternyata belum benar, dan memiliki beberapa kebocoran privasi. Ini juga tidak diluncurkan di browser lain, kami belum melihat minat dari vendor browser lainnya. Oleh karena itu, API ini tidak digunakan lagi dan 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 dirantai metode untuk mengambil manifesnya.
Lihat informasi dalam uji coba origin untuk metode ikut serta dalam uji coba penghentian penggunaan yang memberikan lebih banyak waktu untuk melakukan perubahan yang diperlukan akibat penghapusan ini.
Identitas penjual di peristiwa canmakepayment
Peristiwa pekerja layanan canmakepayment memungkinkan penjual mengetahui apakah pengguna memiliki kartu yang tersimpan di aplikasi pembayaran yang terinstal. Fitur ini digunakan untuk meneruskan data arbitrer dan asal penjual ke pekerja layanan dari asal aplikasi pembayaran secara diam-diam. Komunikasi lintas origin ini terjadi pada konstruksi PaymentRequest di JavaScript, tidak memerlukan gestur pengguna, dan tidak menampilkan antarmuka pengguna apa pun. Bagian data senyap ini telah dihapus dari peristiwa canmakepayment, dan Intent IS_READY_TO_PAY Android).