Fork me on GitHub

2022-05-03のJS: Node.js 12はEOLとなりサポート終了、pnpm v7.0.0、Mocha v10.0.0、Cypress 9.6.0

Edit on GitHub 編集履歴を見る

JSer.info #590 - pnpm 7.0.0がリリースされました。

コマンドラインフラグの変更やデフォルト値の変更などの破壊的な変更が中心となっています。

Node.js 12のサポート終了、root packageはpnpm -r execなどの対象からデフォルトで除外するように変更。--filterがglobをサポート、@types/*を自動的にhoistしないようになるといった変更が含まれています。

その他には、strict-peer-dependenciesがデフォルトで有効となる変更も含まれています。


Mocha 10.0.0がリリースされました。

こちらもサポート終了した機能を削除するといった破壊的な変更が中心となっています。

Node.js 12のサポート終了、IE11のサポート終了、AMD/RequireJSのサポート終了、Growlサポートの終了、bin/mochabin/mocha.jsにリネームするといった変更が含まれます。

pnpmとMochaどちらもNode.js 12のサポートを終了していますが、これはNode.js 12が2022-04-30でEOL(End of Life)となり公式のサポートがなくなったためです。


Cypress 9.6.0がリリースされました。

Cypressはブラウザ内でテストを実行するため、ログイン画面が別ドメインである場合などのマルチドメインに関わるテストはSame Origin Policyで上手く行かないケースがありました。
これを解決するためにcy.origin APIがフラグ付きで実装されています。

詳しい仕組みや制限については記事や動画で解説されています。


JSer.infoをサポートするには

JSer.info Sponsors

JSer.info SponsorsGitHub SponsorsとしてJSer.infoを支援してくれている方々です。


ヘッドライン


Release 4.18.0 · expressjs/express

github.com/expressjs/express/releases/tag/4.18.0

node.js express library ReleaseNote

express 4.18.0リリース。
res.downloadrootオプションの追加、cookieにpriorityオプションの追加。
また、res.statusにNumber以外を渡すケースををDeprecatedに変更など


Chromium Blog: Chrome 102: Window Controls Overlay, a Host of Finished Origin Trials, PWAs as File Handlers and More

blog.chromium.org/2022/04/chrome-102-window-controls-overlay-host.html

Chrome ReleaseNote

Chrome 102 betaリリース。
Window Controls Overlay、inert属性、Navigation API、hidden=until-foundのサポート。
Origin Private File System extension(OPFS)のAccessHandle APIのサポート。
WebHIDにexclusionFiltersオプションの追加、Private IPへのサブリソースリクエスト時にPreflightの発生と警告が出るように、WebRTCのSDP Plan Bを削除。


Remotion 3.0 | Remotion

www.remotion.dev/blog/3-0

React library ReleaseNote

Reactで動画を作成するRemotion 3.0リリース。
エンコーディングのパフォーマンス改善、動画をレンダリングできるrenderMedia API、エラー表示の改善、React 18のサポートなど


Release 18.1.0 (April 26, 2022) · facebook/react

github.com/facebook/react/releases/tag/v18.1.0

React ReleaseNote

React v18.1.0リリース。
バグ修正が主な変更。
use-subscriptionのshimの実装がuse-sync-external-storeをラップしただけの実装へと変更された。


Release v7.0.0 · pnpm/pnpm

github.com/pnpm/pnpm/releases/tag/v7.0.0

pnpm ReleaseNote

pnpm v7.0.0リリース。
Node.js 12のサポート終了、root packageはpnpm -r execなどの対象からデフォルトで除外するように変更。--filterがglobをサポート、@types/*を自動的にhoistしないようになるなど。


Release v3.0.0 · capricorn86/happy-dom

github.com/capricorn86/happy-dom/releases/tag/v3.0.0

DOM library ReleaseNote

Happy DOM 3.0.0リリース。
TargetをES5からES2022に変更、WindowをVM contextとなるように変更など


Release v8.8.0 · npm/cli

github.com/npm/cli/releases/tag/v8.8.0

npm ReleaseNote

npm v8.8.0リリース。
file:で指定されたプロジェクト外への依存をsymlinkではなくコピーでインストールできる--install-linksフラグが追加された。


Cypress 9.6.0: Easily test multi-domain workflows with cy.origin

cypress.io/blog/2022/04/25/cypress-9-6-0-easily-test-multi-domain-workflows-with-cy-origin/

browser testing library ReleaseNote

Cypress 9.6.0リリース。
Cypressはブラウザ内でテストを実行するためマルチドメインに関わるテストはSame Origin Policyで上手く行かないケースがあった。
これを解決するためにcy.origin APIがフラグ付きで実装された。


Release v10.0.0 · mochajs/mocha

github.com/mochajs/mocha/releases/tag/v10.0.0

JavaScript testing library ReleaseNote

Mocha v10.0.0リリース。
Node.js 12のサポート終了、IE11のサポート終了、AMD/RequireJSのサポート終了、Growlサポートの終了、bin/mochabin/mocha.jsにリネームなど


アーティクル


Non-interactive Elements with the inert attribute | WebKit

webkit.org/blog/12578/non-interactive-elements-with-the-inert-attribute/

browser HTML article

inert属性についての解説記事。
今まではfocusはtabindex、クリックはpointer-events、選択範囲はuser-selectaria-hiddenなどの各種対応が必要だったが、まとめて不活性として設定できる属性。


“Tao of Node - Design, Architecture & Best Practices” 日本語翻訳

jqk.life/tao-of-node-japanese

node.js article translate

https://alexkondov.com/tao-of-node/ の翻訳


Node.js 18 Introduces Prefix-Only Core Modules

fusebit.io/blog/node-18-prefix-only-modules/

node.js article

node:testのようにnode prefixを付けたコアモジュールを扱う理由についての解説記事。
新しい名前を追加するときの対応コスト、Typosquattingのような攻撃を回避するため。


サイト、サービス、ドキュメント


The State of Frontend 2022

tsh.io/state-of-frontend/

Survey web JavaScript CSS document

The Software Houseによるフロントエンドに関するアンケート結果。
フレームワーク、ライブラリ、TypeScript、SSG、ホスティング、Microfrontend、テスト、アクセシビリティ、パフォーマンス、SEOなどの各項目についてのアンケート結果が公開されている


ソフトウェア、ツール、ライブラリ関係


shuding/tilg: A magical React Hook that helps you debug components.

github.com/shuding/tilg

React debug library

React ComponnetのレンダリングやライフサイクルをデバッグできるHooksライブラリ。
コンポーネントのPropsやStateの変化をログに出し、なぜ再レンダリングされたかをみれるライブラリ


tdewolff/minify: Go minifiers for web formats

github.com/tdewolff/minify

HTML JavaScript JSON SVG golang Tools

Go言語で実装されたHTML/JSON/JS/SVG/XMLのminifyツール。
PythonとNode.js向けのバインディングが用意されている


frouriojs/notios

github.com/frouriojs/notios

npm Tools debug

npm run-scriptsをインタラクティブに複数実行、その実行状況やログを確認できるCUIを提供するツール。
npm-run-allのラッパーであるため、npm-run-allと同様のコマンドも提供している。


この記事へ修正リクエストをする
JSer.info Slackに参加する