Skip to content

Using with mut results in render error #11

Description

@tstormk

Hello!

Say I have a component Test:
components/test/template.hbs
<div {{did-insert (fn (mut this.element))}} {{will-destroy (fn (mut this.element) null)}} />

When that component is destroyed, it results in the following error:
You modified "element" twice on [object Object] in a single render. It was rendered in undefined and modified in undefined. [...]

If I instead perform the registering/unregistering like so:
components/test/template.hbs
<div {{did-insert this.register}} {{will-destroy this.unregister}} />

components/test/component.js

@action
register(element) {
  this.element = element;
}

@action
unregister() {
  this.element = null;
}

Destroying the component doesn't result in an error.

This happens when mut-ing any property with any value on destroy, by the way, not just an element or a property that has been set before.

For reference, here's the code I used to test it:

{{#if this.show}}
  <Test />
{{/if}}

<Button @onClick={{toggle-action 'show' this}}>Toggle</Button>

Also, I'm not sure it makes any difference, but I'm on a canary build of Ember:
"ember-source": "https://s3.amazonaws.com/builds.emberjs.com/canary/shas/55f876ebc10bd1645e1e62fc5e0408266952259b.tgz"
"ember-cli": "github:ember-cli/ember-cli#ba9e3ea9bcad1c6e2299e40fe265cffe61d7a25b"

Any help would be appreciated!

UPDATE: It works if I use the action helper instead of fn. It also passes if I use ember-fn-helper-polyfill for fn. If I use the Ember 3.11 version of fn however, it fails with the error specified above.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions