Chrome 147 - ohiruneuni/blog

Chrome 147 がリリースされた。要素スコープの View Transitions、CSS の contrast-color()、Math.sumPrecise が追加され、ローカルネットワークアクセス制限の拡張と Device Memory API の取りうる値の更新が含まれる。

任意の HTML 要素に対して element.startViewTransition() が使えるようになった。遷移の疑似要素は祖先のクリップと変形の影響を受け、複数の要素に対して並行してトランジションを走らせられる。

javascript

document.querySelector("#card").startViewTransition(() => {
  document.querySelector("#card").classList.toggle("expanded");
});

contrast-color() は引数の色に対してコントラストが最大になるよう black または white を返す関数である。アクセシビリティ上のコントラスト要件を満たす配色を、短い式で書ける。

css

.button {
  background: var(--brand);
  color: contrast-color(var(--brand));
}

イテラブルを受け取り、単純加算より精度の高いアルゴリズムで合計を返す Math.sumPrecise が追加された。

javascript

const xs = [0.1, 0.2, 0.3];
console.log(Math.sumPrecise(xs));