[Bug] 3.20.6+ regression: two-way binding no longer works for classic components

[EvgenyOrekhov]

🐞 Describe the Bug

Starting with Ember 3.20.6, two-way binding no longer works when using classic components and tracked properties.

🔬 Minimal Reproduction

Minimal reproduction: https://github.com/Axcient/ember-bug
This commit adds the example, a test case, and uses Ember 3.20.5 which works correctly: Axcient/ember-bug@9b45acc
This commit upgrades Ember to 3.20.6, and the example and the test stop working correctly: Axcient/ember-bug@ef7918c

😕 Actual Behavior

When clicking on the checkbox, the "NOT checked" text doesn't change.

🤔 Expected Behavior

When clicking on the checkbox, the "NOT checked" text should change to "checked".

🌍 Environment

• Ember: 3.20.6 (and any later version)
• Node.js/npm: 14.16.0/6.14.11
• OS: Windows
• Browser: Chrome, Firefox

➕ Additional Context

We have a real-world project that uses that kind of two-way data binding extensively, and we can't upgrade Ember to 3.20.6 or any later version because it breaks ~30% of our components and tests.

[EvgenyOrekhov]

It just occurred to me that maybe it's incorrect to call this example "two-way binding". Sorry if I'm using terms incorrectly.

[pzuraq]

The PR which caused this change is this one: #19138

I believe the specific issue is that prior to this change, tracked properties were not part of the computed property system fully, and when updated with set() they would trigger an explicit notifyPropertyChange. This leads to a split in behavior, if you use set() or toggleProperty() then the two way binding worked, but if you set the tracked property directly it would not.

This was not intended behavior in the first place, and adding a full notifyPropertyChange() to tracked properties would introduce more overhead and specifically change the semantics around sync/async observers, which we want to avoid. Removing tracked properties from the computed-property system could cause a number of issues, so I don't think should revert that portion of the change either. Given that, I don't believe we should restore this functionality. If you want to use two-way-binding with classic components, then you should use classic idioms such as Ember.set() without @tracked.

[EvgenyOrekhov]

Removing @tracked from my-checkbox.js:8 indeed fixes the example.

Thanks, @pzuraq! I will try this with our production components and see how it goes.

[sandstrom]

Closing for reason in #19461 (comment)