How can I open a React combobox and select one value in testCafe?

I have a combo-box using react:

<div class="Select is-clearable is-searchable Select--single">
    <div class="Select-control">
        <div class="Select-multi-value-wrapper" id="react-select-4--value">
            <div class="Select-placeholder">Select a reseller...</div>
            <div class="Select-input" style="display: inline-block;"><input
                    aria-activedescendant="react-select-4--value" aria-expanded="false" aria-haspopup="false"
                    aria-owns="" role="combobox" value="" style="box-sizing: content-box; width: 5px;">
                <div
                    style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-size: 14px; font-family: Roboto, sans-serif; font-weight: 400; font-style: normal; letter-spacing: normal; text-transform: none;">
                </div>
            </div>
        </div><span class="Select-arrow-zone"><span class="Select-arrow"></span></span>
    </div>
</div>

In my code, I can "open" the combo-box, but I can't select one option:

    test('Create a new Quote...', async t => {

        //open the combo-box
        await t.click(Selector('.Select-arrow-zone')).wait(3000);

        //try to select the second value, that is "Demo"
        await t.click(Selector('input').withAttribute('aria-activedescendant','react-select-4--option-1')).wait(3000);

        await t.expect(Selector('button').withExactText('Add Item').exists).ok();
    });

The second click fail, with the message:

   1) The specified selector does not match any element in the DOM tree.

         | Selector('input')
       > |   .withAttribute('aria-activedescendant', 'react-select-4--option-1')

What should I do?

Thanks!