错误：未捕获 [TypeError：无法读取未定义 Jest 反应测试的属性“x”

Posted 2023-02-22

【中文标题】错误：未捕获 [TypeError：无法读取未定义 Jest 反应测试的属性“x”

【英文标题】：Error: Uncaught [TypeError: Cannot read property 'x' of undefined Jest react testing

【发布时间】：2021-09-20 09:10:22

【问题描述】：

我是新来的反应和测试，所以也许我误解了文档，但我有一个定义 const 变量 的函数，它只是一个具有属性“X”的对象数组，我们会调用它。我过滤这个数组并获取第一个对象并寻找 X。

然后我将它导入到我的 jest 测试文件中，但是当我运行测试时它失败了，说 Error: Uncaught [TypeError: Cannot read property 'X' of undefined] em>。

我不确定为什么，因为当我实际运行应用程序时它可以工作，所以我假设需要进行某种变量模拟？

下面是我的代码。我已经去掉了不重要的部分。如果有人可以指导我正确的方向。

main.jsx

 export default function main(
    name, value, options, onChange, onBlur, inputRef, error, complete
) 
  const data = options.filter(name => name.uuid === value)[0].X.slice(8);

   return ( blah blah blah, this works when I actually render it )

test.jsx

import main from './main';

test('Renders', () => 

const options = [
   
    uuid: 'foo', 
    X: ['a', 'b'] 
  
]

  const  getByText  = render(
    <main
      name="test"
      value=""
      options=options
      onChange=() => 
      onBlur=() => 
    />
  );
);

【参考方案1】：

因为你传递的道具 value 是 "" 所以 options.filter(name => name.uuid === value)[0] 是未定义的。你可以更新value来修复

value="foo"

【讨论】：

谢谢！！！我花了几个小时在这上面看不到为什么。我想这只是你需要第二双眼睛的那些东西。再次感谢！

【参考方案2】：

您正在发送一个空值，因此过滤器方法会抛出一个空数组，当您尝试访问其第一个元素时，您会得到未定义。

这就是错误Cannot read property 'X' of undefined的原因

【参考方案3】：

.filter() 返回过滤后的元素数组，这些元素已通过回调中指定的条件。

要么更改您的过滤条件，要么将foo 作为值传递：

<main
      name="test"
      value="foo"
      options=options
      onChange=() => 
      onBlur=() => 
/>

否则，您将检查未定义的空数组的第 0 个元素。