难以使用第三方控件模拟Jest/Enzyme/ReactTS中的单元测试事件



我在React控件中使用BlueprintJS控件,其中一个是蓝图选择控件。我需要做的是模拟更改下拉列表中的值,就像我能够使用标准 html 选择一样,但是由于这是一个单独的第三方控件,我不知道如何模拟此事件。

我已经粘贴了下面蓝图控件的输出模板,但是如果我尝试模拟itemselected或更改,它说无法模拟这些事件。

知道我如何使用酶/开玩笑来模拟这一点吗?

<Blueprint2.Select
disabled={false}
filterable={false}
itemRenderer={[Function]}
items={
Array [
"JK",
"User1",
"User2",
]
}
onItemSelect={[MockFunction]}
>
<Blueprint2.QueryList
disabled={false}
itemRenderer={[Function]}
items={
Array [
"JK",
"User1",
"User2",
]
}
onActiveItemChange={[Function]}
onItemSelect={[Function]}
query=""
renderer={[Function]}
>
<Blueprint2.Popover
autoFocus={false}
className=""
defaultIsOpen={false}
disabled={false}
enforceFocus={false}
hasBackdrop={false}
hoverCloseDelay={300}
hoverOpenDelay={150}
inheritDarkTheme={true}
interactionKind="click"
isOpen={false}
minimal={false}
modifiers={Object {}}
onInteraction={[Function]}
openOnTargetFocus={true}
popoverClassName="pt-select-popover"
popoverDidOpen={[Function]}
popoverWillClose={[Function]}
popoverWillOpen={[Function]}
position="bottom-left"
rootElementTag="span"
targetElementTag="div"
transitionDuration={300}
usePortal={true}
>
<Manager
className="pt-popover-wrapper"
tag="span"
>
<span
className="pt-popover-wrapper"
>
<Target
className="pt-popover-target"
component="div"
innerRef={[Function]}
onClick={[Function]}
>
<div
className="pt-popover-target"
onClick={[Function]}
>
<div
className=""
key=".0"
onKeyDown={[Function]}
>
JK
</div>
</div>
</Target>
<Blueprint2.Overlay
autoFocus={false}
backdropClassName="pt-popover-backdrop"
backdropProps={Object {}}
canEscapeKeyClose={true}
canOutsideClickClose={true}
didOpen={[Function]}
enforceFocus={false}
hasBackdrop={false}
isOpen={false}
lazy={true}
onClose={[Function]}
transitionDuration={300}
transitionName="pt-popover"
usePortal={true}
/>
</span>
</Manager>
</Blueprint2.Popover>
</Blueprint2.QueryList>
</Blueprint2.Select>

对于任何试图做类似事情的人

最后,我使用了蓝图选择组件上的道具来访问onItemSelect((函数。下面的代码

const pb = wrapper.find("Select").first();
expect(pb.exists()).toBeTruthy();
const props = pb.props() as any;
props.onItemSelect("User2");

最新更新