首页 > 解决方案 > Cypress React,找不到安装组件的根元素

问题描述

我试图测试我的反应应用程序,用柏树创建(create-react-app)。

出于某种原因,我收到此错误:

在此处输入图像描述

如您所见,它试图通过 ROOT_ID 获取元素,ROOT_ID 它是一个常量:

在此处输入图像描述

我找到解决这个问题的所有方法都是 cypress/support/index.js 上的导入

导入“柏树反应单元测试/支持”;

但正如你在这里看到的:

https://github.com/cypress-io/cypress-react-unit-test

这个 repo 已移至官方柏树,我找不到等效的导入。

这是我的插件/index.js

const findWebpack = require('find-webpack')
const webpackPreprocessor = require('@cypress/webpack-preprocessor')

/**
 * @type {Cypress.PluginConfig}
 */
module.exports = (on) => {
  // find the Webpack config used by react-scripts
  const webpackOptions = findWebpack.getWebpackOptions()

  if (!webpackOptions) {
    throw new Error('Could not find Webpack in this project ')
  }

  const cleanOptions = {
    reactScripts: true,
  }

  findWebpack.cleanForCypress(cleanOptions, webpackOptions)

  const options = {
    webpackOptions,
    watchOptions: {},
  }

  on('file:preprocessor', webpackPreprocessor(options))
}

标签: javascriptreactjstestingwebpackcypress

解决方案


所以显然我使用了错误的柏树模块。

这是用于反应测试

npx 柏树 open-ct

或者

npx 柏树运行-ct

赛普拉斯/插件/index.js:

const injectDevServer = require("@cypress/react/plugins/react-scripts")

module.exports = (on, config) => {
  injectDevServer(on, config)
  return config
}

推荐阅读