Fork me on GitHub

2023-03-08: Jest 29.5.0, Chrome 111, testing-library으로 이행

Translator: rewrite0w0(Oh TaeJun) Edit on GitHub See Revisions

JSer.info #634 - Jest 29.5.0가 출시되었습니다.

Jet 29.5.0에는, jest-circus를 기본 테스트런너로 변경했습니다.

randomize 옵션으로 테스트를 랜덤한 순서로 실행할 수 있도록 되었습니다.
이 순서는 seed 옵션으로 고정할 수 있기에, 테스트 실패를 재현할 수 있습니다.

그 외에는 workerThreads 옵션 추가, 에러 출력 포맷터가 Error Cause 지원 등도 있습니다.


Chrome 111가 출시되었습니다.

CSS에는, CSS Color Level 4 지원, :nth-child():nth-last-child() 추상 클래스셀렉스 지원, Style Container Queries 지원이 추가되었습니다.
Web API에는, Streaming declarative shadow DOM, View Transitions API 지원이 추가되었습니다.
View Transitions API는 같은 요소를 화면에 걸쳐서 애니메이션 동작 시키는 API입니다.

또한, Origin Trial로 Document Picture-in-Picture 지원이 추가되었습니다.


Sentry’s Frontend Tests: Migrating from Enzyme to React Testing Library | Product Blog • Sentry에서는 React의 테스트를 Enzyme에서 React Testing Library로 이행하는 이야기를 다룹니다.

Enzyme는, React 18를 지원하고 있지 않기에, React Testing Library로 어떻게 이행하는가 다루고 있습니다.
글에는 언급되어 있지 않지만, (React) Testing Library는, WAI-ARIA 롤 등을 사용한 요소를 선택할 수 있는 기능이 있기에, 테스트 코드를 작성함으로 접근성에 대해 생각할 수 있습니다.

  1. Missing ARIA roles on elements forced us to think harder about accessibility

testing-library로 유저 입장에서 적는 프론트엔드 테스트에서는 Testing Library의 getByRole* API를 사용한 테스트를 적는 방법이 다뤄져있습니다.

같이 읽어보면 좋을 것 같습니다.


To support JSer.info


헤드라인


Release 7.2.0 · google/zx

github.com/google/zx/releases/tag/7.2.0

JavaScript library ReleaseNote

zx 7.2.0 출시.
retry()spinner() 헬퍼 추가 등


Buf | Connect for Node.js is now available

buf.build/blog/connect-node-beta

node.js ProtocolBuffers library ReleaseNote

gRPC/Protocol Buffers를 다루는 Connect for Node.js가 출시되었습니다.


moon v0.25 - Deno tier 2 support, CI insights, custom project languages, and more | moonrepo

moonrepo.dev/blog/v0.25

monorepo Tools ReleaseNote

moon v0.25 출시.
Deno 지원, 오프라인 모드 지원, 프로젝트 레벨에서 TypeScript 설정을 덮어쓸 수 있도록 GitHub Actions 추가 등


Announcing TypeScript 5.0 RC - TypeScript

devblogs.microsoft.com/typescript/announcing-typescript-5-0-rc/

TypeScript ReleaseNote

TypeScript 5.0 RC 출시.
ECMAScript Stage 3의 Decorator 구현, const type perameter 추가, tsconfig.json으로 여러 extends에 대응, enum과 union 자료형 개선.
--moduleResolution bundler 추가와 관련한 옵션 추가, exports필드의 Condition를 지정할 수 있는 --customConditions 추가.
import할 때 type 식별자를 삭제하고 그 외를 남기는 --verbatimModuleSyntax 옵션 추가, JSDoc에서 @satisfies 지원 등.
또한, TypeScript 코드베이스를 namespace에서 moudle으로 이행, 퍼포먼스/메모리/패키지 크기 개선.
--target ES3이나 --out등 옵션 비권장으로 변경, --forceConsistentCasingInFileNames를 기본값으로 true로 변경 등이 포함


Release v111 · ije/esm.sh

github.com/ije/esm.sh/releases/tag/v111

JavaScript cdn module

esm.sh v111 출시.
deprecated메세지 대응, 버전 지정없이 리퀘스트 할 때 TTL를 10분으로 변경 등


Release v29.5.0 · facebook/jest

github.com/facebook/jest/releases/tag/v29.5.0

JavaScript testing ReleaseNote

Jest v29.5.0 출시.
randomize옵션으로 테스트를 랜덤한 순서로 실행할 수 있음, workerThreads 옵션 추가, 에러 출력 포맷터가 Error Cause 지원 등


Release v2.1.0 · vercel/swr

github.com/vercel/swr/releases/tag/v2.1.0

JavaScript React library ReleaseNote

SWR v2.1.0 출시.
리얼 타임 데이터 소스를 Subscribe하는 useSWRSubscription 추가, useSWRInfiniteparallel 옵션 추가 등


Node v18.15.0 (LTS) | Node.js

nodejs.org/ja/blog/release/v18.15.0/

node.js ReleaseNote

Node.js v18.15.0 출시.
--test-coverge 추가, fs.statfs 추가, 프로세스에서 사용가능한 메모리량 정보를 얻는 process.constrainedMemory() 추가, buffer.isAscii 추가


New in Chrome 111 - Chrome Developers

developer.chrome.com/blog/new-in-chrome-111/

Chrome ReleaseNote

Chrome 111 출시.

CSS Color Level 4 지원, :nth-child():nth-last-child() 유사 클래스 셀렉터 지원, Style Container Queries 지원.
Streaming declarative shadow DOM, View Transitions API 지원.
Origin Trial로 Document Picture-in-Picture 지원.
Web Payment API 관련 비권장 API 삭제 등


읽을거리


You Don't Need Rails to Start Using Hotwire

www.akshaykhot.com/using-hotwire-without-rails/

JavaScript rails library article

Rails를 사용하지 않고도 Hotwire는 사용하는 방법에 대한 글.
Hotwire 기본 사용 방법.


Sentry’s Frontend Tests: Migrating from Enzyme to React Testing Library | Product Blog • Sentry

blog.sentry.io/2023/02/23/sentrys-frontend-tests-migrating-from-enzyme-to-react-testing-library/

React JavaScript testing article

React 테스트 라이브러리 중 하나인 Enzyme는 React 18 지원 예정이 없어 React Testing Library으로 이행한다는 글.
React Testing Library로 이행할 때 발견한 문제나 어떤 식으로 이행했는가를 다룬다


blog.bokken.io/articles/2023-02-28/about-clear-site-data.html

browser article

Clear-Site-Data HTTP 응답 헤더에 대하여


Experiments with the JavaScript Garbage Collector - DEV Community

dev.to/codux/experiments-with-the-javascript-garbage-collector-2ae3

JavaScript article

WeakRefs 일부인 FinalizationRegistry에 등록한 객체는 언제 Garbage Collector가 회수되는가.


testing-library 로 유저 입장에서 적는 프론트엔드 테스트

zenn.dev/tnyo43/articles/39e4caa321d0aa

JavaScript testing DOM accessibility article

testing-library를 사용해 테스트코드와 유저 조작을 조합하는 형식으로 요소 선택해서 구현하는 방법


웹사이트, 서비스, 문서


Sandworm: Keep Your JavaScript Code Secure and Compliant

sandworm.dev/

npm webservice

npm 패키지 Audit, 라이센스 정보, 의존관계 트리 게시 등을 보여주는 서비스


소프트웨어, 도구, 라이브러리


Node.js Toolbox

nodejstoolbox.com/

node.js library search

Node.js 라이브러리를 카테고리화해서 비교하는 사이트


kaleidawave/ezno: A JavaScript compiler and TypeScript checker written in Rust with a focus on static analysis and runtime performance

github.com/kaleidawave/ezno

TypeScript Rust

Rust으로 작성된 TypeScript 컴파일러, 자료형 체커.


Pull Request to this article
JSer.info Slackに参加する