Ember.js delay in passing object properties to child component after setting them in parent

I'm working in Ember 3.1.4.

In keeping with the DDAU pattern, I have a set setProperty action in my controller, which simply accepts the property name and the value to set it to, and then does so.

I then pass the action into my component, and I can call it to set a property at the controller level, and then pass the property back down into the component.

When setting a property to a string, it works as expected and if I get the property immediately after calling the setProperty action, it returns the new value (As when setting simpleProp below).

Strangely, when I use setProperty to set a property to an empty object, or to set a child property on an object, the property returns undefined if I get it immediately after calling the action, but returns the new value if I use a setTimeout of 1 millisecond.

What causes this, and is there a way I can prevent this from happening?

Setting a property to an empty object

Controller

setProperty: function(property, value) {
  this.set(property, value);
},

my-component.js

didInsertElement() {
  this.setProperty('parentObject', {});
  console.log(this.get('parentObject')); // undefined
  setTimeout(() => {
    console.log(this.get('parentObject')); // {}
  }, 1);
  this.set('simpleProp', 'foo');
  console.log(this.get('simpleProp')); // 'foo'
}

Template

Setting a child property on an existing object

Controller

init() {
  this._super(...arguments);
  this.parentObject = {};
}
setProperty: function(property, value) {
  this.set(property, value);
},

my-component.js

didInsertElement() {
  this.setProperty('parentObject.childProp', 'bar');
  console.log(this.get('childProp')); // undefined
  setTimeout(() => {
    console.log(this.get('childProp')); // 'bar'
  }, 1);
  this.set('simpleProp', 'foo');
  console.log(this.get('simpleProp')); // 'foo'
}

Template