Nowe typy i przestrzenie kolorów CSS, funkcje trygonometryczne CSS oraz interfejs View Transitions API.
O ile nie zaznaczono inaczej, poniższe zmiany dotyczą najnowszej wersji Chrome w kanale beta na Androida, ChromeOS, Linuxa, macOS i Windowsa. Więcej informacji o funkcjach wymienionych w tym artykule znajdziesz, klikając odpowiednie linki lub na stronie ChromeStatus.com. Od 9 lutego 2023 r. Chrome 111 jest w wersji beta. Najnowszą wersję możesz pobrać na stronie Google.com na komputerze lub w Sklepie Google Play na urządzeniu z Androidem.
CSS
Nowe typy i przestrzenie kolorów w CSS
Wszystkie funkcje opisane w CSS Color Level 4 są teraz włączone. Obejmuje to 4 typy kolorów niezależne od urządzenia (lab, Oklab, lch i Oklch), funkcję color() oraz zdefiniowane przez użytkownika przestrzenie barw dla gradientów i animacji.
Aby dowiedzieć się więcej o tych nowych typach i przestrzeniach kolorów, przeczytaj przewodnik po kolorach CSS w wysokiej rozdzielczości.
Funkcja color-mix()
Dodano też bardzo przydatną funkcję color-mix() z CSS Color 5. Ta funkcja umożliwia mieszanie procentowe jednego koloru z innym w dowolnej obsługiwanej przestrzeni kolorów. W tym przykładzie 10% koloru blue zostaje zmieszane z kolorem white w profilu SRGB.
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
Selektory arkusza CSS 4. Pseudoklasa :nth-child(an + b of S)
Rozszerza :nth-child(an + b) i :nth-last-child(), aby uwzględnić selektor. Na przykład :nth-child(3 of .c) to trzeci .c w danym elemencie nadrzędnym. Aby dowiedzieć się więcej, przeczytaj wpis Więcej kontroli nad wyborami :nth-child() za pomocą składni of S.
Jednostki czcionki w kodzie źródłowym CSS
Dodaje do istniejącej jednostki czcionki głównej rem jednostki czcionki głównej: rex, rch, ric i rlh.
Funkcje trygonometryczne w CSS
Do wyrażeń matematycznych w CSS dodano funkcje trygonometryczne sin(), cos(), tan(), asin(), acos(), atan(), atan2().
Zapytania dotyczące kontenera stylów w przypadku właściwości niestandardowych w CSS
Dodaje funkcję style() do reguł @container, aby umożliwić stosowanie stylów na podstawie obliczonych wartości właściwości niestandardowych elementu nadrzędnego.
Właściwość baseline-source
Właściwość baseline-source pozwala twórcom stron internetowych określić, czy pole na poziomie inline powinno używać linii bazowej first czy last do wyrównywania w ramach linebox.
Interfejsy Web API
Uprawnienie window-management i ciąg znaków zasad dotyczących uprawnień
Chrome 111 dodaje window-management jako alias dla uprawnień window-placement i strun uprawnień. Jest to część większego projektu polegającego na zmianie nazw ciągów znaków, który ostatecznie spowoduje wycofanie i usunięcie window-placement. Zmiana terminologii wydłuża okres przydatności deskryptora, ponieważ interfejs Window Management API będzie się z czasem rozwijać.
Interfejs Media Session API: prezentowanie slajdu
Dodaje do dotychczasowego interfejsu Media Session API działania previousslide i nextslide.
Możliwość zmiany rozmiaru ArrayBuffer i rozwijania SharedArrayBuffer
Rozszerz konstruktory ArrayBuffer, aby uwzględniały dodatkową maksymalną długość, która umożliwia zwiększanie i zmniejszanie buforów. Podobnie SharedArrayBuffer ma dodatkową maksymalną długość, która umożliwia wzrost.
Reguły spekulacyjne: klucz zasad dotyczących strony odsyłającej
Rozszerza ona składnię reguł spekulacyjnych, aby umożliwić deweloperom określenie zasad dotyczących witryn odsyłających, które mają być używane w przypadku żądań spekulacyjnych wywoływanych przez reguły spekulacyjne. Wprowadziliśmy też ponownie zasadę „wystarczająco rygorystycznych odnośników”.
Transmisja deklaratywnego shadow DOM
Dodaje obsługę strumieniowania, dołączając katalog główny cienia do otwierającego, a nie zamykającego tagu szablonu.
Wyświetlanie interfejsu Transitions API
Umożliwia tworzenie dopracowanych przejść w aplikacjach jednostronicowych (SPA) przez wykonywanie migawek widoków i zmienianie DOM bez nakładania się stanów. Użyj opcji Przejścia między widokami, aby utworzyć przejścia niestandardowe, lub użyj prostego przejścia typu crossfade, aby ulepszyć wrażenia użytkowników.
Aby dowiedzieć się więcej i zobaczyć przykłady przejść, przeczytaj artykuł dla programistów Chrome.
Rozszerzenia WebRTC Scalable Video Coding
To rozszerzenie definiuje standardową metodę wyboru konfiguracji skalowanego kodowania wideo (SVC) na wychodzącym ścieżce wideo WebRTC.
Atrybut WebXR enabledFeatures
Zwraca zestaw funkcji, które zostały włączone dla tego XRSession zgodnie z definicją XRSessionInit, oraz funkcje domyślne wymagane przez specyfikację dla danego trybu i funkcji. W przypadku sesji przyznanej zawiera ona wszystkie requiredFeatures, ale może być podzbiorem optionalFeatures. Większość funkcji ma alternatywne sposoby wykrywania, czy zostały one przyznane. W przypadku niektórych funkcji sygnał o tym, czy funkcja została włączona, może być powiązany z danymi o tym, że funkcja jest obecnie niedostępna, a nie, że nigdy nie będzie dostępna. Dzięki zapytaniu enabledFeatures możesz określić, czy mają być wyświetlane przydatne wskazówki (np. dotyczące ulepszenia lub rozpoczęcia śledzenia) lub czy dana funkcja nigdy nie będzie obsługiwana w bieżącej sesji.
Trwające wersje próbne origin
W Chrome 111 możesz wziąć udział w tych nowych testach origin.
Wycofanie próby usunięcia obejścia connect-src CSP w interfejsie Web Payment API
Wycofanie możliwości pomijania przez Web Payment API dyrektywy CSP connect-src podczas pobierania pliku manifestu. Po wycofaniu tej dyrektywy dyrektywa CSP connect-src witryny musi zezwalać na adres URL formy płatności określony w wywołaniu PaymentRequest, a także na wszystkie inne adresy URL, które metoda łańcucha używa do pobierania pliku manifestu.
Ta możliwość została usunięta w Chrome 111, a w wersji 113 udostępniono opcję odwrócenia pochodzenia, aby umożliwić deweloperom tymczasowe ponowne włączenie tej funkcji. Aby skorzystać z tej opcji, zarejestruj się w wersji próbnej odwrotnego wycofania dla obejścia connect-src CSP.
Dokumentacja trybu Obraz w obrazie
Interfejs Document Picture-in-Picture API to nowy interfejs API, który umożliwia otwieranie okna zawsze widocznego na wierzchu, w którym można wyświetlić dowolne treści HTML. Jest to rozszerzenie dotychczasowego interfejsu Picture-in-Picture API, który umożliwia umieszczanie w oknie PiP tylko elementu HTMLVideoElement. Dzięki temu deweloperzy mogą zapewnić użytkownikom lepsze wrażenia z korzystania z okna PiP.
Zapoznaj się z dokumentacją dotyczącą okna Picture-in-Picture w dokumencie.
Zarejestruj się, aby skorzystać z wersji próbnej funkcji obraz w obrazie w dokumentach.
Wycofanie i usunięcie
W tej wersji Chrome wprowadzamy wycofanie i usunięcie funkcji wymienionych poniżej. Na stronie ChromeStatus.com znajdziesz listy planowanych, bieżących i poprzednich wycofań.
W tej wersji Chrome usunęliśmy 3 funkcje.
Usuń PaymentInstruments
PaymentInstruments to interfejs internetowy, który obsługuje instalację aplikacji płatniczych bez JIT (https://w3c.github.io/payment-handler/). Został on zaprojektowany z założenia, że przeglądarka będzie przechowywać rzeczywiste dane instrumentu płatniczego, co okazało się nieprawdą, i spowodowało wycieki danych. Nie jest ona też dostępna w żadnej innej przeglądarce, a producenci innych przeglądarek nie wykazywali zainteresowania. W związku z tym ten interfejs API został wycofany i usunięty.
Usuń connect-src obejście CSP w interfejsie Web Payment API
Wycofanie możliwości pomijania przez Web Payment API zasad CSP connect-src podczas pobierania pliku manifestu. Po usunięciu tej dyrektywy w zasadach CSP witryny connect-src musisz zezwolić na adres URL formy płatności określony w wywołaniu PaymentRequest, a także na wszystkie inne adresy URL, które metoda łańcucha używa do pobrania pliku manifestu.
Informacje o metodach korzystania z wersji próbnych wycofanych funkcji, które dają więcej czasu na wprowadzenie zmian wymaganych z powodu usunięcia tych funkcji.
Tożsamość sprzedawcy w zdarzeniu canmakepayment
Zdarzenie canmakepayment w workerze usługi informuje sprzedawcę, czy użytkownik ma zarejestrowaną kartę w zainstalowanej aplikacji do płatności. Służyło ono do przekazywania pochodzenia sprzedawcy i dowolnych danych do workera usługi z pochodzeniem aplikacji do płatności. Ta komunikacja między domenami miała miejsce podczas tworzenia obiektu PaymentRequest w JavaScript. Nie wymagała interakcji użytkownika i nie wyświetlała żadnego interfejsu. Ten cichy przesył danych został usunięty ze zdarzenia canmakepayment i z intencji IS_READY_TO_PAY na Androidzie.