Enzyme: Props are not updated after simulating event

[ziyadmutawy]

Describe the bug
During the test case, I perform a full mount on a component. After finding the text input element, I simulate a change event in which I know the callback function is triggered since the value of the variable being passed back is asserted to be true. However, the props of the child element do not get updated even if I do fire off another re-render wrapper.update()

Test

test("full mount render and check elements, set new input value prop by simulating text input", () => {
        const store = createMockStore({...loggedInWithData});
        const newContext = {store};

        const component = (
            <AutoCompleteInput
                error={false}
                inputValue={inputValue}
                onSelectValue={(newSelectedValue)=>{selectedValue = newSelectedValue}}
                onInputChange={(newInput)=>{inputValue = newInput}}
                label={"sampleLabel"}
                helperText={"help text"}
                disabled={false}
                id={"id1"}
                suggestions={[...suggestions]}
            />
        );

        let mountWrapper = mount(component, {newContext});


        let textInputArray = mountWrapper.find("#AutoCompleteInput-id1");
        expect(textInputArray.length).toEqual(3);
        expect(inputValue).toEqual("");

        let inputElement = mountWrapper.find('input');
        expect(inputElement.props().value).toEqual("");
        inputElement.simulate('change', {target: {value: "some"}});

        mountWrapper.update();

        inputElement = mountWrapper.find('input');


        //PASSES
        expect(inputValue).toEqual("some");

        //FAILED
        expect(inputElement.props().value).toEqual("some");

    });

Expected behavior
Based on the api docs, I know that wrappers are immutable, however, children elements should be updated. And if i do fire off wrapper.update() the props should definitely be updated.

Screenshots

Desktop (please complete the following information):

• OS: MacOS High Sierra 10.13.6
  
  
  
  • React: "^16.0.0",
  
  

[huchenme]

I just realized that you need to use mountWrapper.find('input').props().value instead of old reference, but this is not ideal. Is this intended or is it a bug? @ljharb

[ljharb]

@huchenme it's required in enzyme 3; you always have to re-find from the root after anything changes. See https://github.com/airbnb/enzyme/blob/master/docs/guides/migration-from-2-to-3.md#element-referential-identity-is-no-longer-preserved

[ziyadmutawy]

@ljharb I did try to re-find it from the root at: inputElement = mountWrapper.find('input'); is that not the right way?

[ljharb]

@ziyadmutawy oh you're fine; i was responding to https://github.com/airbnb/enzyme/issues/1757#issuecomment-416500618.

The issue might be that simulate doesn't actually simulate anything, and should be avoided - all it does is invoke a prop function.

Have you tried mountWrapper.forceUpdate() as well? Also, is AutoCompleteInput doing anything async?