Ensure firstUpdated is always called when the element first updated

[LostInBrittany]

Reference Issue

Fix #172

As described in #172, the firstUpdated lifecycle method is not always called.

The problem was in the _validate() method of lib/update-element.ts:

  private _validate() {
    // Mixin instance properties once, if they exist.
    if (this._instanceProperties) {
      this._applyInstanceProperties();
    }
    if (this.shouldUpdate(this._changedProperties)) {
      const changedProperties = this._changedProperties;
      this.update(changedProperties);
      const needsFirstUpdate = !(this._updateState & STATE_HAS_UPDATED);
      this._markUpdated();
      if (needsFirstUpdate) {
        this.firstUpdated(changedProperties);
      }
      this.updated(changedProperties);
    } else {
      this._markUpdated();
    }
  }
  private _markUpdated() {
    this._changedProperties = new Map();
    this._updateState = this._updateState & ~STATE_UPDATE_REQUESTED | STATE_HAS_UPDATED;
  }

If shouldUpdated return false, the element is still marked as updated in _markUpdated, but the element isn't updated.
So if the first time the element tries to update shouldUpdated return false, the element is marked as updated. Then when the element is really going to be updated, the check const needsFirstUpdate = !(this._updateState & STATE_HAS_UPDATED); is false, and firstUpdated isn't called.

I have added a new test case to test this problem, and the version 0.6.0-dev.6 doesn't pass it.
Then I have modified lib/update-element.ts with a new _markNotUpdated() method that is called when shouldUpdate returns false, and that doesn't mark the element as updated.

With that fix firstUpdated is always called the first time and all the other tests are still valid.

[justinfagnani]

Awesome patch!

LGTM. cc @sorvell

[LostInBrittany]

Thanks a lot @justinfagnani 😊

[abdonrd]

After this, this should work:

https://github.com/Qiskit/qiskit.org/compare/update-lit-element#diff-b6825d49fa8eff2da7ea9069bb2d19f6

[sorvell]

Thanks for the PR. Good fix, just a small suggestion.

[LostInBrittany]

I am not sure if I have understood, something like ce2e44a?

[sorvell]

Thanks!