-
-
Notifications
You must be signed in to change notification settings - Fork 71
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
2024-06-13のJS: Storybook 8.1、Turborepo 2.0、Node v22.3.0(Snapshot Test…
…ing) (#1200) * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update 696 draft * Update _i18n/ja/_posts/2024/2024-06-13-storybook-8.1-turborepo-2.0-node-v22.3.0snapshot-testing.md * Delete _i18n/ja/_posts/2024/2024-06-13-696draft.md --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
- Loading branch information
1 parent
073e895
commit 2c63da7
Showing
1 changed file
with
210 additions
and
0 deletions.
There are no files selected for viewing
210 changes: 210 additions & 0 deletions
210
...sts/2024/2024-06-13-storybook-8.1-turborepo-2.0-node-v22.3.0snapshot-testing.md
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,210 @@ | ||
| --- | ||
| title: "2024-06-13のJS: Storybook 8.1、Turborepo 2.0、Node v22.3.0(Snapshot Testing)" | ||
| author: "azu" | ||
| layout: post | ||
| date: 2024-06-13T04:55:14.651Z | ||
| category: JSer | ||
| tags: | ||
| - nodejs | ||
| - TypeScript | ||
| - Tools | ||
| - test | ||
| - RegExp | ||
|
|
||
| --- | ||
|
|
||
| JSer.info #696 - Storybook 8.1がリリースされました。 | ||
|
|
||
| - [Storybook 8.1](https://storybook.js.org/blog/storybook-8-1/) | ||
|
|
||
| Storyファイルを作成するUIの追加、Subpath importsを使ったモックの対応、Playwright Component Testの対応しています。 | ||
|
|
||
| `pacakge.json`の`imports`フィールドで特定のモジュールを条件分岐して読み分けるための仕組みである[Subpath imports](https://nodejs.org/api/packages.html#subpath-imports)については、次の記事でも解説されています。 | ||
|
|
||
| - [Type-safe module mocking in Storybook](https://storybook.js.org/blog/type-safe-module-mocking/?ref=storybookblog.ghost.io) | ||
| - [Mocking modules • Storybook docs](https://storybook.js.org/docs/writing-stories/mocking-modules?ref=storybookblog.ghost.io) | ||
|
|
||
| その他には、React 19/Angular 18のサポートなども含まれています。 | ||
|
|
||
| --- | ||
|
|
||
| Turborepo 2.0がリリースされました。 | ||
|
|
||
| - [Turborepo 2.0](https://turbo.build/blog/turbo-2-0) | ||
|
|
||
| Turborepoはmonorepo向けのビルド/タスク管理ツールです。 | ||
| Turborepo 2.0ではターミナルUIの刷新、`persistent`オプションの追加、`turbo watch`の追加、ドキュメントの刷新などが行われています。 | ||
|
|
||
| --- | ||
|
|
||
| Node.js 22.3.0がリリースされました。 | ||
|
|
||
| - [Node.js — Node v22.3.0 (Current)](https://nodejs.org/en/blog/release/v22.3.0) | ||
|
|
||
| `Buffer`に`bytes()`を実装、experimentalフラグ付きでTest RunnerでのSnapshot Testingが実装されています。 | ||
|
|
||
| - https://nodejs.org/api/test.html#snapshot-testing | ||
| - [test_runner: add snapshot testing by cjihrig · Pull Request #53169 · nodejs/node](https://github.com/nodejs/node/pull/53169) | ||
|
|
||
| ---- | ||
|
|
||
| {% include inline-support.html %} | ||
|
|
||
| ---- | ||
|
|
||
| <h1 class="site-genre">ヘッドライン</h1> | ||
|
|
||
| ---- | ||
|
|
||
| ## Announcing TypeScript 5.5 RC - TypeScript | ||
| [devblogs.microsoft.com/typescript/announcing-typescript-5-5-rc/](https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-rc/ "Announcing TypeScript 5.5 RC - TypeScript") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">TypeScript</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| TypeScript 5.5 RCリリース。 | ||
| 関数からtype predicatesを推論できるようになり、`Array.prototype.filter`などでの絞り込みが簡潔に書けるように。 | ||
| Stage 3のSet Methodsをサポート。 | ||
| JSDocで`@import {foo} from "foo"`をサポート、正規表現の基本的な構文チェックをサポート、`isolatedDeclarations`をサポート。 | ||
| 設定ファイル内で`${configDir}`のテンプレート値をサポート。 | ||
| `typescript`パッケージのサイズを削減、Named Importをサポート、`transpileDeclaration` APIの追加。 | ||
| `transpileModule`と`transpileDeclaration`でのビルド時間を改善。 | ||
| `out`や`target: ES3`などの非推奨となっていたオプションが無効化され、`ignoreDeprecations`オプションを指定しないと利用できなくなる変更など | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Release CLI v1.8.0 · biomejs/biome | ||
| [github.com/biomejs/biome/releases/tag/cli%2Fv1.8.0](https://github.com/biomejs/biome/releases/tag/cli%2Fv1.8.0 "Release CLI v1.8.0 · biomejs/biome") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">Tools</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Biome v1.8.0リリース。 | ||
| `biome clean`コマンドを追加、`biome lint`に`--only`と`--skip`フラグを追加、CSSのformatとlintをサポートなど | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## power-assert-monorepo/packages/node at main · twada/power-assert-monorepo | ||
| [github.com/twada/power-assert-monorepo/tree/main/packages/node](https://github.com/twada/power-assert-monorepo/tree/main/packages/node "power-assert-monorepo/packages/node at main · twada/power-assert-monorepo") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">test</span> <span class="jser-tag">library</span></p> | ||
|
|
||
| Node.jsの`--import`に対応したpower-assert | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Storybook 8.1 | ||
| [storybook.js.org/blog/storybook-8-1/](https://storybook.js.org/blog/storybook-8-1/ "Storybook 8.1") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">UI</span> <span class="jser-tag">test</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Storybook 8.1リリース。 | ||
| Storyファイルを作成するUIの追加、Subpath importsを使ったモックの対応、Playwright Component Testの対応。 | ||
| React 19/Angular 18のサポートなど | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Release v1.0.0 · tinylibs/tinypool | ||
| [github.com/tinylibs/tinypool/releases/tag/v1.0.0](https://github.com/tinylibs/tinypool/releases/tag/v1.0.0 "Release v1.0.0 · tinylibs/tinypool") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| tinypool 1.0.0リリース。 | ||
| Node.jsの`worker_threads`のWorker Poolの実装ライブラリ | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Turborepo 2.0 | ||
| [turbo.build/blog/turbo-2-0](https://turbo.build/blog/turbo-2-0 "Turborepo 2.0") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">monorepo</span> <span class="jser-tag">Tools</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Turborepo 2.0リリース。 | ||
| ターミナルUIの刷新、`persistent`オプションの追加、`turbo watch`の追加、ドキュメントの刷新など。 | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Firefox 127.0, See All New Features, Updates and Fixes | ||
| [www.mozilla.org/en-US/firefox/127.0/releasenotes/](https://www.mozilla.org/en-US/firefox/127.0/releasenotes/ "Firefox 127.0, See All New Features, Updates and Fixes") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">Firefox</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Firefox 127リリース。 | ||
| `<base>`要素に`data:`と`javascript:`が指定できないように変更、Stage 3のSet Methodsをサポート、async Clipboard APIのサポートなど | ||
|
|
||
| - [Firefox 127 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/127 "Firefox 127 for developers - Mozilla | MDN") | ||
|
|
||
| ---- | ||
|
|
||
| ## Node.js — Node v22.3.0 (Current) | ||
| [nodejs.org/en/blog/release/v22.3.0](https://nodejs.org/en/blog/release/v22.3.0 "Node.js — Node v22.3.0 (Current)") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Node.js v22.3.0リリース。 | ||
| `Buffer`に`bytes()`を実装、experimentalフラグ付きでTest RunnerでのSnapshot Testingを実装、`NODE_RUN_SCRIPT_NAME`を追加など | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## News from WWDC24: WebKit in Safari 18 beta | WebKit | ||
| [webkit.org/blog/15443/news-from-wwdc24-webkit-in-safari-18-beta/](https://webkit.org/blog/15443/news-from-wwdc24-webkit-in-safari-18-beta/ "News from WWDC24: WebKit in Safari 18 beta | WebKit") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">webkit</span> <span class="jser-tag">safari</span> <span class="jser-tag">ReleaseNote</span></p> | ||
|
|
||
| Safari 18 bettaの変更点について。 | ||
| View Transition APIのサポート、Style Queriesのサポート、`@starting-style`と `display: none`の組み合わせをサポート。 | ||
| `justify-content: safe center`のサポート、`content-visibility`をサポート。 | ||
| `<input type=date>`のアクセシビリティの改善、`URL.parse()`のサポート、JPEG2000のサポートを削除など | ||
|
|
||
|
|
||
| ---- | ||
| <h1 class="site-genre">アーティクル</h1> | ||
|
|
||
| ---- | ||
|
|
||
| ## Data Fetching Patterns in Single-Page Applications | ||
| [martinfowler.com/articles/data-fetch-spa.html](https://martinfowler.com/articles/data-fetch-spa.html "Data Fetching Patterns in Single-Page Applications") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">article</span></p> | ||
|
|
||
| ReactのクライアントサイドでのData Fetchのパターンについて | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## Mastering Node.js Performance Hooks | ||
| [pavel-romanov.com/nodejs-performance-hooks-mastering-the-mental-model](https://pavel-romanov.com/nodejs-performance-hooks-mastering-the-mental-model "Mastering Node.js Performance Hooks") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">performance</span> <span class="jser-tag">article</span></p> | ||
|
|
||
| ユーザーの端末の影響を受けるwall clockとパフォーマンスの計測に適したmonotonic clockについて。 | ||
| Node.jsの`perf_hooks`モジュールで利用できる`PerformanceObserver`では monotonic clockの時間を取得でき、基本的な使い方についてなど | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## WebAssembly JSPI has a new API · V8 | ||
| [v8.dev/blog/jspi-newapi](https://v8.dev/blog/jspi-newapi "WebAssembly JSPI has a new API · V8") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">WebAssembly</span> <span class="jser-tag">Promises</span> <span class="jser-tag">article</span></p> | ||
|
|
||
| WebAssemblyのJavaScript Promise Integrationについて | ||
|
|
||
|
|
||
| ---- | ||
|
|
||
| ## TypeScriptの型と値とバリデーション | ||
| [zenn.dev/mizchi/articles/typescript-type-value-validation](https://zenn.dev/mizchi/articles/typescript-type-value-validation "TypeScriptの型と値とバリデーション") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">TypeScript</span> <span class="jser-tag">article</span></p> | ||
|
|
||
| TypeScriptは基本的にはJavaScriptへ型情報を付与するだけであるため、Runtimeの動作としてはJavaScriptと変わらないという話。 | ||
| バリデーションと型について | ||
|
|
||
| - [TypeScript Design Goals · microsoft/TypeScript Wiki](https://github.com/microsoft/TypeScript/wiki/TypeScript-Design-Goals "TypeScript Design Goals · microsoft/TypeScript Wiki") | ||
|
|
||
| ---- | ||
| <h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1> | ||
|
|
||
| ---- | ||
|
|
||
| ## slevithan/regex: Context-aware regex template tag with best practices built-in and advanced features | ||
| [github.com/slevithan/regex](https://github.com/slevithan/regex "slevithan/regex: Context-aware regex template tag with best practices built-in and advanced features") | ||
| <p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">RegExp</span> <span class="jser-tag">library</span></p> | ||
|
|
||
| 正規表現をTagged Templateで書けるライブラリ | ||
|
|
||
|
|
||
| ---- |