0.7.3: Keypath lookup triggering Uncaught TypeError: Cannot read property 'str' of undefined

[mrjoelkemp]

My attempts at creating a fiddle to reproduce haven't been successful. I'm curious if anyone knows of a situation that would cause the data to be there in .get() but not .get('values'). I could then try to craft an example around that situation.

The component throwing the error is invoked by a parent ractive instance as follows:

<MultiSelectDropdown values="{{styles.text.title.font_label}}" />

The keypath styles.text.title.font_label exists in the parent ractive instance which, to my understanding, rules out the possibility of an ambiguous binding. I'm not entirely certain if this is a bug in Ractive.

Happy to provide any additional, helpful details.

[evs-chris]

How are you using the mapping in the component? Ambiguity can happen at the use site too, so ~/values would be unambiguous inside the component template.

[mrjoelkemp]

I was using this.get('values') at two places (both of which fail): in a computed property and in a method called within oncomplete.

The computed property returned this.get('values').join(', ');. The method within oncomplete calls this.get('values') but transforms the data for use in other parts of the component.

I'm not familiar with the ~/ syntax at all, but will check the docs more closely.

[mrjoelkemp]

So it looks like the this.get('.values') worked but I'm unclear as to why. Happy to move this to a stack overflow post if you'd prefer.

Thanks for your help thus far @evs-chris.

[martypdx]

Looks like same as #1962

@mrjoelkemp Are you using a keypath expression like {{foo[bar]}} ?

[mrjoelkemp]

@martypdx I wasn't entirely sure it was a similar issue, but thanks for confirming.

Are you using a keypath expression like {{foo[bar]}} ?

No, but I'm fairly convinced that there is ambiguity in the call site. I just need to figure out how that ambiguity is manifested.

Will close this issue as it's a userland error and not a ractive issue.

Thanks for your help in pointing me in the right direction.

[mrjoelkemp]

For posterity sake, I'm also getting Uncaught TypeError: Cannot read property 'firstKey' of undefined.

Will report back with a solution or additional findings for others experiencing a similar issue.

[mrjoelkemp]

Turns out that the issue is related to having 2 copies of the Ractive library loaded.

I have one internal library (called Poet) that has a distributable that bundles Ractive 0.7.3 (not all consumers are guaranteed to have Ractive). The consuming app (called Network) for this internal library also uses Ractive (for custom components outside of Poet), so it has its own version of 0.7.3 loaded.

The Network defines a ractive instance that uses one of Poets components. This somehow causes the keypath resolutions to error out.

I confirmed that this is the issue by copying that Poet component into the Network proper (not causing the keypath resolution error).

Not sure if #2066 would solve this. Any additional insight as to why this happens would be very appreciated.

So glad to have found the cause.