Enable rails js_compressor `:uglifier`

[dakotalightning]

When trying to edit in production. I'm getting errors in production Uncaught TypeError: this.element.tagName is not a function on the concat/uglifier source

[cstro]

Hi,

I'm sure I had this issue when my files where being concatenated in the wrong order. Do you get the issue if you add the content tools library before the rest of your JavaScript?

[anthonyjb]

Hi @dakotalightning - when does the error occur? The moment you start editing, when you first select an element or on some other action?

Also I'm assuming this is a custom build process, does the error occur if you include content-tools.js as a separate <script> tag on the page? If so can you post that error as it may help in identifying where the code is failing, if not could you describe the build process a bit more, if it's grunt can you post it here?

[dakotalightning]

@anthonyjb It occurs when I select an element for edit, no the error doesn't happen when I include content-tools.js as a separate <script> tag.

The build is rails :uglifier

@CJStroud thanks, it appears to be still throwing the error.

[dakotalightning]

Update: I pulled it out of the compile pipeline app.js and placed it on the page in a separate <script> both content-tools.min.js and editor.js.

Im still getting the errors

content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7 
  Uncaught TypeError: this.element.tagName is not a function
    ContentTools.TagUI.e.mount @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    ContentTools.InspectorUI.e.updateTags @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    (anonymous function) @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    ContentEdit.Node.t.trigger @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:5
    ContentEdit.Element.e.focus @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:5
    ContentEdit.Text.e.focus @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    ContentEdit.Element.e._onMouseDown @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    ContentEdit.Text.e._onMouseDown @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    (anonymous function) @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6

content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7 
  Uncaught TypeError: Cannot read property 'removeChild' of null
    ContentTools.ComponentUI.t.unmount @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    ContentTools.InspectorUI.e.updateTags @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    (anonymous function) @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:7
    ContentEdit.Node.t.trigger @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:5
    ContentEdit.Element.e.blur @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:5
    ContentEdit.Text.e.blur @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    ContentEdit.Element.e.focus @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:5
    ContentEdit.Text.e.focus @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    ContentEdit.Element.e._onMouseDown @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    ContentEdit.Text.e._onMouseDown @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6
    (anonymous function) @ content-tools.min-ed3bd097d02a3e3d9e22ff0eb2beb8001bf0ab7a0f5f06cb8dadeae1a4bb578d.js:6

[anthonyjb]

I don't have much experience with rails, is it possible to disable the uglify step in the build to identify if that step is causing the issue?

[dakotalightning]

So it was the config.assets.js_compressor = :uglifier that was the issue.

[anthonyjb]

We use uglify in the grunt build script to generate the content-tools.min.js library, it appears to me that rails uglifier is (https://github.com/lautis/uglifier) is a wrapper for the same library so my guess is something in the configuration, potentially the default configuration is different from the config used to uglify in the projects pipeline.

Can you provide information about the version of ugifier your using and the settings for your project please?

[anthonyjb]

Reading around on the web it might be a good idea to try disable mangle_names which I think might be on by default.

[dakotalightning]

So looking at the grunt build for content-tools.min.js, I changed the settings to config.assets.js_compressor = Uglifier.new(:mangle => false). It works as it should now. This probably isn't ideal since this is for the whole js asset pipeline, maybe moving towards a mangle safe build?

Shaving yaks again ...

[anthonyjb]

Whilst I like the introspective nature of JS it appears I'm abusing it with the use of constructor.name - and in quite a number of places. Some of these cases can be changed relatively easily, others need a bit more thought but having done a little reading on the subject I think in hindsight this was a poor decision on my part and should be rectified.

@dakotalightning Thanks for you help in whittling down the issue.

[dmshvetsov]

@anthonyjb I have the same issue with my project. Do you plan any actions towards resolving this issue. Can I offer any help?

[anthonyjb]

Hi @shvetsovdm - I started work on this issue last night and have a local version of ContentEdit working with mangled names (shaves nearly 30kb off the minified source too :) ). I need to get some additional tests in place and make a few changes to ContentTools but I'm confident I'll have the fix in place today/tonight.

[dmshvetsov]

@anthonyjb it's just awesome, thanks!

[dmshvetsov]

838c09b resolves problem of rails uglification :beers: @anthonyjb

[dakotalightning]

:+1: Confirmed