Form.Field - Cannot set ID when contains child elements or content prop

[srotbart]

Bug Report

When creating a <Form.Field> with child elements or content prop, ID is ignored and cannot be set on the div that is created from the <Form.Field>.

This bug is caused by the following PR: #3822
Since the PR added id prop as one of the handled props for this component if it is provided by the user it will be filtered out on the getUnhandledProps function.

When no control is provided the created element props will be taken from the rest variable.
Because the id was filtered out from the rest variable it will not be passed to the child elements or the content that was set.

Let me know if you agree that this is a bug and I can open a PR for the fix and review

Steps

Create a form and add <Form.Field>:

<Form>
    <Form.Field id="testId" content="Some content"/>
 </Form>

Expected Result

<form class="ui form">
    <div id="testId" class="field">Some content</div>
</form>

Actual Result

<form class="ui form">
    <div class="field">Some content</div>
</form>

Version

0.88.2

Testcase

https://codesandbox.io/s/semantic-ui-react-9gnsc

[welcome]

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you've completed all the fields in the issue template so we can best help.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

[mattberg88]

Hi, I seemed to have found the solution, may I work on this issue?

[srotbart]

@mattberg88 I've opened PR #3901 for the fix