Почему не работает simulate('change', { target: { value: 'test name' } })?

Question

[anriko]

использую jest и enzyme
вот так не получается заполнить инпут
wrapper.find('input').at(0).simulate('change', { target: { name: 'width', value: 50 } });

Comments

[Кира]

Инпут находит?
Выдает ошибку? Если да, то какую?

[anriko]

Кира, я на инпутах не прописал value , не могу понять его обязательно прописывать?
я же хочу не в атрибут прописать , а в инпут ,как объект
FormTaskItem New › FormTaskItem New filds
TypeError: Cannot read property 'value' of undefined

<input type="text" className="task-item-name" name="title" placeholder="Enter task item name" required="" ref={c => this.inputTaskItemName = c} />

ошибка когда хочу получить value через ref
this.inputTaskItemName.value,

[Кира]

Ну вот как минимум, вы пишите в тесте { target: { name: 'width', value: 50 } }
А имя ваше инпута name="title"

Плюс, вы уверены что этот инпут .at(0)?

[anriko]

Кира, я скопировал из примера в документации где с тайтлом https://enzymejs.github.io/enzyme/docs/api/Shallow...
, а у меня только valuе вот у меня так ,но в инпуте же не обязательно должен быть атрибут ,чтобы установить в него значение

test('FormTaskItem New filds', () => {
        component.find(".task-item-name").at(0).simulate('change', { target: { value: 'test name' } });
        component.find(".task-item-text").at(0).simulate('change', { target: { value: 'test text' } });
        console.log(component.find(".task-item-name").at(0));
        const btn = component.find(".form-submit");
        btn.simulate('click');
        expect(actionsetNewTaskItem).toHaveBeenCalledWith({
            keychapter: "-Mnu71_BYp_test",
            title: 'test name',
            text: 'test text'
        }, dispatch);
    });

пробовал и так component.find(".task-item-name").at(0).value='test name' ,но была ошибка ,что объект не
расширяется

и в консоль лог почему не пойму не дом объект console.log(component.find(".task-item-name").at(0));
console.log
ShallowWrapper {}

[anriko]

Кира, может реакт и jest тут работают с разным value ?

делаю так

component.find(".task-item-text").at(0).simulate('change', { target: { value: 'test text' } });
console.log(component.find(".task-item-name").at(0).value);
console.log
    undefined

[anriko]

чего-то в тестах не находит элементы ref={c => this.inputTaskItemName = c}
когда вызываю финкцию console.log выдает undefined

addNewTaskItem = () => {
        console.log("тест тест");
        console.log(this.inputTaskItemName);

        let data = { keychapter: this.state.openFormTaskItemNew.keychapter, title: this.inputTaskItemName.value, text: this.inputTaskItemText.value };
        actionsetNewTaskItem(data, this.props.dispatch);
    }

[anriko]

Кира,такой тест тоже не проходит

it('should render Input', () => {
        expect(component.find(".task-item-name").at(0)).toHaveLength(1);
        expect(component.instance().inputTaskItemName).toBeTruthy();
    })

[anriko]

переделал ref так и нашло его
constructor(props) {
super(props);
this.inputTaskItemName = React.createRef();
this.inputTaskItemText = React.createRef();

}
но в инпуты значения не повставлялось

и почему-то надо писать так через курент value

addNewTaskItem = () => {
        let data = { keychapter: this.state.openFormTaskItemNew.keychapter, title: this.inputTaskItemName.current.value, text: this.inputTaskItemText.current.value };
        actionsetNewTaskItem(data, this.props.dispatch);
    }

и тест ругается на

FormTaskItem New › FormTaskItem New filds

TypeError: Cannot read property 'value' of null

40 | console.log("тест тест", this.inputTaskItemName);
41 |
> 42 | let data = { keychapter: this.state.openFormTaskItemNew.keychapter, title: this.inputTaskItemName.current.value, text: this.inputTaskItemText.current.value };
| ^
43 | actionsetNewTaskItem(data, this.props.dispatch);
44 | }