Clobbering a volatile computed property causes 'Maximum call stack size exceeded' in 3.6+

[jordanbyron]

Hi ya'll,

I'm experiencing an issue when overriding a property on a component which is computed + volatile. Here is a minimal example which reproduces the problem. This cropped up when we upgraded our app to from 3.5 to 3.6.

// app/components/random-number.js

import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
  randomNumber: computed(function() {
    return Math.random();
  }).volatile()
});

// app/templates/components/random-number.hbs

<span class="random-number">{{randomNumber}}</span>

// tests/integration/components/random-number-test.js

import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';

module('Integration | Component | random-number', function(hooks) {
  setupRenderingTest(hooks);

  test('it renders a random number', async function(assert) {
    // This throws a `Uncaught RangeError: Maximum call stack size exceeded` error
    //   at descriptorFor (meta.js:683)
    //   at set (metal.js:1992)
    //   at ComputedProperty.clobberSet (metal.js:2412)
    //   at ComputedProperty.set (metal.js:2399)
    //   at set (metal.js:1995)
    //   at ComputedProperty.clobberSet (metal.js:2412)
    //   at ComputedProperty.set (metal.js:2399)
    //   at set (metal.js:1995)
    //   at ComputedProperty.clobberSet (metal.js:2412)
    //   at ComputedProperty.set (metal.js:2399)
    //
    await render(hbs`{{random-number randomNumber=1234}}`);

    assert.dom('.random-number').exists();
  });
});

You can download the full example project here: https://github.com/jordanbyron/ember-3-6-volatile-bug

It only seems to be happening on volatile properties. Any help would be appreciated. 🙏

[bekzod]

thanks, fixed in #17431