解決antd Form.create() 過的組建,Enzyme simulate以后,函數(shù)監(jiān)聽不到是否執(zhí)行

1、查找思路

(1)去掉Form.create(),一切正常;
(2)打印instance(),發(fā)現(xiàn)其中的變量和函數(shù)都屬于form。

2、解決方式

(1)嘗試mount WrappedComponent,報(bào)this.props.form undefined;
(2)嘗試傳入form,至此問題解決。

3、demo

/**
* 代碼只給出了該問題的解決方式,其他相關(guān)配置并未給出。
*/
// LoginPage.js
import {Button, Form} from "antd"
class LoginPage extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      btnName: "unclick"
    };
  }
  test = () => {
    console.log('test')
    this.setState({
      btnName: "clicked"
    })
  }
  render() {
    const {btnName} = this.state;
    const { getFieldDecorator, validateFields } = this.props.form;
    return (
      <div>
        <Button onClick={() => this.test()}>{btnName}</Button>
      </div>
    );
  }
}
LoginPage = Form.create({})(LoginPage);
export default LoginPage;

// login.test.js
import LoginPage from "./LoginPage";
import { Input, Button } from "antd";
const { shallow, mount, render } = Enzyme;
describe("loginCheck", function() {
  it("檢查點(diǎn)擊按鈕是否觸發(fā)test函數(shù)", () => {
    let wrapper = shallow(<LoginPage />);
    let form = wrapper.instance();
    let LoginPageComponent = mount(<LoginPage.WrappedComponent form={form}/>)
    LoginPageComponent.instance().test = jest.fn();
    LoginPageComponent.instance().forceUpdate();
    LoginPageComponent.update();
    LoginPageComponent.find(Button).simulate('click');
    expect(LoginPageComponent.instance().test).toBeCalled();
    LoginPageComponent.instance().test.mockClear();
  });
});

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容