Skip to content

HOC Component : Cannot read property 'getBoundingClientRect' of null #531

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

Closed
vaibhavsah opened this issue Jan 7, 2020 · 1 comment
Closed

Comments

@vaibhavsah
Copy link

vaibhavsah commented Jan 7, 2020

I am rendering a text field, Email as an Higher Order Component (HOC) in a redux-form. It has the React Tooltip attached with it for showing errors. The weird thing is that there are 2 forms with this Email field. In one form, there are other text fields too. In other form, there is only one Email field. Now, the issue is as soon as I click inside this email field, I get a console error,

EmailFieldError

The error is generating from the React Tooltip code, as far as my understanding.
Here is the code of my component:
Email Field
emailField = ({ input, meta, ...props }) => { const emailError: string = props.required ? this.props.formErrors.emailError : ''; const hasError = emailError !== ''; return ( <TextInput name="cof-email" error={hasError ? emailError : ''} showLabel={true} labelCss="col-form-label" labelValue="Email" placeholder="Email" {...input} /> ); };

TextInput Component

<div className={form-group ${error ? 'has-error' : ''}}> {showLabel && label} <input type={type} id={inputId} name={name} className={controlClass} placeholder={placeholder} maxLength={maxLength as any} value={value} onChange={onChange} data-event="focus" data-event-off="blur" data-tip={error} onBlur={onBlur} /> <ReactTooltip place="top" type="error" effect="solid" /> </div>

Call to Email field rendering, conditional if the condition is true

{this.props.checkCondition && <Field name="email" component={this.emailField} required={this.props.required} />}

What can be the reason of this error? One more weird thing is that on first load of this form, there is no error. It comes only when I transition from other form to this form.

@janardhanc
Copy link

Same issue

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

No branches or pull requests

3 participants