await fixture never resolves when internal properties from firstUpdated() or updated() changes

Question

I want to set some attributes based on the attribute/property passed to my lit web component using one of the two approaches mentioned below: I am writing a test case to test a lit based web component. I am using open-wc/testing fixture

Approaches:

1. When updated() or firstUpdated() changes some internal property of the component (assuming it will cause rerendering), await fixture of the test case does not resolve.
2. When updated() or firstUpdated() never updates any internal property (instead setting properties using querySelectors), await fixture resolves. I find approach 1 to be the cleaner, but unable to write the unit tests of that one. Can someone please help me with this?

Approach 1: `

    @internalProperty()
    _internal_prop
    .
    .
    .
    firstUpdated() {
         if(some condition)
              this._internal_prop = 'updated value';
    }
    render() { return html`<my-component some-attr=${this._internal_prop}></mycomponent>) }

Problem with this approach: await fixture waits forever, and never resolved `

Approach 2: `

    firstUpdated() {
         if(some condition)
              const div = this.querySelector('.class-name');
              div.setAttribute('some-attr', 'updated-value');     
    }
    render() { return html`<my-component class='class-name' some-attr=''></mycomponent>) }

Problem with this approach: await fixture resolves here, but I find approach 1 to be cleaner. `

Why am I not passing prop directly instead of using internal property? I am using some events listening like intersection observer, based on which I need to take decision to update some attributes.