New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable rails js_compressor `:uglifier` #95

Closed
dakotalightning opened this Issue Jan 12, 2016 · 15 comments

Comments

Projects
None yet
4 participants
@dakotalightning

dakotalightning commented Jan 12, 2016

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

errors

@dakotalightning dakotalightning changed the title from Uncaught TypeError: this.element.tagName is not a function, on concat source on production to Uncaught TypeError: this.element.tagName is not a function, on concat source on production #bug Jan 12, 2016

@dakotalightning dakotalightning changed the title from Uncaught TypeError: this.element.tagName is not a function, on concat source on production #bug to Uncaught TypeError: this.element.tagName is not a function Jan 12, 2016

@CJStroud

This comment has been minimized.

Show comment
Hide comment
@CJStroud

CJStroud Jan 12, 2016

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?

CJStroud commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 12, 2016

Member

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?

Member

anthonyjb commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@dakotalightning

dakotalightning Jan 12, 2016

@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 commented Jan 12, 2016

@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

This comment has been minimized.

Show comment
Hide comment
@dakotalightning

dakotalightning Jan 12, 2016

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

dakotalightning commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 12, 2016

Member

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?

Member

anthonyjb commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@dakotalightning

dakotalightning Jan 12, 2016

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

dakotalightning commented Jan 12, 2016

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

@dakotalightning dakotalightning changed the title from Uncaught TypeError: this.element.tagName is not a function to Enable rails js_compressor `:uglifier` Jan 12, 2016

@anthonyjb

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 12, 2016

Member

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?

Member

anthonyjb commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 12, 2016

Member

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

Member

anthonyjb commented Jan 12, 2016

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

This comment has been minimized.

Show comment
Hide comment
@dakotalightning

dakotalightning Jan 12, 2016

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 ...

dakotalightning commented Jan 12, 2016

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 anthonyjb added the bug label Jan 12, 2016

@anthonyjb

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 12, 2016

Member

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.

Member

anthonyjb commented Jan 12, 2016

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.

@shvetsovdm

This comment has been minimized.

Show comment
Hide comment
@shvetsovdm

shvetsovdm Jan 13, 2016

Contributor

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

Contributor

shvetsovdm commented Jan 13, 2016

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

@anthonyjb

This comment has been minimized.

Show comment
Hide comment
@anthonyjb

anthonyjb Jan 13, 2016

Member

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.

Member

anthonyjb commented Jan 13, 2016

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.

@shvetsovdm

This comment has been minimized.

Show comment
Hide comment
@shvetsovdm

shvetsovdm Jan 13, 2016

Contributor

@anthonyjb it's just awesome, thanks!

Contributor

shvetsovdm commented Jan 13, 2016

@anthonyjb it's just awesome, thanks!

@anthonyjb anthonyjb closed this in 838c09b Jan 13, 2016

@shvetsovdm

This comment has been minimized.

Show comment
Hide comment
@shvetsovdm

shvetsovdm Jan 14, 2016

Contributor

838c09b resolves problem of rails uglification 🍻 @anthonyjb

Contributor

shvetsovdm commented Jan 14, 2016

838c09b resolves problem of rails uglification 🍻 @anthonyjb

@dakotalightning

This comment has been minimized.

Show comment
Hide comment
@dakotalightning

dakotalightning Jan 14, 2016

👍 Confirmed

dakotalightning commented Jan 14, 2016

👍 Confirmed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment