Override static getter in ES6

Asked by At

Assume I have an ES6 mixin like this:

// InputMixin.js
export const InputMixin = (base) => {
  return class Base extends base {

    static get _attribs() {
      return ['autofocus', 'autocomplete', 'form', 'formaction', 'formenctype', 'formmethod', 'formnovalidate', 'formtarget', 'name', 'type', 'value']
    }

    static get properties(){
      var props = {}

      for (let attribute of this._attribs) {
        props[attribute] = {
          attribute,
          reflect: false,
          converter: { fromAttribute: (value, type) => { } }
        }
      }
      return props
    }
  }
}

And a class that uses the mixin, and wants to extend the static getter properties()... how does it actually access it?

// InputButton.js
import { LitElement, html } from 'lit-element'
import { InputMixin } from './InputMixin.js'

class InputButton extends InputMixin(LitElement) {

  static get properties() {
    // How do I access the mixin's properties here?
    // I want to return those, and some extra ones
    debugger
  }

}
customElements.define('nn-input-button', InputButton)

0 Answers