CKEditor doesn't work only in production env

Question

I'm using the ckeditor ruby gem (v4.2.2) in my Rails app and it works fine in development but not in my production environment. It doesn't look like a problem with my Asset Pipeline because all other assets load without any issues.

On the page, Google Chrome gives me this error:

Uncaught TypeError: Cannot set property 'dir' of undefined

while Firefox just throws this in the console:

TypeError: c[a] is undefined[Learn More]

What I've tried so far:

Use Uglifier.new(mangle: false) as the JS Compressor in Sprockets
Manually set CKEDITOR_BASEPATH

The asset files generated by rake asset:precompile in public/assets/ckeditor all have a hash at the end like this:

ckeditor-e0b9bfe15298d2b2dd388960b27d35e6a18c89b2390f8986d398c30da5496e4b.js
config-1fb318e1cc0eea7b8c181941c3c1f09d2b96107b2f7ff4891755fbb2201ba53d.js
contents-4540cf2cb7116b32bac2995494c4fc0c55804444f37c02cfa11256bd695e4194.css
# etc

but the JS doesn't seem to be loading them and trying to fix that now.

Code

My Javascript File:

//= require pages-javascript
//= require ckeditor/init
//= require_tree ./ckeditor
//= require_self

Assets Initializer:

# config/initializers/assets.rb
Rails.application.config.assets.version = '1.0'

Rails.application.config.assets.precompile << Proc.new do |filename, full_path|
  if filename =~ /\.(css|js|svg|eot|woff|ttf)\z/
    app_assets_path = Rails.root.join('app', 'assets').to_s
    if full_path.starts_with? app_assets_path
      Rails.logger.info "including asset: " + full_path
      true
    else
      Rails.logger.info "excluding asset: " + full_path
      false
    end
  else
    false
  end
end

Rails.application.config.assets.precompile += %w( ckeditor/* )

I see you prepared a manifest file for ckeditor specifically, right? — Joel Blum, Feb 11 '17 at 07:57

score 2 · Accepted Answer · answered Feb 11 '17 at 08:28

2

Going through the Library Issues and Pull Requests on Github, turns out it wasn't an issue with my code but a bug in the 4.x.x versions of the Ruby Gem itself (causing incompatibilities with Rails 5).

Someone already opened an issue and a PR fixing this was also merged to master 2 months ago, but there were no releases after it containing the patch. So my temporary solution is to load the gem directly from master:

gem 'ckeditor', github: 'galetahub/ckeditor', ref: '11d3a5b'

answered Feb 11 '17 at 08:28

Sheharyar

73,588
21
168
215

1

And wasted 10+ hours trying to 'fix' this. – Sheharyar Feb 11 '17 at 08:28
I had this issue on 4.2.2. Updating to 4.2.4 solved issue. – Artem P Aug 24 '17 at 19:35

score 1 · Answer 2 · edited Feb 12 '17 at 12:33

1

Have you tried to load the ckeditor separately? Try to load it without your bundling to see If the library is loading correctly. From the console output I see that some files are not loaded, probably the bundling/minification doesn't work as it should be for those files. Load the ckeditor files in the <head> to see if that way everything works.

edited Feb 12 '17 at 12:33

Mr Lister

45,515
15
108
150

answered Feb 11 '17 at 07:53

Pavlin Marinov

89
3

Yes, as stated in the question, it works normally. This is an issue with how assets are compressed in production and the frontend client is unable to load them. – Sheharyar Feb 11 '17 at 07:57
So just separate the ckeditor from your bundling. I almost every time separate the external libraries from my bundling because they gives me an errors and headaches. You never know how those libraries are implemented. – Pavlin Marinov Feb 11 '17 at 08:01

CKEditor doesn't work only in production env

What I've tried so far:

Code

2 Answers2