Javascript 测试：用Jest/Ezyme找到风格化的情感成分

我把一个项目从魅力转移到情感。唯一缺失的拼图？测试

在glamorous中，我可以找到具有以下选择器的元素：

$component.find('StyledComponent');

$component.find('StyledComponent[prop="value"]');

这已经不起作用了。到目前为止，我发现最好的方法是：

import StyledComponent from 'my/ui/StyledComponent';

$component.find(StyledComponent);

$component.find(StyledComponent).filter('[prop="value"]');

我喜欢前一种方式，因为根本不需要导入组件。某些情感组件在文件中定义，而不导出它们。在这些情况下，它将更加冗长：

$component.find('div[className*="StyledComponent"]');

$component.find('div[className*="StyledComponent"][prop="value"]'); // or
$component.find('div[className*="StyledComponent"]').filter('[prop="value"]')

---

有更好的办法吗？谢谢你的阅读

您仍然可以使用第一种方法，在定义样式化组件时设置其

displayName

const StyledComponent = styled('div')` // ... `;
StyledComponent.displayName = 'StyledComponent';

这将允许您在测试期间使用初始值查找：

$component.find('StyledComponent');

我希望这有帮助