如何配置 jest 快照位置

Question

我希望將我的笑話快照創建為我的測試文件的兄弟

我目前將我的快照放在默認的__snapshots__文件夾中。

當前的：

我想達到的目標：

我在 github 上找到了這篇文章： https : //github.com/facebook/jest/issues/1650

在線程中，有人說以下應該有效，但我沒有任何運氣（即使更改了正則表達式和其他更改）：

module.exports = {
  testPathForConsistencyCheck: 'some/example.test.js',

  resolveSnapshotPath: (testPath, snapshotExtension) =>
    testPath.replace(/\.test\.([tj]sx?)/, `${snapshotExtension}.$1`),

  resolveTestPath: (snapshotFilePath, snapshotExtension) =>
    snapshotFilePath.replace(snapshotExtension, '.test'),
}

Answer 1

在package.json （或者如果您使用jest.config.js ）中，您需要添加snapshotResolver文件的路徑：

"jest": {
  "snapshotResolver": "./snapshotResolver.js"
}

snapshotResolver.js是一個包含您在 Github 問題中找到的代碼的文件。

在我的例子中，這個文件位於項目的根目錄（靠近node_modules文件夾）

Answer 2

此外，除了Vasyl Nahuliak 的回答中建議的 snapshotResolver 路徑之外，要實現快照和測試文件如下所示：

file.test.js
file.test.js.snap

您的 snapshotResolver 應如下所示：

module.exports = {
  testPathForConsistencyCheck: 'some/example.test.js',

  resolveSnapshotPath: (testPath, snapshotExtension) =>
    testPath.replace(/\.test\.([tj]sx?)/, `.test.$1${snapshotExtension}`),

  resolveTestPath: (snapshotFilePath, snapshotExtension) =>
    snapshotFilePath.replace(snapshotExtension, ''),
};

Answer 3

這些解決方案更復雜，這是您嘗試執行的操作所需的。

正如在https://github.com/facebook/jest/issues/1650 中指出的那樣

解決方案

創建一個文件：我用過 - 'jest/snapshotResolver.js'

module.exports = {
  resolveSnapshotPath: (testPath, snapshotExtension) =>
     testPath + snapshotExtension,
  resolveTestPath: (snapshotFilePath, snapshotExtension) =>
    snapshotFilePath.replace(snapshotExtension, ''),
  testPathForConsistencyCheck: 'some.test.js',
};

在你的笑話配置中將該文件設置為解析器

snapshotResolver: './jest/snapshotResolve.js',

或者如果你在 package.json 中開玩笑的配置：

"snapshotResolver": "./jest/snapshotResolve.js",

解釋

總之這兩個函數互為鏡像，一個取測試文件路徑返回快照路徑，另一個取快照路徑返回測試文件路徑。 第三個是用於驗證的文件路徑示例。

更清晰的代碼幫助澄清發生了什么

要記住的一件事是路徑是完整路徑而不是相對路徑。

/**
 * 
 * @param testPath Path of the test file being test3ed
 * @param snapshotExtension The extension for snapshots (.snap usually)
 */
const resolveSnapshotPath = (testPath, snapshotExtension) => {
    const snapshotFilePath = testPath + snapshotExtension; //(i.e. some.test.js + '.snap')
    return snapshotFilePath;
}

/**
 * 
 * @param snapshotFilePath The filename of the snapshot (i.e. some.test.js.snap) 
 * @param snapshotExtension The extension for snapshots (.snap)
 */
const resolveTestPath = (snapshotFilePath, snapshotExtension) => {
    const testPath = snapshotFilePath.replace(snapshotExtension, '').replace('__snapshots__/', ''); //Remove the .snap
    return testPath;
}

/* Used to validate resolveTestPath(resolveSnapshotPath( {this} )) */
const testPathForConsistencyCheck = 'some.test.js'; 

module.exports = {
    resolveSnapshotPath, resolveTestPath, testPathForConsistencyCheck
};