[Bug] Deloser throws error when a form has an input with name `id`

[Kevin Mees]

https://github.com/microsoft/tabster/blob/master/src/Deloser.ts#L299

This check has a false positive for forms with an input named id since element.id will point to the input element in the form.

Sandbox for reproduction: https://codesandbox.io/s/agitated-khorana-hzqyu2?file=/src/index.tsx

[tsingson]

in Deloser.ts line 299:

    if (element.id) {
        selector.push(
            "#" + element.id.replace(escapeRegExp, escapeReplaceValue)
        );
    }

change to

    if (element.id) {
        const  el = element.id.toString();
        selector.push(
            "#" + el .replace(escapeRegExp, escapeReplaceValue)
        );
    }

will ignore error, but maybe need more testing.

[Lennard Göckener]

I have added a pull request to resolve this, as I had come across this bug as well.

Using getAttribute should be a more robust approach to retrieving the element's id.

see: #287

PS: @tsingson

in Deloser.ts line 299:

    if (element.id) {
        selector.push(
            "#" + element.id.replace(escapeRegExp, escapeReplaceValue)
        );
    }

change to

    if (element.id) {
        const  el = element.id.toString();
        selector.push(
            "#" + el .replace(escapeRegExp, escapeReplaceValue)
        );
    }

will ignore error, but maybe need more testing.

This will make the error go away, but you're still unable to retrieve the id of the form (el would be [object HTMLFormElement])