reactjs - 无法使用 enzyme 更改选择元素的值

Question

react :16.0.0

enzyme :3.2.0

开玩笑:21.2.1

以下测试不起作用。我还写下了我已经尝试过的无效代码的列表(在注释中)。

import React from 'react';
import { configure, mount, shallow, render } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

/* ... */


it('enter valid data for connection; enable proxy; check if button is disabled', () => {
    const component = getComponent(mount); // mount from enzyme
    enterCredentials(component);
    const proxySelect = component.find('select');

    // currently tried these variants:
    proxySelect.simulate('change', { target: { value: true } } );
    // component.find('select').simulate('select', true);
    // component.find('select').simulate('select', 'Yes');
    // component.find('select').simulate('change', { target: { value: true } } );

    // /* Mutating: */
    // proxySelect.node.selectedIndex = 1;
    //
    // Producing this error:
    //
    //      Attempted to access ReactWrapper::node, which was previously a private property on
    //      Enzyme ReactWrapper instances, but is no longer and should not be relied upon.
    //      Consider using the getElement() method instead.
    //
    //  at ReactWrapper.get (node_modules/enzyme/build/ReactWrapper.js:1689:15)

    expect(proxySelect.prop('value')).toBe(true);
    expect(component.find('button').prop('disabled')).toBe(false);
});

选择元素的标记:

<select>
    <option value="false">No</option>
    <option value="true">Yes</option>
</select>

在 github 上发现一个问题:https://github.com/airbnb/enzyme/issues/389但该问题的解决方案也不起作用。如何在测试中更改 select 的值？

Answer 1

我认为问题在于“事件”值的类型，它应该是一个像这样的字符串:

// notice the quotes around "true"
proxySelect.simulate('change', { target: { value: 'true' } } );