Query param changes reset focus in v2.1

[jrjohnson]

I'm not sure if this is a bug, but it is a change from v2.0.

We have inputs in our application that store the entered data in a query param (search/filter/etc). With v2.1 whenever data is entered into these inputs focus is lost as the query param changes. This is essentially unusable. We debounce the input, but any slight pause in the users typing resets the focus away.

Is this a bug that can be fixed here?
or
Is there a way we can change our application to continue to store this meaningful data in the URL and still use this addon?

eg (striped way down):

{{!-- application.hbs --}}
<NavigationNarrator/>
<Input {{on "input" this.setFilter}} />

//controllers/application.js
export default class ApplicationController extends Controller {
  queryParams = ['filter'];
  @tracked filter;

  @action
  setFilter(evt) {
    this.filter = evt.target.value;
  }
}

I can also create this as a reproduction repo if that is clearer.

cc @MelSumner as this is probably caused by changes to the route event in #306

[MelSumner]

Ok so I think the first step will be to add a failing test to the repo and go from there- all the scenarios are failing with Ember 4+ so I might need to get some of the other @ember-a11y/a11y-working-group-members to get some eyes on this; either way I'll start digging in and see what I can find out.

Very sorry for the inconvenience!

[jrjohnson]

Please don't apologize @MelSumner. I already feel bad for sending an issue instead of a PR! Thanks for taking a look, and for providing a well thought out solution for this in the first place.

[MelSumner]

@jrjohnson Update: thinking about it more closely, it is expected behavior that when you have a route that changes (and a query param addition is a route change), the focus should be reset.

There are a few potential paths forward but I'm trying to find the best solution to recommend, tyvm for your patience while I figure it out (and/or bug some other really smart people to help figure this out). 👍

[MelSumner]

For the time being, I'm going to recommend two potential solutions for your end, @jrjohnson

1. update the filter so that it doesn't activate until either the onblur event occurs, or when ENTER is pressed
2. add a "apply filter" button, and put the action there, to occur when the user interacts with the filter button

I'm also digging into trying to find out if there are some internals that can help approach this differently, but that may take some more time.

[jrjohnson]

This works a treat @MelSumner, thanks!