反応断片に酵素のスナップショットを使用することは可能ですか？

Question

ReactフラグメントがEnzymeのスナップショットと互換性があるかどうかは疑問です。今は、React 16+のフラグメントが酵素のshallow()メソッドのSymbolsとしてレンダリングされているように見えます。これは変換エラーの原因となります："TypeError: Cannot convert a Symbol value to a string"。ここで

は私のテストです：

it('should render successfully',() => { 
    const wrapper = shallow(
    <Sections 
     data={mappedMockData} 
     sections={mappedMockData.sections} 
     eligibility={mockEligibility} 
    /> 
); 

console.log(wrapper.debug()); 

expect(wrapper).toMatchSnapshot(); 

そして、ここに私はconsole.logからの出力です：

注目に

<Symbol(react.fragment)> 
    <div className="content-container"> 
     <div className="flex"> 
     <div className="sections-wrap"> 
      <Connect(Section1) /> 
      <Connect(Section2) /> 
     </div> 
     <Connect(Section3) /> 
     </div> 
    </div> 
    <div className="content-container"> 
     <Connect(Section4) /> 
     <Connect(Section5) /> 
    </div> 
    </Symbol(react.fragment)> 

ワース：私はすでに私の酵素を更新して反応し、すでに使用していましたアダプター、酵素のmigration guideで示唆されるように。スタックオーバーフローやGithubで他の同様の問題を見つけることができませんでした。どのような洞察にも感謝します！

Answer 1

このenzyme issue commentは有効なテストのために役に立ちました。 <React.Fragment>の代わりにリテラルのスナップショットのテンプレートに<Unknown></Unknown>（全体のスレッドは、酵素のスナップショットのテストとフラグメントの状態についての詳細を知るために有用である）。しかし、このコードは私のために働いた、出力：

const component = shallow(<FragmentComponent />) 
const fragment = component.instance().render() 
expect(shallow(<div>{fragment}</div>).getElement()).toMatchSnapshot() 

ここれますサンプル出力：

exports[`<FragmentComponent /> it renders to match the snapshot 1`] = ` 
<div> 
    <Unknown> 
    <div></div> 
    <div></div> 
    </Unknown> 
</div> 
`;