reactjs - React Typescript 面临酶问题

Question

我有一个组件 app.tsx

import React, { useState } from "react";

const TestCom = () => {
 return(
     <>
     <div className="head">hey there</div>
     <select name="xyz" id="uni">
         <option value="abc">abc</option>
     </select>
     </>
 )
}

export default TestCom

我正在用玩笑和酶测试它 app.test.tsx

import  TestCom  from "./foo";
import { shallow } from 'enzyme';
import React from "react";


 test("basic test", () => {
 const app= shallow(<TestCom />)
  expect(app.find('div.head')).to.have.lengthOf(1);
 });

每当我使用 .to 时，它的抛出错误

Property 'to' does not exist on type 'JestMatchersShape<Matchers<void, ShallowWrapper<HTMLAttributes,
 any, Component<{}, {}, any>>>, Matchers<Promise<void>, ShallowWrapper<HTMLAttributes, any, 
Component<...>>>>'.ts(2339)

我已尝试进行故障排除，但无法找到解决方法

标签： reactjstypescriptjestjsenzyme

Answer 1

在添加chai library之前，没有任何.to.方法。Jest自己的匹配器具有.toHaveLength()您可以使用的：

expect(app.find('div.head')).toHaveLength(1);