使用typescript在jestjs单元测试中未正确导入引导下拉列表

我是新来的

jest

，为我们的react应用程序构建了这个简单的测试，它是用typescript编写的，在很大程度上依赖react引导。我尝试了酶和反应测试库，得到了相同的结果。我们也使用webpack，但这似乎与本案例无关

somedropdown.test.tsx：

import*as React from“React”；
从“反应引导/下拉菜单”导入下拉菜单；
从“反应引导/下拉按钮”导入下拉按钮；
从“@testing library/react”导入{render，screen}”；
DropDownProps接口{
onSelect（eventKey:string）：无效
}
函数SomeDropdown（props:SomeDropdownProps）：React.ReactElement{
返回(
1.
2.
);
}
它（“应该起作用”，（）=>{
const onselect=（eventKey:string）=>{}；
const{container}=render（）；
screen.debug（容器）；
});

我当前无法执行此操作，错误如下：

    TypeError: Cannot read property 'Item' of undefined

      21 |   return (
      22 |     <DropdownButton title="Some Dropdown" variant="outline-secondary">
    > 23 |       <Dropdown.Item eventKey="1" key="1" onSelect={props.onSelect}>1</Dropdown.Item>
         |                 ^
      24 |       <Dropdown.Item eventKey="2" key="2" onSelect={props.onSelect}>2</Dropdown.Item>
      25 |     </DropdownButton>
      26 |   );

tsconfig.json

{
“编译器选项”：{
“模块”：“es2020”，
“moduleResolution”：“节点”，
“目标”：“es6”，
“rootDir”：“/src/ts”，
“outDir”：“/build/js”，
“源地图”：正确，
“宣言”：正确，
“removeComments”：正确，
“noemiton”：没错，
“emit decoromentadata”：正确，
“实验生态学者”：没错，
“allowSyntheticDefaultImports”：true，
“lib”：[“es7”，“dom”]，
“noImplicitAny”：没错，
“SuppressImplicationIndexErrors”：true，
“jsx”：“反应”
},
“包括”：[
“/src/ts/***”
],
“排除”：[
“/src/ts/***.spec.ts”
]
}

解决方案正在向tsconfig.json添加

“esModuleInterop”：true

。

尝试启用esModuleInterop TS选项。还要检查如果将

Dropdown.Item

替换为

DropdownItem

和

从“react bootstrap/DropdownItem”导入DropdownItem

会发生什么情况。