State change occurs before hitting reducer on Enter key

[Andrey Okonetchnikov]

• downshift version: 7.6.0
• node version: 20
• npm (or yarn) version: 1.9

What you did:

I was trying to implement a customer request to keep the input's field value intact after selecting. So I tried doing this in the stateReducer:

const { changes, type } = actionAndChanges;
switch (type) {
    case stateChangeTypes.InputKeyDownEnter:
    case stateChangeTypes.ItemClick:
      return {
        ...changes,
        inputValue: state.inputValue, // Keep the previous input value.
      };
    default:
      return changes;
}

That didn't work so after printing the state and changes I found out that it's already having both selectedItem and inputValue set. In my understanding that should happen in the reducer, so the state should not have those values set, and changes should. After returning changes, the new state should be updated.

What happened:

Suggested solution:

I'm not sure but it seems like the state was already update prior the reducer function was called.

[Andrey Okonetchnikov]

I think it might be a duplicate of #759

[Silviu Alexandru Avram]

@okonet can you create a full code sandbox with the issue you are facing? There may be something wrong with your implementation.

You can also check our examples repo: https://codesandbox.io/s/github/kentcdodds/downshift-examples

You will find a stateReducer example there for useCombobox, if that's what you are using. Just replace the uppercase thing from there with state.inputValue and it should be good to go. Thanks!