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

Random FormBuilder Form Initialization Errors #53

Open
7 tasks
maplion opened this issue Feb 6, 2018 · 0 comments
Open
7 tasks

Random FormBuilder Form Initialization Errors #53

maplion opened this issue Feb 6, 2018 · 0 comments

Comments

@maplion
Copy link

maplion commented Feb 6, 2018

This is a...

  • feature request
  • [ x ] bug report
  • usage question

What toolchain are you using for transpilation/bundling?

  • [ x ] @angular/cli
  • Custom @ngTools/webpack
  • Raw ngc
  • SystemJS
  • Rollup
  • Other

Environment

NodeJS Version: 8.9.4
Typescript Version: 2.5.3
Angular Version: 5.2.3
@angular-redux/store version: 7.0.2
@angular/cli version: (if applicable): 1.6.5
OS: Windows 10

Expected Behaviour:

Angular form to initialize as normal.

Actual Behaviour:

Upon initializing my form, e.g.:

import { FormBuilder, FormGroup } from '@angular/forms';
. . .
    constructor(private fb: FormBuilder) {
    }

ngOnInit() {
// initialize form
        this.form = this.fb.group({
            firstName: [this.firstName],
            lastName: [this.lastName],
            nameSuffix: [this.nameSuffix],
            middleName: [this.middleName],
            nickName: [this.nickName],
        });
}

it throws a very uninformative error on only some forms during initialization -- some work okay.

Stack Trace/Error Message:

ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'firstName' of null
TypeError: Cannot read property 'firstName' of null
    at Function.State.traverse (state.js:26)
    at Function.State.get (state.js:44)
    at eval (connect-base.js:92)
    at Array.forEach (<anonymous>)
    at ReactiveConnect.ConnectBase.resetState (connect-base.js:90)
    at eval (connect-base.js:43)
    at ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4733)
    at ZoneDelegate.invoke (zone.js:387)
    at Zone.run (zone.js:138)
    at Function.State.traverse (state.js:26)
    at Function.State.get (state.js:44)
    at eval (connect-base.js:92)
    at Array.forEach (<anonymous>)
    at ReactiveConnect.ConnectBase.resetState (connect-base.js:90)
    at eval (connect-base.js:43)
    at ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4733)
    at ZoneDelegate.invoke (zone.js:387)
    at Zone.run (zone.js:138)
    at resolvePromise (zone.js:809)
    at eval (zone.js:861)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4724)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at <anonymous>

Additional Notes:

It took me a while to track down that it was related to a form issue. Once I discovered it was a form issue, I started looking into what had changed. My update to @angular-redux/form 6.7.0 from 6.6.0 seemed to be the culprit. I downgraded and it worked as intended, then upgraded back to 6.7.0 and I get the same "random" error [can't figure out why it works on some forms, but not others -- but the forms it fails on, it fails on every time].

I also found that of the forms that worked, if there were any hidden form elements that I was sending to the store along with other form changes, these were no longer sending to the store as a direct result of this update.

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

1 participant