Repeater Issue

[papazetis]

I am creating a plugin using Redux v4.5.0 and it returns an error on console when I am trying to add a new repeater section by clicking "Add"

Error: Uncaught TypeError: Cannot read properties of undefined (reading 'mceInit') on file /redux-core/inc/extensions/repeater/repeater/redux-repeater.js on line 148 editorSettings = window.tinyMCEPreInit.mceInit[firstEditorId];

It looks like the window.tinyMCEPreInit is undefined

I made a quick fix by replacing this line with editorSettings = ( typeof window.tinyMCEPreInit !== 'undefined' ) ? window.tinyMCEPreInit.mceInit[firstEditorId] : '';

[kprovance]

You do understand that you completely ignored what I wrote you on the wp.org forum, correct? Where I asked: I have to say this, because most people choose not to follow the instructions: Please choose the correct selection for your situation. Theme user versus theme developer. Please read the entire block of text in the post window. Please do not skip over it. Please compile the required information and provide all of it in your post. Please do not skip parts or provide a one line sentence.

Even when I ask for people to carefully follow the instructions, they still don't. It blows my mind.

Here they were. This is the data I needed. It's not optional. If you cannot provide it, I cannot help. It's that simple.

Hello, and welcome to Redux Framework! We offer free bug reporting for our software. Since this service is free, we prefer to provide support our way. This means we ask you to first read the entire block of text below. Please do not post a few lines of what you think is wrong. Doing so without the required information below will get your ticket closed without a reply. We're sorry we have to enforce this policy now.

PLEASE, BEFORE YOU POST, READ THIS ENTIRE BLOCK OF TEXT!!!

We require all the information specified below for support. If this text block is ignored or the required data is not provided, your ticket will be automatically closed. NO exceptions. Thank you.

Are you a user reporting a bug with a theme or plugin?

Redux allows developers to include an options panel in their projects. Consequently, we do not offer support for folks who have purchased a theme or plugin that uses Redux. The responsibility of support for themes and plugins falls upon their author. We realize that some authors have included support links for Redux in their projects when they should not have. We apologize for that confusion and are taking steps to remedy that situation.

Please contact the author for support if you have purchased a theme or plugin that uses Redux. If the author is unavailable for help or has discontinued support, please refer to this before posting to our issue tracker: https://devs.redux.io/guides/basics/support-defined.html

Have a development usage question?

The issue tracker isn't the best place for usage questions. This format is not well-suited for questions & answers, and questions here don't have as much visibility as they do elsewhere. Before you ask a question, here are some resources to get help first:

• Read the docs: https://devs.redux.io/
• Look for/ask questions on StackOverflow: https://stackoverflow.com/questions/tagged/redux-framework
• Ask in our community Slack channel: http://slack.redux.io/

Think you found a bug?

Please use the "BUG REPORT" template below. Remember, we are rabid about backward compatibility. Do not submit fixes that break previous ways of doing so, or we will reject them.

Also, we will reject your request unless you provide a Site Health Report. NO exceptions. If you do not include this information, and we close your ticket, please do not ask why. Instructions are listed below.

You MUST use Redux in dev mode when submitting an issue to us. If you are not or have circumvented our dev mode protocol, you are on your own. There could be information in your case that requires dev mode active (Compressed JavaScript, for example. We cannot diagnose issues with compressed JavaScript and why dev mode needs to be enabled).

If an error or notice appears on your screen, please cut and paste it into your issue. PLEASE, do not say you received a critical error' without telling us what the error or notice is. If you do so, the ticket will be closed without a reply.

Before you post, check the JavaScript!

Sometimes, an issue may be tied to JavaScript. To make this determination, you will need to check the JavaScript console. To do this, ensure your web browser is the topmost window. On your keyboard, press CTRL+SHIFT+I. The JavaScript console will open. If there are notices or errors there, please cut and paste them into your issue. We would prefer a cut-and-paste since it will include all pertinent information. Also, Redux dev mode must be enabled so an accurate line number may be reported.

-->

Site Health Report

Instructions: In the WordPress Admin screen, click Tools, select Redux, click Info, and click "Copy site info to clipboard." Paste the results here.

Steps to reproduce

Please list your steps clearly so that we can do the same things you do to reproduce the issue.

Expected Behavior

What did you expect to happen?

Actual Behavior

What actually happened?

Any Error Details (PHP/JavaScript)

Please post any PHP error messages, trace logs, or JavaScript console error messages here

[papazetis]

First of all, congrats for this plugin. It helps me to build my plugin options.
As I said I am creating my own plugin using Redux for plugin options.

Site Health Report

wp-core

version: 6.6.2
site_language: en_US
user_language: en_US
timezone: +00:00
permalink: undefined
https_status: true
multisite: false
user_registration: 0
blog_public: 1
default_comment_status: open
environment_type: development
user_count: 1
dotorg_communication: true

wp-paths-sizes

wordpress_path: D:\laragon\www\plugins
wordpress_size: loading...
uploads_path: D:\laragon\www\plugins/wp-content/uploads
uploads_size: loading...
themes_path: D:\laragon\www\plugins/wp-content/themes
themes_size: loading...
plugins_path: D:\laragon\www\plugins/wp-content/plugins
plugins_size: loading...
fonts_path: D:\laragon\www\plugins/wp-content/uploads/fonts
fonts_size: loading...
database_size: loading...
total_size: loading...

wp-active-theme

name: Twenty Twenty-One (twentytwentyone)
version: 2.3
author: the WordPress team
author_website: https://wordpress.org/
parent_theme: none
theme_features: core-block-patterns, widgets-block-editor, automatic-feed-links, title-tag, post-formats, post-thumbnails, menus, html5, custom-logo, customize-selective-refresh-widgets, wp-block-styles, align-wide, editor-styles, editor-style, editor-font-sizes, custom-background, editor-color-palette, editor-gradient-presets, responsive-embeds, custom-line-height, link-color, custom-spacing, custom-units, widgets
theme_path: D:\laragon\www\plugins/wp-content/themes/twentytwentyone
auto_update: Disabled

wp-plugins-active (1)

Cookie Consent Modal with Bot Detection: version: 1.0.0, author: Nick Papazetis, Auto-updates disabled

wp-plugins-inactive (5)

Plugin Check (PCP): version: 1.2.0, author: WordPress Performance Team and Plugin Review Team, Auto-updates disabled
Polylang: version: 3.6.4, author: WP SYNTEX, Auto-updates disabled
Query Monitor: version: 3.16.4, author: John Blackbourn, Auto-updates disabled
WPML Multilingual CMS: version: 4.6.13, author: OnTheGoSystems, Auto-updates disabled
WPML String Translation: version: 3.2.14, author: OnTheGoSystems, Auto-updates disabled

wp-media

image_editor: WP_Image_Editor_GD
imagick_module_version: Not available
imagemagick_version: Not available
imagick_version: Not available
file_uploads: 1
post_max_size: 2G
upload_max_filesize: 2G
max_effective_size: 2 GB
max_file_uploads: 20
gd_version: bundled (2.1.0 compatible)
gd_formats: GIF, JPEG, PNG, WebP, BMP, AVIF, XPM
ghostscript_version: not available

wp-server

server_architecture: Windows NT 10.0 AMD64
httpd_software: Apache/2.4.54 (Win64) OpenSSL/1.1.1q PHP/8.1.10
php_version: 8.1.10 64bit
php_sapi: apache2handler
max_input_variables: 10000
time_limit: 60
memory_limit: 512M
max_input_time: 60
upload_max_filesize: 2G
php_post_max_size: 2G
curl_version: 7.77.0 OpenSSL/1.1.1q
suhosin: false
imagick_availability: false
pretty_permalinks: true
htaccess_extra_rules: false
current: 2024-11-01T19:31:03+00:00
utc-time: Friday, 01-Nov-24 19:31:03 UTC
server-time: 2024-11-01T19:31:02+00:00

wp-database

extension: mysqli
server_version: 5.7.43
client_version: mysqlnd 8.1.10
max_allowed_packet: 536870912
max_connections: 151

wp-constants

WP_HOME: https://plugins.local
WP_SITEURL: https://plugins.local
WP_CONTENT_DIR: D:\laragon\www\plugins/wp-content
WP_PLUGIN_DIR: D:\laragon\www\plugins/wp-content/plugins
WP_MEMORY_LIMIT: 40M
WP_MAX_MEMORY_LIMIT: 512M
WP_DEBUG: true
WP_DEBUG_DISPLAY: true
WP_DEBUG_LOG: false
SCRIPT_DEBUG: false
WP_CACHE: false
CONCATENATE_SCRIPTS: undefined
COMPRESS_SCRIPTS: undefined
COMPRESS_CSS: undefined
WP_ENVIRONMENT_TYPE: development
WP_DEVELOPMENT_MODE: plugin
DB_CHARSET: utf8
DB_COLLATE: undefined

wp-filesystem

wordpress: writable
wp-content: writable
uploads: writable
plugins: writable
themes: writable
fonts: writable
0: Writable

redux-framework

version: 4.5.0
installation: in_plugin
data directory: D:/laragon/www/plugins/wp-content/plugins/cookie-consent-modal/vendor/redux-framework/redux-core/
browser:
Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Safari/537.36
Browser: Chrome
Version: 130.0.0.0
Platform: Windows

redux-instance-cookie_consent_modal

opt_name: cookie_consent_modal
global_variable: cookie_consent_modal
dev_mode: true
ajax_save: true
page_slug: cookie_consent_modal_options
page_permissions: manage_options
menu_type: submenu
page_parent: options-general.php
compiler: true
output: true
output_tag: true
templates_path: undefined
extensions:
Accordion: 4.3.16
Color Scheme: 4.4.10
Custom Fonts: 4.4.2
Customizer: 4.4.11
Datetime: 4.3.15
Google Maps: 4.4.0
Icon Select: 4.4.2
Import Export: 4.0.0
Js Button: 4.3.16
Metaboxes: 4.2.0
Multi Media: 4.4.1
Options Object: 4.0.0
Repeater: 4.3.13
Search: 3.4.5
Shortcodes: 4.3.6
Social Profiles: 4.3.17
Tabbed: 4.4.8
Taxonomy: 4.4.6
Users: 4.4.1
Widget Areas: 4.3.20

Steps to reproduce

Try to create just a repeater field with some text fields in it. Do not add any other fields outside the repeater.

Expected Behavior

When I click "Add", should give me the option to fill the fields on the next repeater section.

Actual Behavior

It doesn't do anything and returns an error on console.

Any Error Details (PHP/JavaScript)

Error: Uncaught TypeError: Cannot read properties of undefined (reading 'mceInit') on file /redux-core/inc/extensions/repeater/repeater/redux-repeater.js on line 148 editorSettings = window.tinyMCEPreInit.mceInit[firstEditorId];

[kprovance]

@papazetis - Please download v4.5.0.1 from this repo, install it, activate and let me know if your issue is solved. Thanks.

[papazetis]

@kprovance

@papazetis - Please download v4.5.0.1 from this repo, install it, activate and let me know if your issue is solved. Thanks.

Yes it works ok now. Thanks for sorting this out!

[blackandcode]

There is an issue connected to both the Repeater and TinyMCE in the file redux-core/inc/extensions/repeater/repeater/redux-repeater.js, specifically on line 162. The problematic code is as follows:

quicktagsSetting = QTags.getInstance(firstEditorId).settings;

I’m encountering an error:

Uncaught TypeError: Cannot read properties of undefined (reading 'settings')

In my setup, I have multiple repeaters, where some contain a TinyMCE editor, while others do not. The issue arises because the first repeater in the settings does not include a TinyMCE editor. As a result, QTags.getInstance(firstEditorId) returns undefined, causing the settings property to be inaccessible and triggering the error.

Could you help revise this part of the code to handle such cases where the TinyMCE editor might not be present on the first repeater?

[blackandcode]

Here is a fix for this as contribution so you can easily fix it.

I changed just two things in file redux-repeater.js

FIRST CHANGE
Line of code 146
const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );

changed to:
const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );

SECOND CHANGE

Line of code 148
if ( true === window.tinyMCEPreInit ) {

changed to:
if (window.tinyMCEPreInit && window.tinyMCEPreInit.mceInit && window.tinyMCEPreInit.mceInit[firstEditorId]) {

Both changes were nececery in order to make this repeater and editor to work since both were not working properly.

Here is also complete full code at the end

if ( newSlide.find( '.redux-container-editor' ) ) {
    const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );
    
    if (window.tinyMCEPreInit && window.tinyMCEPreInit.mceInit && window.tinyMCEPreInit.mceInit[firstEditorId]) {
    editorSettings = window.tinyMCEPreInit.mceInit[firstEditorId];
    }
  
  $.each(
    newSlide.find( '.redux-container-editor' ),
    function () {
	    // Grab an editor id.
	    let quicktagsSetting;
    
	    items.push( $( this ).attr( 'data-id' ) );
    
	    // Grab an editor settings from wp_editor
	    // Grab a quicktags settings.
	    quicktagsSetting    = QTags.getInstance( firstEditorId ).settings;
	    quicktagsSetting.id = items[items.length - 1];
    }
)

[kprovance]

@blackandcode, I'll take a look at your proposed changes today. I have to ask about this:

Line of code 146
const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );

changed to:
const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );

The two lines are the same. I'm not sure what your proposed change is.

[blackandcode]

I apologize for the confusion earlier. I mistakenly shared a newly added line instead of the current one. The current selector in current version of Redux.io is:

const firstEditorId = $( '.redux-repeater-accordion-repeater:first' ).find( '.redux-container-editor' ).attr( 'data-id' );

The issue with this selector is that it specifically targets the first repeater. However, that repeater might not always contain a redux-container-editor. For example, in my case, I had two repeaters, and the first one did not include a redux-container-editor as it was a simpler one.

This is way i replaced it with
const firstEditorId = parent.find( '.redux-repeater-accordion-repeater' ).find( '.redux-container-editor:first' ).attr( 'data-id' );

[kprovance]

No problem. Thanks for updating. I'll get it a spin now.

[kprovance]

Should now be resolved.