TypeError: m is not a function, when extending a class that uses mixins

[Alin Eugen Deac]

It appears that it is not possible to extend a class, which is making use of the mix().

The following illustrates the point (at least when bundling with Webpack, without transpiling)

import { mix } from 'mixwith/src/mixwith';

// A mixin of sorts...
let MyMixin = (superclass) => class extends superclass {

    constructor(){
        super();
        console.log('Mixin');
    }
};

// A class that uses that mixin
class A extends mix(Object).with(MyMixin) {

    constructor(){
        super();
        console.log('Class A');
    }
}

// ...Later, a class that inherits from A
class B extends A {
    constructor(){
        super();
        console.log('Class B');
    }
}

// This fails, ...
let classB = new B();

Location of defect

The issue lies within the MixinBuilder class, in the with method, in that if the superclass is undefined or null, then the method does not handle such exception.

class MixinBuilder {

  constructor(superclass) {
    this.superclass = superclass;
  }

  with() {
    // Here - m might be undefined!
    return Array.from(arguments).reduce((c, m) => m(c), this.superclass);
  }
}

Possible Solution

When editing in the published / bundled source file, I got the above mini-test to work as intended.

class MixinBuilder {

  constructor(superclass) {
    this.superclass = superclass;
  }

  with() {

    return Array.from(arguments).reduce((c, m) => {
      if(typeof m !== "function"){
        return c;
      }

      return m(c);
    }, this.superclass);
  }
}

Please patch as soon as possible

This defect is currently blocking me, because I need to extend a class that I'm not in control of (external dependency), without the usage of mix(). Can you please release a path to this issue, as soon as possible?

[Alin Eugen Deac]

Hi Justin

Due to my dire need for a fix to this defect, I decided to create an adaptation of this package. Please know that I do not mean to steal, discredit or in any ways attempt to insult you by doing such... I just needed a small fix. Furthermore, your name and reference to the original source is clearly stated.
You can review the package in js-mixin.

Once again, I hope that this does not offend you - and I do hope that you can find the time to return to this package, some time in the future.

[tnypxl]

Bump.

[Wills Bithrey]

I've also just hit this issue - Thanks for reporting @aedart.