544 文字
3 分

Frontend Weekly 2023-12-15

Safari 17.2#

2023 年 12 月 11 日に Safari 17.2 がリリースされました。

https://developer.apple.com/documentation/safari-release-notes/safari-17_2-release-notes

https://www.webkit.org/blog/14787/webkit-features-in-safari-17-2/

Safari 17.2 では多くの機能追加と、Interop 2023 による多くの修正や機能改善が含まれいています。Interop は、Google、Microsoft、Mozilla、Apple などによって全てのブラウザで全く同じように Web の機能を動作させるためのプロジェクトです。

Exclusive accordions#

Chrome 120 に続いて、details 要素の name 属性がサポートされました。同じ name 属性で複数の details 要素を紐づけることで、どれか 1 つだけを開ける UI を実装できます。

<details name="cookies">
<summary>Chocolate chip</summary>
Yum yum chocolate chip.
</details>
<details name="cookies">
<summary>Snickerdoodle</summary>
Yum yum snickerdoodle.
</details>
<details name="cookies">
<summary>Maicenitas</summary>
Yum yum maicenitas.
</details>
<details name="cookies">
<summary>Sugar cookies</summary>
Yum yum sugar cookies.
</details>

https://stackblitz.com/edit/js-bjwzi1?file=index.html

One time code#

SMS などで受信したワンタイムコードをサジェストしてくれる autocomplete 属性の one-time-code がサポートされました。

<label for="onetimecode">Enter code:</label>
<input
name="onetimecode"
id="onetimecode"
type="text"
autocomplete="one-time-code"
/>

緩和された CSS ネスト#

Chrome 120 に続いて、&is() を使用しなくても CSS をネストした状態で記述できるようになりました。

article {
h1 {
font-size: 1.8rem;
}
p {
font-size: 1.2rem;
}
}

Custom Highlight API#

Custom Highlight API がサポートされました。Custom Highlight API を利用すると、ドキュメント上にある任意の文字列にスタイルを適用することが出来ます。ほとんどの環境で利用できるようになりました。

https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API

Import attributes#

Chrome に続いて、Import 属性がサポートされました。これは、モジュールの import 文に型情報を追加する方法を提供します。

import json from "./foobar.json" with { type: "json" };
import("foobar.json", { with: { type: "json" } });

Login cookies#

ウェブサイトを PWA などでウェブアプリとして追加した場合に、クッキーがコピーされるようになりました。これにより追加後に再度ログインをする必要がなくなりました。

Deno 1.39#

2023 年 12 月 14 日に Deno 1.39 がリリースされました。

https://deno.com/blog/v1.39

次のような変更がありました。

  • WebGPU API の再導入
  • HTML 形式のカバレッジレポートを表示 deno coverage --html
  • Jest の expect と互換があるstd/expectが追加
  • コマンドライン引数をパースするstd/cliの追加

SvelteKit 2#

2023 年 12 月 14 日に SvelteKit 2 がリリースされました。

https://svelte.dev/blog/sveltekit-2

Frontend Weekly 2023-12-15
https://blog.ohirunewani.com/series/frontend-weekly/2023-12-15/
作者
hrdtbs
公開日
2023-12-15
ライセンス
CC BY-NC-SA 4.0