Anchors – Error after this.get invocation inside attached component

[marcalexiei]

Description:

Set Ractive.defaults.isolated = false. Attach a component which have a computed property that performs a get on keypath with at least two key. The first key value must be set to null or undefined.

TypeError: Cannot use 'in' operator to search for 'bar' in null.

Versions affected:

• 1.0.0
• 1.0.0-build-190

Platforms affected:

Tested on Safari and Chrome, probably all.

Reproduction:

1. Load this fiddle.
2. Open console.
3. You should be able to see the error.

Ractive.defaults.isolated = false;

const r = window.r = new Ractive({
  template: `
  <h1>A Anchrome try</h1>
  <p>@shared.sharedData inside root component: {{@shared.sharedData}}</p>
  <# mount-point />
  `,
  data: {}
});

r.render('#main').then(async () => {

  const MyAttachedComponent = Ractive.extend({
    template: `
     <h2>B Attached component</h2>
     <p>@shared.sharedData inside attached component: {{@shared.sharedData}}</p>

     {{isFooBar}}
    `,

    data() {
      return {
        foo: undefined,
      };
    },

    computed: {
      isFooBar() {
        const check = this.get('foo.bar');
        return check;
      }
    },
  });

  await r.attachChild(new MyAttachedComponent(), { target: 'mount-point' });
});

[dagnelies]

Looks like missing checks in attachImplicits when attempting to iterate inside "foo"

[evs-chris]

The exception is now fixed on active dev tags. Thanks for the report!