Buslowicz / twc

TypeScript based, boilerplate-less, Polymer toolbox friendly Polymer Modules
32 stars 1 forks source link

TypeScript mixin is not transformed as a complete Polymer module definition #97

Closed tpluscode closed 6 years ago

tpluscode commented 7 years ago

A mixin in TypeScript can be defined as a function returning class containing properties and methods

Expected behavior

Properties are transformed to the static get properties method.

Actual behavior

Only methods are copied to the output file.

Example

type Constructor<T> = new(...args: any[]) => T;

export function MyMixin<T extends Constructor<{}>>(Base: T) {
    return class extends Base {
        some: String;

        _abstract() {

        }

        static _static() {

        }
    }
}

produces

function MyMixin(Base) {
  return class extends Base {
    _abstract() {}
    static _static() {}
  };
}
Buslowicz commented 7 years ago

Need a hand with the decision by which mixin should be transformed into Polymer Mixin. We can have something like that:

function Mixin<T extends Constructor>(Super: T) {
  @Mixin()
  class Mixin extends Super {
    test: number;
  }
  return Mixin;
}

This however requires that:

This would not allow to to a shorthand syntax:

const Mixin = <T extends Constructor>(Super: T) => class Mixin extends Super {
  test: number;
};

We could also use a JSDoc to mark mixins for transformation, which would match exactly how Polymer Tools require it:

/**
 * @mixinFunction
 * @polymer
 */  
const Mixin = <T extends Constructor>(Super: T) =>
  /**
   * @mixinClass
   * @polymer
   */
  class Mixin extends Super {
    test: number;
  }

or with marking just the function:

/**
 * @mixinFunction
 * @polymer
 */  
const Mixin = <T extends Constructor>(Super: T) => class Mixin extends Super {
  test: number;
}

What looks properly? Or should we have all of the above working?