Undefined exception when data model has nested keys with array models inside

[KardonskyRoman]

Describe the bug

If data model has several keys which has array models insede of it, initializing one key breaks initializing another key.

However, both work fine separately from each other

Expected-behavior

both buttons should work clicking in any order

Reproduction

https://github.com/KardonskyRoman/hilla_test build-> run-> open HelloWorld view-> click 'Add 1' - > click 'Add 2' -> catch the error:

BinderNode.ts:467 Uncaught TypeError: Cannot read properties of undefined (reading 'previousSimpleConclusion')
    at B2.initializeValue (BinderNode.ts:467:22)
    at new B2 (BinderNode.ts:124:10)
    at b2 (Models.ts:23:26)
    at d4.for (BinderNode.ts:259:24)
    at HelloWorldView.<anonymous> (hello-world-view.ts:143:14)
    at EventPart.handleEvent (lit-html.js:1331:1)

System Info

OS: Windows Hilla: 2.2.2

[KardonskyRoman]

Hilla 2.2.1, 2.2.0 has same issue.

[platosha]

Hi, thanks for the report and the reproduction. So great when issues are easy to reproduce.

I found a workaround here. When I have commented out the inline initialization lines in the button handlers like so:

          // if (!this.binder.value.previousConclusions) {
          //   this.binder.value.previousConclusions =
          //     PreviousConclusionsModel.createEmptyValue();
          //   this.binder.value.previousConclusions.previousConclusion = [];
          // }

... all the buttons started to work for me and it does not throw anymore.

The thing here is, this.binder.value.deep.thing = 'something' does a mutation that the binder cannot detect and update the defaultValue counterpart simultaneously. However, you can do the same using the binder API (this.binder.for(this.binder.model.deep.thing).value = 'something';), and thus enable the binder to handle the initialization correctly.

[KardonskyRoman]

Thank you for the answer! Your suggestion is working on hilla 2.2.2 and I will use it. But since my project was created when current hilla version was 2.1.9 without commented code it threw an exception (I checked it again):

Uncaught TypeError: this.value is not iterable
    at BinderNode.appendItem (BinderNode.ts:264:28)
    at HelloWorldView.<anonymous> (hello-world-view.ts:111:14)
    at EventPart.handleEvent (lit-html.js:1331:1)

That is why I had to initialize array before calling appendItem(). Looks like bugs fixed in 2.2.1 and 2.2.2 improved the behavior.