We’ve found a real stumper of a regression in our app that git bisect says is caused by this commit (https://github.com/emberjs/ember.js/commit/65c20ab632dcd1ecd1256a14fe5ccce83ebc6953) in 3.5.0-beta.3.
We have two components. A property is passed in to the outer component, where we use computed.oneWay to duplicate the property, then pass that into the inner component, where it is used directly (not aliased or mutated). Our setup is similar to what is shown in this Twiddle, though I wasn’t able to repro the bug on Twiddle. The property is computed once with some default values, then again on didInsertElement after we have done some measuring.
In production only, it appears that the property gets set to the default, then updated to the correct final value…then set back to the original (incorrect) value. This only happens in the inner component, even though we just pass the value in directly from the outer component and do not alias it or mutate it in the inner component.
Adding a no-op observer on the oneWay property appears to “fix” the issue, which makes sense given the PR description for that commit (https://github.com/emberjs/ember.js/pull/16978), though I admittedly don’t understand that code well enough to understand the mechanism.
@bekzod any thoughts about what might be going on here? I notice that you authored the commit that caused us issues. To be clear, I'm not blaming your change, it may just be exposing something strange that we're doing in our app.
Will look when I get time for this :)
@gitKrystan pocked around, couldn't reproduce can you post repro project here ?
I have similar issue with Ember version 3.5.1. I have aliased my model using the alias computed helper and whenever the model changes the property is not updating. If I use the model property instead of the alias, everything is working. This is happening only on production as well. It is working correctly in development and the tests are passing as well.
@mupkoo would be nice if you share reproduction repo or make failing test for ember :)
I tried to reproduce it in a new project, but I couldn't.
Here is a snippet from my project
import Controller from '@ember/controller';
import { computed } from '@ember/object';
import { alias } from '@ember/object/computed';
export default Controller.extend({
queryParams: ['page', 'term'],
page: 1,
term: '',
meetings: alias('model'),
isEmptyStateVisible: computed('meetings.[]', 'term', function () {
return !this.term && this.meetings.length === 0;
})
});
{{#unless isEmptyStateVisible}}
{{ search-input value=term onchange=(action "filter") }}
{{/unless}}
{{#each meetings key="id" as |meeting|}}
{{ meeting-item meeting=meeting }}
{{/each}}
If I remove the isEmptyStateVisible computed property, that depends on meetings.[], the list gets re-rendered as expected.
Changing computed('meetings.[]'... to computed('model.[]'... is fixing the problem as well
@chancancode and I are going to look into this either today or Wednesday.
I deployed master since #17487 was merged, and this issue is fixed in our app. 👌
Most helpful comment
Will look when I get time for this :)