I'm using CKEditor gem. It is only used on admin pages. I want to only use it on the pages that require it. I commented out the Sprocket directive in application.js
// only load on required pages // require ckeditor/init
And I add it to the form page at the top
<%= javascript_include_tag 'ckeditor/init' %>
However it only works sometimes. If I reload a page without it, and navigate to a page with it, then it loads the script, but fails to decorate the text box. There are no console errors.
If I reload a page with it, then it succeeds and decorates the text box.
If I reload a page without it, navigate to a page with it, navigate to a page without it, then navigate back to a page with it, then it succeeds and decorates the text box, but gives the console warning
[CKEDITOR] Error code: editor-destroy-iframe.
[CKEDITOR] For more information about this error go to http://docs.ckeditor.com/#!/guide/dev_errors-section-editor-destroy-iframe
That link says
Description: The editor’s could not be destroyed correctly because it had been unloaded before the editor was destroyed. Make sure to destroy the editor before detaching it from the DOM.
I'm pretty sure this is a Turbolinks problem. I would add a $(document).on 'turbolinks:load'
event handler, but I don't know what DOM id to use or how to 'initialize' or 'destroy' CKEditor.
Rails 5.2.2
I tried this, fixing the class and event name https://github.com/galetahub/ckeditor#turbolink-integration
ready = ->
$('.ckeditor_class').each ->
CKEDITOR.replace $(this).attr('id')
console.log("ck'd "+$(this).attr('id'))
$(document).ready(ready)
$(document).on('turbolinks:load', ready)
But it gave a console error
Uncaught ReferenceError: CKEDITOR is not defined
I tried this
$(document).on 'turbolinks:load', ->
setTimeout ->
if CKEDITOR?
$('.ckeditor_class').each ->
CKEDITOR.replace $(this).attr('id')
, 1000
And it works when navigating from a page that doesn't have it to a page that does have it, but when reloading a page that does have it, it gives the console error
Uncaught The editor instance "question_prompt" is already attached to the provided element.
There is no way to know if it has been initialized or not. Ex: CKEDITOR.instances
doesn't have a length
property.