Перейти до основного змісту

Jest 25: 🚀 Вибудовуємо основу майбутнього

· 7 хвилин читання
Simen Bekkhus
Simen Bekkhus

Jest 25 закладає основу для багатьох великих змін у майбутньому. Для цього, ми мінімізували критичні зміни, але зміни внутрішньої архітектури вимагають уваги під час оновлення. Основними змінами є оновлення JSDOM з версії 11 до 15, пришвидшення тестів на 10-15%, новий вигляд різниці для застарілих знімків і припинення підтримки Node 6.

There has been more than 200 commits since Jest 24.9 by more than 80 different contributors, so as always, take a look at the changelog for a full list of changes.

Бувай, Node 6

Node 6 завершив існування 30 квітня 2019, тож Jest 25 залишає його позаду. Видалення Node 6 означає, що ми можемо оновити залежності, найголовніше - JSDOM, що було оновлено до версії 15. Upgrading also means we no longer have to transpile async-await syntax, which results in both faster code execution and less memory consumption. Додатково, перекладений код Jest повинен бути простішим в налагоджені, якщо комусь доведеться в тому розбиратись.

Навіть якщо Node 8 також став EOL, Jest 25 підтримуватиме його, щоб зробити оновлення якомога простішим для тих з нас, хто досі підтримує Node 8. It does come with some tradeoffs though, such as JSDOM v16 having been released without Node 8 support, so you'll need to use jest-environment-jsdom-sixteen if you want to use the latest version.

Покращення продуктивності

За останні декілька релізів, ми отримали повідомлення про вповільнення Jest. Jest 25 містить оновлений Micromatch, яке дає величезну перевагу під час запуску, та деякі виправлення помилок і налаштування продуктивності, які повертають Jest швидкість версії 23. Як було зазначено на початку цього допису, для Jest це означає 10-15% зменшення часу виконання тестів. Ми завжди прагнемо вдосконалити цей момент, тож, будь ласка, перевірте, як він порівнюється з більш ранніми версіями та створіть проблеми, якщо ми маємо щось покращити!

Покриття коду V8

Jest’s current code coverage instrumentation is powered by babel-plugin-istanbul inserting code coverage collection code before creating reports. Однак це доволі повільний процес, що використовує багато пам'яті, особливо для великих файлів та баз коду. Luckily, V8 has built-in code coverage, which is becoming more and more usable in Node thanks to the hard work of Benjamin Coe and others on the V8 and Node.js teams. Jest 25 comes with experimental support for this via a new --coverage-provider flag. Please see its documentation for caveats and how to use it.

Думаємо швидко та повільно щодо провальних тестів

Зайві зусилля для розуміння звітів провальних тестів заважають:

  • “думати швидко”, розпізнаючи шаблони вашого минулого досвіду
  • “думати повільно”, аналізуючи зміни та вирішуючи, чи є вони очікуваним прогресом або несподіваним регресом

Jest 25 завершує другу половину процесу, розпочатого в Jest 24, щодо покращення усіх матчерів:

  • correct description line, including .rejects, .resolves, and .not modifiers
  • лаконічні мітки та послідовність щодо очікуваних та отриманих значень
  • інвертоване підсвічування підрядків розбіжностей, коли очікуються та отримуються рядки
  • кількість рядків змін, для розуміння типу зміни (лише видалення/додавання)

Special thanks to Jest maintainer Mark Pedrotti for driving this effort and his continued work towards making expectation errors as good as they can be.

Кольори відмінностей при провалі тестування знімками

Найбільш очевидною зміною для боротьби з плутаниною стали кольори рядків відмінностей у випадках, коли тести знімків провалюються:

  • - Snapshot changes from green to magenta
  • + Received changes from red to teal foreground on cyan/aqua background

Приклади звітів тестів знімками (до ліворуч, після праворуч)

  1. Кількість змінених ліній підтверджує ваше перше враження щодо зміни знімків (тобто видалених або вставлених рядків)

snapshot-insert-lines

  1. Колір фону спрощує візуальне порівняння змінених рядків

snapshot-change-lines

  1. Background colors also help you see which toThrow tests require a decision whether or not to update the snapshot

snapshot-change-substrings

Наведемо кілька причин, чому ми обрали унікальні кольори:

  • 95% людей, які повноцінно бачать кольори, можуть швидко визначити, які звіти стосуються тестів зі знімками, а не інших матчерів.
  • Це вирішує прямий конфлікт між значенням зеленого/червоного кольорів у тестах Jest, порівнюючи з перевіркою коду.
  • На відміну від червоного/зеленого кольорів, через які можна припустити, що оновлення є рішенням за замовчуванням, нинішня візуалізація показує, що відмінності вимагають більш ретельного розгляду на предмет можливої регресії в локальних помилках тестування знімками, а не перевірці коду (коли проблеми вже виправлені).

Різниця у тональності від пурпуру 300° до відтінків блакитного 180° дає кращу видимість кольорів, а світлий відтінок фону для змінених ліній забезпечує постійний контраст у світлих і темних темах.

If you maintain a command line tool, you might find inspiration to improve its accessibility in #9132.

Підтримка модулів ECMAScript

Node 13 прибрав позначку підтримки ESM, тож ми почали потроху працювати над вбудованою підтримкою в Jest. Jest 25 includes support for jest.config.cjs and jest.config.mjs configuration files, but tests themselves cannot yet be written using ESM without something like Babel or TypeScript transforming it into CJS.

API, які використовуватиме Jest, все ще позначені як експериментальні, тому наразі не очікуйте підтримки. These APIs are something the Node.js Modules team is actively working on, and we'll be keeping an eye on it moving forward and experiment with them so we can provide feedback. You can subscribe to this issue to get any updates about the implementation status in Jest.

Інші вдосконалення та оновлення

  • Jest has passed 1000 unique contributors. Це неймовірне досягнення! Дякуємо всім, хто допомагає нам робити тестування якомога приємнішим.
  • Thanks to community member Josh Rosenstein, Jest now comes with support for BigInt in most matchers, such as toBeGreaterThan. Jest також приймає bigint літерали з коробки.
  • Jest’s feature --detect-leaks has been broken for Node 12 and newer - this has been fixed in Jest 25.
  • Як було оголошено в дописі блогу про Jest 24, базу коду Jest було переписано на TypeScript. Ця робота була завершена в Jest 24.3. Якщо ви використовуєте будь-яку з окремих частин Jest, ви маєте отримати відмінну інтеграцію IDE. Надалі ми дійсно хочемо покращити взаємодію Jest імітацій з системами типів; допомога спільноти в цьому не завадить. Please chime in here with ideas and send PRs! Також ми будемо досліджувати переміщення типів для використання виконавця тестів Jest з DefinitelyTyped в самий Jest.
  • The jest-diff package now exports functions like diffLinesUnified and diffStringsUnified which have configuration options, so other applications can format differences in a custom way. For more information and code examples, see its new README.md file in the Jest repository or on package repositories.
  • Thanks to community member Wei An Yen, Jest will no longer highlight passing asymmetric matchers in expectation errors. Це була давня проблема асиметричних матчерів і ми дуже раді, що вона нарешті вирішилась.
  • For the second year running, Jest won the Highest Satisfaction award from State of JS. Ми неймовірно вдячні за підтримку спільноти та сподіваємося, що зможемо продовжити такий рівень активності та покращитись за 2020 рік!

Плани на майбутнє

  • Jest’s configuration is vast and somewhat clunky - there is often at least two ways of doing the same thing, oftentimes even more. В Jest 26 ми сподіваємось зменшити конфігурацію та зробити її більш передбачуваною. See this issue for details.
  • We also hope to be able to provide a proper programmatic API for running Jest, to make integration into IDEs and other tooling easier. Please see this tracking issue.
  • There’s been an open PR for adding Lolex as an implementation of Jest’s fake timers since December 2017. While we’re not adding it to any public APIs in Jest 25, support for it is technically included and you we're looking into how to expose this so people can test and experiment with it. Using it means you can mock out Date and other timer function Jest currently doesn’t touch. Зверніть увагу, що це слід вважати експериментальним, і відповідна підтримка API буде в більш пізньому релізі. Follow this PR for the latest updates on the status.

Happy Jesting! 🃏