[React] Combobox: aria-labelledby not set if Label is rendered last

[daniel-franz]

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

v1.7.0

What browser are you using?

Chrome, Jest

Reproduction URL
Minimal failing test-case:

    it(
      'should be possible to link Input/Button and Label if Label is rendered last',
      suppressConsoleLogs(async () => {
        render(
            <Combobox value="Test" onChange={console.log}>
                <Combobox.Input onChange={NOOP} />
                <Combobox.Button />
                <Combobox.Label>Label</Combobox.Label>
            </Combobox>
        )

        assertComboboxLabelLinkedWithCombobox()
        assertComboboxButtonLinkedWithComboboxLabel()
      })
    )

Describe your issue

labelRef does not seem to get updated on Input and Button if the Label is rendered last. This results in missing aria-labelledby attributes. Same as reported in #1352, but it is also failing in React.

The issue is fixing itself when re-rendering the component.

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

This should be fixed by #1838, and will be available in the next release.

You can already try it using npm install @headlessui/react@insiders.

[daniel-franz]

Hey. It works perfectly. Thank you for fixing it that fast 🙏