TextField looses focus in Notebook view

Describe the bug

The TextField looses focus in Notebook view (tested with react).

To reproduce

Render a text field and also a dropdown in a notebook renderer. While mouse down, the text field receives the focus. However on mouse up the text field looses the focus. Therefore the user is unable to enter anything into the text field. Once the dropdown field is removed from the code base, this only happens once after opening a notebook view. So it seems that adding the DropDown leads to the text field constantly loosing focus. Whereas it happens only once if it used without the dropdown.

export const activate: ActivationFunction = context => {
  return {
    renderOutputItem(outputItem, element) {
      const root = createRoot(element);
      root.render(
        <>
          <VSCodeTextField />
          <VSCodeDropdown>
            <VSCodeOption>a</VSCodeOption>
            <VSCodeOption>b</VSCodeOption>
          </VSCodeDropdown>
        </>,
      );
    },
    disposeOutputItem(outputId) {
      // Do any teardown here. outputId is the cell output being deleted, or
      // undefined if we're clearing all outputs.
    }
  };
};

Expected behavior

The text field does not loose focus. Even on the first click/focus.

Current behavior

The text field looses the focus.

Screenshots

Desktop (please complete the following information):

• OS Version: macOS 12.3.1
• VSCode: 1.68.1
• Toolkit Version: v1.0.0

Additional context

The issue could not be reproduced with VSCode 1.67 and before. So the problem seems to have been introduced with VSC 1.68.

Sample Code: Archive.zip

[bigbug]

@hawkticehurst : I can confirm the bug also occurs with

root.render(
        <>
          <VSCodeDropdown>
            <VSCodeOption>a</VSCodeOption>
            <VSCodeOption>b</VSCodeOption>
          </VSCodeDropdown>
          <VSCodeTextField></VSCodeTextField>
        </>,
      );

[bigbug]

@hawkticehurst I can confirm that it works again. Thanks for your help!