Add native change event for hiddenSelect

[gijsroge]

Closes #6217

✅ Pull Request Checklist:

• Included link to corresponding React Spectrum GitHub Issue.
• Added/updated unit tests and storybook for this change (for new code or code which already has tests).
• Filled out test instructions.
• Updated documentation (if it already exists for this component).
• Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

yarn jest packages/@react-aria/select/test/HiddenSelect.test.tsx -t "should trigger onChange"

🧢 Your Project:

[snowystinger]

Looks like one of the Picker tests is failing. Have you looked into it?

[gijsroge]

Looks like one of the Picker tests is failing. Have you looked into it?

Will look into it this weekend yeah.

[gijsroge]

Been struggling to find out why this line causes that Picker test to fail:

react-spectrum/packages/@react-aria/select/src/HiddenSelect.tsx

Line 128 in d7b7b35

selectRef.current.dispatchEvent(new Event('change', {bubbles: true}));

I've added a story in the Picker story where you can debug the test. I cannot reproduce it manually. Will do another attempt later on.

Another thing i've realised is that in the HiddenSelect there will rendered a hidden input instead of a Native Select if there are more then 300 options. Will still have to cover this as well.

react-spectrum/packages/@react-aria/select/src/HiddenSelect.tsx

Lines 135 to 168 in d7b7b35

	if (state.collection.size <= 300) {
	return (
	<div {...containerProps} data-testid="hidden-select-container">
	<input {...inputProps} />
	<label>
	{label}
	<select {...selectProps} ref={selectRef}>
	<option />
	{[...state.collection.getKeys()].map(key => {
	let item = state.collection.getItem(key);
	if (item.type === 'item') {
	return (
	<option
	key={item.key}
	value={item.key}>
	{item.textValue}
	</option>
	);
	}
	})}
	</select>
	</label>
	</div>
	);
	} else if (name) {
	return (
	<input
	type="hidden"
	autoComplete={selectProps.autoComplete}
	name={name}
	disabled={isDisabled}
	value={state.selectedKey ?? ''} />
	);
	}