Я пытаюсь создать собственное преобразование для Jest, но наталкиваюсь на контрольно-пропускной пункт документации, из-за которого я спрашиваю себя, нахожусь ли я даже на правильном пути.
Проблема
У меня есть проект Rails, который обслуживает приложение Vue JS. Я хочу написать Jest тесты для приложения JS. Чтобы передать переменные конфигурации из Rails в приложение, я использую ERB для шаблонирования небольшого количества .js
файлов. Например:
// in server-routes.js.erb
export default {
reports: '<%= Rails.application.config.relative_url_root %><%= Rails.application.routes.url_helpers.reports_path %>',
...
В моей сборке Webpack для приложения Vue я использую rails-erb-loader
для предварительной обработки файлов *.erb
до того, как они будут переданы остальной части процесса сборки.
Однако, когда я запускаю свои JS-тесты, Jest ничего не знает о загрузчиках ERB (достаточно разумно). Поэтому моя цель - добавить пользовательское преобразование для Jest для преобразования файлов ERB при запуске npm test
.
подход
Я думал, что смогу использовать rails-erb-loader
в качестве Jest-преобразования:
// package.json
"jest": {
"moduleFileExtensions": [
"js",
"json",
"vue"
],
"moduleDirectories": [
"<rootDir>/node_modules"
],
"transform": {
".*\\.(vue)$": "vue-jest",
"^.+\\.js$": "babel-jest",
"^.+\\.js\\.erb$": "rails-erb-loader"
},
Однако это не работает, потому что Jest-преобразования и загрузчики Webpack, похоже, имеют разные подписи. В частности, Jest ожидает функцию process
:
$ npm test
FAIL app/javascript/components/__tests__/dummy.test.js
● Test suite failed to run
TypeError: Jest: a transform must export a `process` function.
> 101 | import ServerRoutes from '../server-routes.js.erb';
| ^
at ScriptTransformer._getTransformer (node_modules/@jest/transform/build/ScriptTransformer.js:291:15)
at ScriptTransformer.transformSource (node_modules/@jest/transform/build/ScriptTransformer.js:353:28)
at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:457:40)
at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:513:25)
at app/javascript/components/related-media.vue:101:1
at Object.<anonymous> (app/javascript/components/related-media.vue:232:3)
И вот здесь я застрял, потому что не вижу, где документально указано, каким должен быть API и поведение функции process
. В документации для опции конфигурации transform
есть один не очень полезный пример , и это все, что касается документации, если я что-то не пропустил.
Я также отмечаю, что babel-jest
имеет функцию createTransformer
, которая звучит так, как будто она может быть полезной или хотя бы освещающей, но опять же я не могу найти никаких документов о том, что она делает.
Если у кого-то есть указатели на детали создания пользовательских Jest-преобразований или хотя бы на несколько лучших документов, это было бы здорово! Или, если я поступаю неправильно, что мне делать?