Esprima minification garbles class definitions?

Posted on
  • I have this source code

    class Field {
      constructor(index, buttonsPerLine) {
        console.log("Constructor called");
      }
    }
    
    var f0=new Field(0,3);
    

    When I upload it into the Bangle 2 emulator using the Web IDE, I get "Constructor called" on the console, as expected.

    When I upload it with enabled Esprima minification, I get

    Uncaught ReferenceError: "Field" is not defined
    at line 1 col 61
    ...Constructor called')}}var f0=new Field(0,3)

    When I shrink the source code to simply

    class Field {
      constructor(index, buttonsPerLine) {
      }
    }
    
    var f0=new Field(0,3);
    

    I see the following error message on uploading the minified code:

    Uncaught ReferenceError: "Field" is not defined
    at line 1 col 28
    class a{constructor(a,b){}}var f0=new Field(0,3)

    To me it seems that the Esprima minificator changes the name of the defined class from "Field" to "a" and then cannot find the class "Field" - which is not too surprising…

    Is this expected behaviour? Am I doing something wrong? I'm quite new to Javascript programming but to me the code looks totally reasonable.

    Any help appreciated!
    Best regards,
    Dirk

  • After playing around a bit, I have discovered, that the problem is directly connected to the "Esprima Mangle" option in the Web IDE: If I disable that option, code is transferred correctly.

    Could it be that shortening variable names does not handle class definitions correctly?

  • Could it be that shortening variable names does not handle class definitions correctly?

    That sounds entirely likely. I guess we could report this with Esprima but it feels like it's not very well maintained at the moment :(

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

Esprima minification garbles class definitions?

Posted by Avatar for dirkhillbrecht @dirkhillbrecht

Actions