Jest测试coffee.ERB文件

Posted 2021-05-06

在一个Rails项目中，我有一些包含ERB语法的javascript文件，即

// en_store.coffee.erb

EnStore =
  activities:
    title: 'Delete Note?'
    image: '<%= asset_path("crm/sections/en/calendar.png") %>'

module.exports.EnStore = EnStore

而且测试：

// en_store.test.coffee

import { EnStore } from 'stores/en_store'

describe 'EN Store', () ->

  // This test passes.
  it 'should provide hard typed translation', () ->
    expect(EnStore.activities.title).toBe('Delete Note?')

  // This one fails as the EnStore.activities.image contains '<%= asset_path("crm/sections/en/calendar.png") %>' as a string and not the actual interpolated value.
  it 'should provide asset path', () ->
    expect(EnStore.activities.image).toBe('[This is not interpolated]')

尝试使用Jest测试它会导致错误，因为ERB部分未进行插值。在测试之外，这是由Webpack通过rails-erb-loader处理的。如何让它与Jest一起使用？是否有任何现有的transform包可以让我这样做？

或者是否可以替代Jest让我测试那些类型的文件？

答案

由于.erb文件没有babel支持或插件，因此您无需简单的方法将源文件转换为jest可以使用的内容。

但是，有一些可行的选择。

1) Consume webpack loaders as Babel plugins

babel-plugin-webpack-loaders是一个Babel插件，意味着使用webpack加载器通过babel转换文件。

这是jest's docs针对基于非平凡Webpack配置的项目提到的解决方案，但该项目不再维护并且仅与webpack v1正式兼容。

2) Write a Jests custom transformer

Jest不提供开箱即用的webpack集成，但通过transformers提供源代码转换。

你可以考虑基于writing a custom .erb transformer的Webpack's Rails erb loader。

3) Integrate Jest and Webpack with third party utility

即使没有得到Jest团队的正式支持，jest-webpack也是一个旨在将Jest与您现有的Webpack配置集成的项目。