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

fix: Clear up DOM warnings #1117

Merged
merged 3 commits into from
Jul 2, 2020
Merged

fix: Clear up DOM warnings #1117

merged 3 commits into from
Jul 2, 2020

Conversation

skvale
Copy link
Contributor

@skvale skvale commented Jul 2, 2020

Description

Warning: Failed prop type: The prop `innerRef` is marked as required in `Popper`, but its value is `undefined`.
    in Popper (created by FormValidationOverlay)
    in FormValidationOverlay (created by InputGroup)
Warning: React does not recognize the `validationState` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `validationstate` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in span (created by InputGroup.Addon)
    in InputGroup.Addon (created by DatePicker)
Warning: Received `false` for a non-boolean attribute `x-out-of-boundaries`.

If you want to write it to the DOM, pass a string instead: x-out-of-boundaries="false" or x-out-of-boundaries={value.toString()}.

If you used to conditionally omit it with x-out-of-boundaries={condition && value}, pass x-out-of-boundaries={condition ? value : undefined} instead.
    in div (created by Popper)
    in Popper (created by Popper)
Warning: React does not recognize the `showToday` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `showtoday` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in div (created by Calendar)
    in Calendar (created by DatePicker)

fixes #issueid

@skvale skvale self-assigned this Jul 2, 2020
@netlify
Copy link

netlify bot commented Jul 2, 2020

Deploy preview for fundamental-react ready!

Built with commit 3397a66

https://deploy-preview-1117--fundamental-react.netlify.app

@@ -45,6 +44,12 @@ class InputGroup extends Component {
{...props}
className={inputGroupClasses}>
{React.Children.toArray(children).map(child => {
if (child && child.type && child.type.displayName === InputGroupAddon.displayName) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we just child?.type?.displayName === InputGroupAddon.displayName

@skvale skvale merged commit 1550e9f into master Jul 2, 2020
@skvale skvale deleted the fix/dom-warnings branch July 2, 2020 19:37
@jizusun
Copy link

jizusun commented Sep 1, 2020

Hi @skvale

I'm wondering why this happens

Warning: React does not recognize the `validationState` prop on a DOM element. 
If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `validationstate` instead. 
If you accidentally passed it from a parent component, remove it from the DOM element.

And why does this PR fixes this.

Can you briefly explain it?
Thanks so much ❤️

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants