Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Material-UI TextWidget does not respect the inputType in uiSchema #2057

Closed
3 tasks done
heath-freenome opened this issue Sep 18, 2020 · 5 comments
Closed
3 tasks done
Labels
bug material-ui material-ui related theme issue

Comments

@heath-freenome
Copy link
Member

heath-freenome commented Sep 18, 2020

Prerequisites

Description

Using the stock playground, you can see that for the default theme, the telephone input is of type="tel". Here's the excerpt from the generated html:

<div class="form-group field field-string">
  <label class="control-label" for="root_telephone">Telephone</label>
  <input class="form-control" id="root_telephone" label="Telephone" placeholder="" type="tel" value="">
</div>

When you switch to the material-ui theme, that type is lost. Here's the excerpt from the generated html:

<div class="MuiInputBase-root MuiInput-root MuiInput-underline MuiInputBase-formControl MuiInput-formControl">
  <input aria-invalid="false" id="root_telephone" placeholder="" type="string" class="MuiInputBase-input MuiInput-input" value="">
</div>

Steps to Reproduce

  1. Go to the stock playground
  2. View the source for the Telephone input and see the type="tel" on it
  3. Switch the theme to material-ui
  4. View the source for the Telephone input and DO NOT see the type="tel" on it.

Expected behavior

The material-ui TextWidget will respect the inputType specified in the uiSchema just like the default theme

Actual behavior

The material-ui TextWidget ignores the inputType

Version

"@rjsf/core": "^2.4.0",
"@rjsf/material-ui": "^2.4.0",
@heath-freenome
Copy link
Member Author

Actually, only the default theme and the antd theme respect the inputType

@mdornseif
Copy link
Contributor

Did #2215 fix that?

@heath-freenome
Copy link
Member Author

No... That fix does not respect inputType on the UI:schema. You can tell by simply using the stock playground per my steps above.

@Jisay
Copy link

Jisay commented Sep 13, 2021

Same with bootstrap4 theme

@jacqueswho jacqueswho added bug material-ui material-ui related theme issue labels Apr 11, 2022
@heath-freenome
Copy link
Member Author

Fixed in v5 beta

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug material-ui material-ui related theme issue
Projects
None yet
Development

No branches or pull requests

4 participants