概要
RemixのプロジェクトをLocalhostで起動しているforntコンテナに対して、cypress/includedのコンテナからテストするときにタイトルのエラーに苦戦したためメモしておきます。
下記がGithubです。
https://github.com/dbd-fish/react_sample
困ったこと
Cypressによるテストを実行したときThe following error originated from your application code, not from Cypress.
が発生してテストが全てエラーになりました。
解決策
下記のように設定して特定のエラーを無視するように設定しました。
cypress.config.js
const { defineConfig } = require('cypress');
module.exports = defineConfig({
e2e: {
baseUrl: 'https://frontend:5173', // テスト対象のURL
specPattern: [
'e2e/cypress/**/*.cy.js', //ローカル環境におけるE2Eテスト
'front_st/**/*.cy.js', //画面単位のテスト
],
// ここでサポートファイルを定義
supportFile: 'cypress/support/errorHandling.js',
},
});
errorHandling.js
Cypress.on('uncaught:exception', (err) => {
if (err.message.includes('The following error originated from your application code, not from Cypress.')) {
return false; // テストの失敗を回避
}
return true; // 他のエラーは通常通り失敗として扱う
});
余談
本エラーについて、Cypress公式のIssuesでいろいろ議論されています。
Hydration errorsが発生していますが、エラーを無視するときのメッセージ指定がこことは異なったいるため記事にしました。
人によって解決法が違うため本記事を作成しました。
https://github.com/cypress-io/cypress/issues/27204#issuecomment-1927093633