使用React Component的代理时查找失败

时间:2018-08-17 15:34:04

标签: reactjs jestjs enzyme

描述错误 我需要代理我应用程序中的某些组件。它们渲染正确,但是我无法运行测试,因为enzime方法find抛出了消息Method “simulate” is only meant to be run on a single node. 0 found instead.

要复制

只需创建并运行该简单测试

import * as React from "react"
import { shallow, configure } from "enzyme"
import * as Adapter from "enzyme-adapter-react-16"

configure({ adapter: new Adapter() })

describe("Test", () => {
    it("Call directly", async () => {
        const r = shallow(<A />)
        r.find("button").simulate("click") // works well
    })
    it("Using fetcher", async () => {
        const r = shallow(<B />)
//        expect(r.html()).toEqual("?")  // HTML is  "<div><button type=\"button\">Btn</button></div>"
        r.find("button").simulate("click") // Method “simulate” is only meant to be run on a single node. 0 found instead.
    })
})

class A extends React.Component {
    public render() {
        return <div>
            <button type="button">
                Btn
            </button>
        </div>
    }
}

const B = createProxy(() => <A />)

function createProxy(Component) {
    // I need to do more things here
    return class extends React.Component {
        public render() {
            return <Component />
        }
    };
}

预期的行为 找到必须返回的按钮元素

桌面(请填写以下信息):

- OS: Linux 4.9.0-deepin13-amd64 #1 SMP PREEMPT Deepin 4.9.57-1 (2017-10-19) x86_64 GNU/Linux
 - node --version `v8.11.3`
- npm --version 6.1.0
-  "enzyme": "^3.4.1",
-  "enzyme-adapter-react-16": "^1.2.0",
-  "react": "^16.4.1",
-  "react-dom": "^16.4.1",
-  "realm": "^2.14.2",

1 个答案:

答案 0 :(得分:2)

Shallow Rendering不会呈现子组件。

(例如,在这段代码中,shallow的{​​{1}}渲染产生B,因此<A />返回0个结果)

如果要针对子组件呈现的html进行测试,则需要使用find('button')来进行Full Rendering