Text-field as refetch-trigger of dynamically populated dropdown has a timing / debounce issue

[GregorTr]

Summary

If a text field is used in a fetch context and as a refetch-trigger of a dynamically populated dropdown field, the data that is sent to the ajax callback is out of sync (doesn't contain the latest entered value, depending on how fast the user types).

I assume that there is some kind of debouncing issue that comes from the fact that I want to use a text field (changes are applied on keydown in rapid succession) and not a dropdown field as the refetch-trigger?

Steps to reproduce

1. Create new element in Element Studio (or open up an existing one)
2. Add a Dropdown field to the element
3. Register an ajax handler (via \Breakdance\AJAX\register_handler, sample code below btw) which is used to populate the created dropdown field
4. Add a text field (I assume all fields which trigger a value change on keydown have this issue)
5. Configure the dropdown field:
   • Populate from server data: Use the previously created ajax callback (Step 3)
   • Fetch context path: Use a path which includes the previously created text field (Step 4)
   • Refetch data if control's value changes: The previously created text field (Step 4)
6. Enter a value in the text field, this causes a refetch of the dropdown data. But the returned data is out of sync. Depending on how fast you type, the value that is submitted to the server as fetch context doesn't contain all entered characters!

Additional info

Dropdown options:

Ajax handler (returns the received context as value for debugging purposes):

add_action('breakdance_loaded', function () {
    \Breakdance\AJAX\register_handler(
        'test_callback',
        'testCallback',
        'edit',
        true,
        [
            'args' => [
                'requestData' => [
                    'filter' => FILTER_DEFAULT,
                    'flags' => FILTER_REQUIRE_ARRAY
                ]
            ]
        ]
    );
});

function testCallback($requestData): array {
    return [[
        'value' => 'debug',
        'text' => @$requestData['context']['data']['id']
    ]];
}

Versions: Breakdance Version: 1.6.1 WP Version: 6.4.1 Browser: Chrome 119 OS: Mac OS Ventura