Issue loading code in sandbox on v2.01.17

Posted on
  • Not sure if you can help, but I get an error running a custom js module from the sandbox/modules folder and I've been scratching my head for hours working out why. Particularly when it worked using a previous version of Espruino.

    I'm using a

    require('testingModule')
    

    command to load the testingModule.js file and it loads fine, however when it executes a function in that module I get the following error:

    With module minification on:

    Uncaught Error: Function "initSymbol" not found! at line 1 col 3
    m.initSymbol();m.initSymbol();m.initSymbolIterator();m.initS...
    in function "makeIterator" called from line 1 col 105 ...var
    d="",k=m.makeIterator(e),f=k.next();!f.done;f=k.next())d...

    With module minification off:

    Uncaught ReferenceError: "$jscomp" is not defined at line 1 col 150
    ...(var $jscomp$iter$0=$jscomp.makeIterator(data),$jscomp$key$x...
    in function called from system

    The function uses an AT command to connect the module to the server using TCP.

    I know there are no issues with the function, because when I include it in the build (/libs/js), it works and executes that function without any errors.

    What is really odd is that there is no "initSymbol", "makeIterator" or "$jscomp" inside my code at all. Not in this module or any other application code that I've written.

    This same sandbox functionality was working when I was using an older version of Espruino.

  • Usually, the module name is without file extension (.js). What is the exact name of the module in the file system?

    I usually use only no or just simple minification until I'm done w/ development. Then I go to the google closure compiler, paste in the source from my sandbox' modules folder, run the compile and copy-paste the result 'back' into the .min.js file in my sandbox' modules folder.

  • I am actually using the name without the file extension, sorry about writing it wrong in my post. [edited now]
    Even if that was the problem, it would give me an error saying it failed to load it. This loads it but then crashes on execution.

    I also run it without minification until I'm done w/development. I was developing this particular module months ago in the sandbox, and thought I was done and minified it and added it to the build. (the file in question is a board file, specifying the lower level AT commands of a custom board).

    However, I need to update the file, so I am going back to tweak it, but the sandbox version no longer works because of some error. Even without the minification, I'm still getting an error which looks similar to what closure compiler would give. (I've noticed $jscomp is a variable in the closure compiler, so I shouldn't expect to see this if my code isn't minified.)

  • What happens when you run your source through the google closure compiler at https://closure-compiler.appspot.com/home w/ simple minification?

  • The same thing:

    Uncaught ReferenceError: "$jscomp" is not defined
     at line 1 col 150
    ...(var $jscomp$iter$0=$jscomp.makeIterator(data),$jscomp$key$x...
                                  ^
    in function called from system
    

    But when I use it as code inside the build - as in I've rebuilt the .hex firmware file including the module in source code, it works.

  • The IDE is still minifying for you by the look of it, and presumably you're using the ES6 features that it is trying to transpile to ES5.

    And you're certain that in Setting, both 'Minification' AND 'Module Minification' are set to 'No Minification'?

    Do you have a testingModule.min.js file that's also in the directory? By default the IDE looks for that file first.

  • I figured out the issue.
    Modules as functions cant be ticked. If its unticked it works fine, if it doesnt, then it comes up with an error regarding $jscomp.initSymbol or $jscomp.makeIterator.

    If I use closure compiler to minify my code, these variables are not part of the code, which confused me, but when I did a dump() I could see that these variables were in the code that was uploaded, and were causing problems. Since unchecking the modules as functions box its stopped producing the error and allows my code to execute.

    According to the webIDE this function is still in BETA, so I'm not sure if this feedback will be useful in order to fix it for upcoming releases.

  • Thanks for the update.

    Can you share the code you're uploading? And exactly what minification settings you're using?

    The Web IDE definitely doesn't insert $jscomp.etc - that is all added by the closure compiler, most likely when you're using ES6 code as it's trying to transpile it down to ES5. You can try it by going to https://closure-compiler.appspot.com and trying to minify a = () => { console.log(this); }.

    So if you were to disable all minification, I imagine it would work just fine. Did you try that at all?

  • I just tested it with minification off and that seems to be correct. with all minification off it works. (with or without modules as functions enabled).

    I would rather not share the code I'm uploading, aside from being over 2000 lines, it will be used for a proof of concept and includes some proprietary information that I'd have to remove before uploading. Sorry. I know its easier to help when you have the full code.

    As for the minification settings: Its working fine using "Simple Optimizations", as long as "modules as functions" is not checked.
    If it is checked then I need to use "No minification".
    Using "Simple optimizations" or "Whitespace Only" results in the $jscomp error above.

    But I'm not using the functionality from "modules as functions", so it can remain unchecked for my project.

    So it seems that $jscomp is inserted when transpiling ES6 -> ES5.
    That makes sense because I am using ES6 code, making use of the arrow notation which seems to be transpiled to ES5 in the Closure Compiler.

    Just as an experiment, I have used an ES6 aware minifier, which doesn't transpile the arrow notations. This has worked and has produced code smaller than the closure compiler minifier. (4900 vs 4600 bytes).

  • Thanks for the update. This is actually something we're looking at - @opichals has already added support for using 'Terser' to GitHub. It's not available in the default Web IDE yet but I'll hopefully do a new IDE release that includes it really soon now.

    The issue you're having is that 'Modules as Functions' inserts the modules into the main code as functions rather than Strings, which means the minifier actually starts minifying them and you get the errors.

    You'd hope that closure could be configured to allow certain bits of ES6 but not others, but I haven't been able to do that yet. Perhaps just having a beta option to run Closure with ES6 output would be fine for most cases.

  • I'm currently using the "JS & CSS Minifier" extension on VSCode. It works excellently, minimizes to ES6 and I've had no issues so far.
    https://github.com/olback/es6-css-minify

    Thanks for clarifying how the modules as functions behaves, that makes sense to me now.

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

Issue loading code in sandbox on v2.01.17

Posted by Avatar for Nadnerb @Nadnerb

Actions