酶找不到组件/ <div>答案

【问题标题】：Enzyme Cannot Find Component / <div>酶找不到组件/ <div>
【发布时间】：2019-08-31 20:41:20
【问题描述】：

我正在使用“反应”：“^15.5.4”和“酶”：“^2.8.2”

鉴于wrapper.debug() 的以下输出：

<CellRenderer idx={4} rowIdx={0} height={35} column={{...}} 
              cellMetaData={{...}} value={3} rowData={{...}} 
              isRowSelected={false} expandableOptions={{...}}
              selectedColumn={[undefined]} formatter={[undefined]} 
              isScrolling={true}>
                                    
              <Cell idx={4} rowIdx={0} height={35} column={{...}}
                    cellMetaData={{...}} value={3} rowData={{...}}
                    isRowSelected={false} expandableOptions={{...}} 
                    selectedColumn={[undefined]} formatter={[undefined]} 
                    isScrolling={true} className="" tooltip=""
                    tabIndex={-1} isExpanded={false} isCellValueChanging={[Function]}>
                                    
                    <div height={35} tabIndex={-1} value={3} className="react-grid-Cell" 
                         style={{...}} onClick={[Function]} onDoubleClick={[Function]} 
                         onContextMenu={[Function]} onDragOver={[Function]}>
                                    
                         <div className="react-grid-Cell__value">
                              <div style={{...}}>
                                   <span>
                                         <SimpleCellFormatter value={3}>
                                                <div title={3}>
                                                  3
                                                </div>

我找不到任何需要使用的元素：

wrapper.find(wrapper.findWhere(n => n.name() === 'CellRenderer'))
wrapper.find("div[title='3']"
wrapper.find("div[value='3']")

知道可能是什么原因吗？

【问题讨论】：

标签： javascript reactjs testing css-selectors enzyme

【解决方案1】：

也许

wrapper.find('CellRenderer') wrapper.find('div').findWhere(d => d.prop('title') === 3) wrapper.find('div').findWhere(d => d.prop('value') === 3)

【讨论】：

谢谢！有用！您是否有任何想法，为什么我不能直接使用选择器访问元素并通过 find(..).findWhere(..)？
我不确定是否诚实。我想这是因为你有一个Cell 和SimpleCellFormatter，如果你有一个清晰的 HTML 树，那么酶可能与 CSS 选择器配合得很好。一旦你开始混合 React 元素和 HTML 元素就会变得很棘手。
这对我来说是个谜。因为在某些情况下它工作得很好。感谢您的回复！

【解决方案2】：

请注意，您传入的title 和value 属性是数字，而不是字符串。所以正确的做法是

wrapper.find('div[title=3]')
wrapper.find('div[value=3]')

另一方面，如果你的 JSX 是

<div title="3"></div>

那你就可以了

wrapper.find('div[title="3"]')

docs 中提到了这一点。

【讨论】：