Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Provide Alternatives to "Meta" Programming for observers and computed properties #4543

Closed
ChadKillingsworth opened this issue Apr 18, 2017 · 3 comments

Comments

@ChadKillingsworth
Copy link
Contributor

Observers and computed properties currently require string values. This hides them from most static analysis engines and refactoring tools. They are also difficult to use with Closure-compiler's advanced mode as properties get renamed.

Need to provide an alternative way to use these property effects that does not depend on strings.

Simple Observers

This is the easiest fix. Allow a function to be specified directly instead of just a string.

class FooElement extends Polymer.Element {
  static get is() { return 'foo-element'; }
  static get properties() {
    return {
      bar: {
        type: String,
        observer: FooElement.prototype.barChanged_
      }
    }
  }
  barChanged_(newValue, oldValue) {
    console.log(newValue, oldValue)
  }
}

Complex Observers and Computed Properties

These are grouped together because they suffer from the same problem: change notification. A computed property is best defined as an ES6 getter and a complex observer is already an instance method. The only thing needed is change notifications from properties that these methods depend on. This isn't hard to wire up manually with a simple observer and calls to notifyPath, but it could be a bit easier.

Is there perhaps a way to express the dependency in reverse?

class FooElement extends Polymer.Element {
  static get is() { return 'foo-element'; }
  static get properties() {
    return {
      bar: type: String
    }
  }
  static get observers() {
    return [{
      path: 'bar',
      observer: 'helloBar'
    }, {
      path: 'bar',
      observer: FooElement.prototype.barIsHello
    }];
  }
  static get helloBar() {
    return this.bar + ' hello';
  }

  /** @return {boolean} */
  barIsHello() {
   if (/ hello$/.test(this.bar)) {
     return true;
   }
   return false;
  }
}
@ChadKillingsworth
Copy link
Contributor Author

ChadKillingsworth commented Aug 26, 2017

#4574 takes care of the simple observer issue.

#4815 allows ES6 getters to be used instead of computed properties. I'm going to run some tests and make sure, but I think that linkPaths should provide a way to indicate that changes on one path should recalculate the getter value. This solves the computed properties use case.

For complex observers, there is no obvious solution. However perhaps it is acceptable to leave these as-is so as to discourage their use.

@stale
Copy link

stale bot commented Mar 13, 2020

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the wontfix label Mar 13, 2020
@stale
Copy link

stale bot commented Apr 16, 2022

This issue has been automatically closed after being marked stale. If you're still facing this problem with the above solution, please comment and we'll reopen!

@stale stale bot closed this as completed Apr 16, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants