Estou confuso sobre como acessar o <input>
valor ao usar mount
. Aqui está o que tenho como meu teste:
it('cancels changes when user presses esc', done => {
const wrapper = mount(<EditableText defaultValue="Hello" />);
const input = wrapper.find('input');
console.log(input.render().attr('value'));
input.simulate('focus');
done();
});
O console imprime undefined
. Mas se eu modificar um pouco o código, ele funciona:
it('cancels changes when user presses esc', done => {
const wrapper = render(<EditableText defaultValue="Hello" />);
const input = wrapper.find('input');
console.log(input.val());
input.simulate('focus');
done();
});
Exceto, é claro, a input.simulate
linha falha, já que estou usando render
agora. Eu preciso de ambos para funcionar corretamente. Como faço para corrigir isso?
EDITAR :
Devo mencionar, <EditableText />
não é um componente controlado. Mas quando passo defaultValue
para <input />
, parece definir o valor. O segundo bloco de código acima imprime o valor e, da mesma forma, se eu inspecionar o elemento de entrada no Chrome e digitar $0.value
no console, ele mostra o valor esperado.
input.render()
não éreact-dom
renderizar. É este: airbnb.io/enzyme/docs/api/ShallowWrapper/render.html