Users unable to edit content in CKEditor

[waynedyck]

On some pages the following error being thrown which results in users not being able to edit their content in CKEditor:

Uncaught TypeError: Cannot read property 'length' of undefined
    at Object.create_element (focal_point.js:2038)
    at Object.replaceTokenWithPlaceholder (focal_point.js:1795)
    at prepareDataForWysiwygMode (plugin.js?t=E6FC:138)
    at a.<anonymous> (plugin.js?t=E6FC:211)
    at a.h (ckeditor.js:10)
    at a.CKEDITOR.event.CKEDITOR.event.fire (ckeditor.js:11)
    at a.CKEDITOR.editor.CKEDITOR.editor.fire (ckeditor.js:13)
    at a.setData (ckeditor.js:230)
    at f (ckeditor.js:997)
    at Object.wysiwyg (ckeditor.js:999)

[waynedyck]

focal_point.js:2038

      // Apply link_text if present.
      if ((info.link_text) && (info.fields.external_url.length === 0)) {
        $('a', element).html(info.link_text);
      }

Why is the external_url property not available?

[waynedyck]

Disabling the Media CKEditor (media_ckeditor) module allows one to see the content. It appears that the external_url field is missing from existing content inserted using Media CKEditor.

Inserting content with version 7.x-2.1 generates the following:

[[{"fid":"20820","view_mode":"default","fields":{"format":"default","field_file_image_alt_text[und][0][value]":false,"field_file_image_title_text[und][0][value]":false,"external_url":""},"type":"media","field_deltas":{"1":{"format":"default","field_file_image_alt_text[und][0][value]":false,"field_file_image_title_text[und][0][value]":false,"external_url":""}},"link_text":null,"attributes":{"height":387,"width":400,"class":"media-element file-default","data-delta":"1"}}]]

However, existing content inserted with I assume the previous version of Media CKEditor generated this instead:

[[{"fid":"20820","view_mode":"default","fields":{"format":"default","field_file_image_alt_text[und][0][value]":false,"field_file_image_title_text[und][0][value]":false},"type":"media","field_deltas":{"1":{"format":"default","field_file_image_alt_text[und][0][value]":false,"field_file_image_title_text[und][0][value]":false}},"link_text":null,"attributes":{"height":387,"width":400,"class":"media-element file-default","data-delta":"1"}}]]

The difference is the fields map. The latest version of Media CKEditor appears to include a new "external_url" key after the "field_file_image_title_text[und][0][value]" key.

Adding the missing "external_url" key into the existing media content and re-enabling the Media CKEditor module allows the content to be edited normally.

[waynedyck]

The culprit is not the Media CKEditor module but the Media module.

The code which is causing the issue is in media/modules/media_wysiwyg/js/media_wysiwyg.filter.js

302      // Apply link_text if present.                                                                                                                     
303      if ((info.link_text) && (info.fields.external_url.length === 0)) {
304        $('a', element).html(info.link_text);
305      }

The problem was created with issue #2881204 and introduced into the codebase with commit 8f41957.

The commit appears to have been pushed out with the release of media 7.x-2.6 but was not included in the release notes.

[waynedyck]

New issue #2884412 was created to add a config option for adding embedded links to make it optional.

Commit 45c2fad fixes the error in line 303 to the following,

-      if ((info.link_text) && (info.fields.external_url.length === 0)) {
+      if ((info.link_text) && (!info.fields || !info.fields.external_url || info.fields.external_url.length === 0)) {

making the field optional.