[GH-2090] [fluent-ui] fix: Text inputs render with invalid attribute (#2206)

TextWidget generated `<input type="string" ... >`
HTML which is invalid as per
https://html.spec.whatwg.org/multipage/input.html#states-of-the-type-attribute

`<input type="text" ... >` would be apropriate.

The generation of invalid HTML results in undefined behaviour.
I got on the trail of the issue, because
[testing-library/user-event](https://github.com/testing-library/user-event#typeelement-text-options)
acted in strange ways.

This PR results in the generation of valid HTML and updates the tests.

fix #2090

Author: mdornseif

packages/fluent-ui/src/TextWidget/TextWidget.tsx

@@ -69,6 +69,8 @@ const TextWidget = ({
   }: React.FocusEvent<HTMLInputElement>) => onFocus(id, value);
 
   const uiProps = _pick(options.props || {}, allowedProps);
+  const inputType = schema.type === 'string' ?  'text' : `${schema.type}`
+
   return (
     <TextField
       id={id}
@@ -78,7 +80,7 @@ const TextWidget = ({
       disabled={disabled}
       readOnly={readonly}
       name={name}
-      type={schema.type as string}
+      type={inputType as string}
       value={value ? value : ""}
       onChange={_onChange as any}
       onBlur={_onBlur}

packages/fluent-ui/test/__snapshots__/Array.test.tsx.snap

@@ -258,7 +258,7 @@ exports[`array fields fixed array 1`] = `
                       onInput={[Function]}
                       readOnly={false}
                       required={true}
-                      type="string"
+                      type="text"
                       value=""
                     />
                   </div>

packages/fluent-ui/test/__snapshots__/Form.test.tsx.snap

@@ -387,7 +387,7 @@ exports[`single fields string field regular 1`] = `
             onFocus={[Function]}
             onInput={[Function]}
             readOnly={false}
-            type="string"
+            type="text"
             value=""
           />
         </div>

packages/fluent-ui/test/__snapshots__/Object.test.tsx.snap

@@ -59,7 +59,7 @@ exports[`object fields object 1`] = `
                   onInput={[Function]}
                   readOnly={false}
                   required={false}
-                  type="string"
+                  type="text"
                   value=""
                 />
               </div>