2020/05/24 15:10

Chrome 83

カテゴリ:: Chrome

コメント数:: Comments: 1

タグ：: #Chrome; #アップデート

◆ input のデザインが変わった

Chrome 83 が出ましたね
以前から言われてたように 82 はスキップされました

input のデザイン

一番の変更は input です
以前の記事 (1) (2) でも書いたように Chrome は青色でした

個人的には Edge の黒色のほうが好きなんですけど

変に色がついてると背景色の都合で以前より見づらくなった部分もあります
特に checkbox でチェック中に全体に色がついたり range の左側に色がついたりは影響大きいです
例えば 2 つの range を重ねて範囲を選択する multirange というライブラリを使ってると修正は必須なほどです

左側にも色がついてるので色では見分けがつきにくくなっています
◯があるので場所はわかりますがこの色は見づらいです
一応色も違っているのですがディスプレイによっては見分けがつきにくいです

あとフォーカス中の outline の濃い黒色はまだ慣れません

悪い部分だけではなく時刻や色選択など良くなった部分もあります

input.rawValue

これはまだフラグ必要ですが input に rawValue プロパティが増えたみたいです
type="number" などでは不正な入力だと value は空文字列になっています
これが不便で実際に画面に出ているものが欲しい場合は type="text" にせざるを得ませんでした
rawValue では実際画面で見えているものが取得できるので役立ちそうです
早くフラグなしで使えるようになってほしいですね

replace 中の CSS インポートの廃止

前にも書いたものですが CSSStyleSheet.replace の中での @import が deprecated になりました
82 からになっていましたが 82 がないので 83 からでした
使えなくなるのが 84 なのでもうすぐです
早いですね

const cssss = new CSSStyleSheet()
cssss.replace(`@import url("a.css");`)

これを実行すると

[Deprecation] Support for calls to CSSStyleSheet.replace() with stylesheet text that includes @import has been deprecated, and will be removed in M84, around June 2020. See https://chromestatus.com/feature/4735925877735424 for more details.

という警告が出ます