Selecting element from react select dropdown

[anon76289963]

I have a drop down menu in my site is using react component. I am able to open the drop down list, but am having difficulty getting it to select the desired field. How should I approach it. Help here would be appreciated.
Have put sample code and sample site which has a similar component as i am trying to use

 
 import { Selector, ClientFunction } from 'testcafe';

 fixture `Drop down `.page `http://jedwatson.github.io/react-select/`

test('Select option', async t => {
const selectArrow = Selector('.Select-arrow-zone');
const item = Selector('#react-select-2--value-item').withText('Queensland')

await t
.click(selectArrow)
.click(item)
.wait(5000);

});

[helen-dikareva]

Hello @neelay
Thank you for your example of reproducing the problem.

Your Selector for the option element isn't correct. It should be, for example:
const item = Selector('#react-select-2--option-2').withText('Victoria');.

From my point of view the easiest way to create Selector for a drop down element's item is to set an event listener in Developer Tools for some event that leads to deleting the items list (e.g blur). Please take a look at the video.

[anon76289963]

thank you this worked like a charm, the video was also very helpful.