Repeatable TinyMCE error • Piklist Support

Tagged: tinymce add-more repeatable editor

This topic has 12 replies, 3 voices, and was last updated 5 months, 1 week ago by Steve.

Viewing 12 reply threads

Author

Posts

July 31, 2020 at 3:26 pm #10769

Participant

Hi,
When I make the TinyMCE classic editor repeatable, dynamically added editors don’t work. Only after publishing and refreshing the post they behave properly.
The developer console displays the following error:

Uncaught TypeError: Cannot read property 'length' of undefined
    at r (wp-tinymce.js?ver=4960-20190918:3)
    at Ky (wp-tinymce.js?ver=4960-20190918:3)
    at bw (wp-tinymce.js?ver=4960-20190918:3)
    at ww (wp-tinymce.js?ver=4960-20190918:3)
    at Aw (wp-tinymce.js?ver=4960-20190918:3)
    at tN.<anonymous> (wp-tinymce.js?ver=4960-20190918:3)
    at Array.<anonymous> (wp-tinymce.js?ver=4960-20190918:3)
    at qt (wp-tinymce.js?ver=4960-20190918:3)
    at u (wp-tinymce.js?ver=4960-20190918:3)
    at Di.loadScripts (wp-tinymce.js?ver=4960-20190918:3)

I’m honestly stumped where to begin solving this problem, and I couldn’t find anything helpful in earlier forum posts. Can anyone help?

Thanks!

July 31, 2020 at 3:31 pm #10770

Steve
Keymaster

@cobaltmg– Are you using WordPress 5.X? If so, are you using the Classic Editor plugin?

Classic Editor
July 31, 2020 at 3:32 pm #10771

Max
Participant

Now that’s a quick response! The answer is yes to both.
July 31, 2020 at 3:38 pm #10772

Steve
Keymaster

Please post all the code in your parts file. I’d like to see if I can reproduce.

July 31, 2020 at 3:57 pm #10775

Max

Participant

The code from my file located at /parts/meta-boxes/

<?php
/*
Title: Inhoud
Post Type: page
Hide for ID: 17, 20
*/

piklist('field', array(
  'type' => 'group'
  ,'list' => false
  ,'required' => true
  ,'add_more' => true
  ,'template' => 'field'
  ,'fields' => array(
    array(
      'type' => 'text'
      ,'field' => 'text'
      ,'label' => 'Titel'
      ,'columns' => 12
    )
    ,array(
      'type' => 'editor'
      ,'field' => 'inhoud'
      ,'label' => 'Inhoud'
      ,'options' => array(
        'media_buttons' => true
        ,'drag_drop_upload' => true
        ,'tinymce' => array(
          'extended_valid_elements' => 'span[!class],code[!class],a[!href|target=_blank],*[style=]'
          ,'invalid_styles' => 'display,color'
          ,'invalid_elements' => '*[style]'
          ,'block_formats' => 'Paragraph=p;Heading 3=h3;Heading 4=h4;Heading 5=h5;Heading 6=h6'
          ,'paste_auto_cleanup_on_paste' => true
          ,'paste_remove_spans' => true
          ,'paste_remove_styles' => true
          ,'toolbar1' => 'bold italic underline bullist numlist link unlink cut copy paste undo redo'
          ,'toolbar2' => 'formatselect strikethrough indent outdent pastetext removeformat charmap searchreplace'
        )
      )
    )
  )
));

July 31, 2020 at 3:59 pm #10777

Max

Participant

Firefox outputs an even longer error message:

Uncaught TypeError: t is undefined
    r ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Ky ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    ww ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Aw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    u ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    qt ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    u ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    loadScripts ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    loadQueue ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    waitFor ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    u ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    qt ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    u ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    loadScripts ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    loadQueue ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Bw ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    Ow ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    render ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    n ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    e ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    qt ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    e ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    bind ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    M ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    init ~wp-includes/js/tinymce/wp-tinymce.js?ver=4960-20190918:3
    r ~wp-admin/js/editor.min.js?ver=5.4.2:2
    process_field ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:327
    process_fields ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:101
    _init ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:88
    PiklistFields ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:61
    piklistfields ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:924
    jQuery 2
    piklistfields ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:916
    re_index ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:1640
    action_handler ~wp-content/plugins/piklist/parts/js/piklist.js?ver=1.0.9:1495
    jQuery 2
wp-tinymce.js:3:259914

July 31, 2020 at 4:10 pm #10778

Steve

Keymaster

Have you tried removing some of these options and see if that fixes it?

,'tinymce' => array(
          'extended_valid_elements' => 'span[!class],code[!class],a[!href|target=_blank],*[style=]'
          ,'invalid_styles' => 'display,color'
          ,'invalid_elements' => '*[style]'
          ,'block_formats' => 'Paragraph=p;Heading 3=h3;Heading 4=h4;Heading 5=h5;Heading 6=h6'
          ,'paste_auto_cleanup_on_paste' => true
          ,'paste_remove_spans' => true
          ,'paste_remove_styles' => true
          ,'toolbar1' => 'bold italic underline bullist numlist link unlink cut copy paste undo redo'
          ,'toolbar2' => 'formatselect strikethrough indent outdent pastetext removeformat charmap searchreplace'
        )

July 31, 2020 at 4:21 pm #10780

Max
Participant

Just tried removing all options, including tinymce. Also deactivated all other plugins besides Piklist and the Classic Editor. Still the same error.

P.S. I really appreciate your attention!
July 31, 2020 at 7:17 pm #10781

Steve
Keymaster

Which version of WordPress are you running? I’m going to try and reproduce.
August 1, 2020 at 5:51 am #10782

Max
Participant

I’m running WordPress 5.4.2, Piklist 1.0.9, Classic editor 1.5.

I’m able to reproduce the bug in different browsers (Chrome, Firefox, Edge) and different servers (local XAMMP & online). Enabling or disabling browser extensions (e.g. uMatrix) also has no effect.
August 3, 2020 at 1:31 pm #10788

Steve
Keymaster

@cobaltmg– I was able to reproduce the message. Unfortunately, this is not such an easy fix and probably won’t be available until Piklist 2.0 which we are currently working on.
February 19, 2021 at 8:42 pm #11143

alexd
Participant

just to be clear, does this mean currently on WP 5X, there is currently no way to run a WYSIWYG in an add_more field?
is there any kind of known work around?
February 20, 2021 at 9:32 am #11146

Steve
Keymaster

This is a known issue with WYSIWYG fields and WP 5.X. We are not aware of a workaround.

Author

Posts

Viewing 12 reply threads

You must be logged in to reply to this topic.

Topic: Repeatable TinyMCE error

Piklist v0.9.9.8 is now available

Piklist is now on HackerOne

Topic: Repeatable TinyMCE error

Stay up-to-date with Piklist