问题

我一直在使用Jest和Enzyme为我的React组件编写测试,并使用了很棒的Styled Components库.

但是,由于我已经实现了主题,所以我的所有测试都在破坏.让我给你举个例子.

这是我的LooksBrowser组件的代码(我删除了所有的import和prop-types以使其更具可读性):

const LooksBrowserWrapper = styled.div`
  position: relative;
  padding: 0 0 56.25%;
`;

const CurrentSlideWrapper = styled.div`
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
`;

const NextSlideWrapper = CurrentSlideWrapper.extend`
  z-index: 1;
`;

const SlideImage = styled.img`
  display: block;
  width: 100%;
`;

const SlideText = styled.div`
  display: flex;
  position: absolute;
  top: 25%;
  left: ${PXToVW(72)};
  height: 25%;
  flex-direction: column;
  justify-content: center;
`;

const SlideTitle = styled.p`
  flex: 0 0 auto; …