[Resolved] Wp color picker problem

[David]

Greetings,
A javascript error is occurring in the wp-color-picker library, this is the console message:

Uncaught TypeError: Cannot read properties of undefined (reading 'iris')
    at wp-color-picker-alpha.js?ver=3.0.0:62
    at wp-color-picker-alpha.js?ver=3.0.0:707
(anonymous) @ wp-color-picker-alpha.js?ver=3.0.0:62
(anonymous) @ wp-color-picker-alpha.js?ver=3.0.0:707

Uncaught TypeError: jQuery(...).wpColorPicker is not a function
    at HTMLDocument.<anonymous> (post.php?post=24&action=edit:2354)
    at fire (jquery-1.12.4.js?ver=5.8.2:3232)
    at Object.fireWith [as resolveWith] (jquery-1.12.4.js?ver=5.8.2:3362)
    at Function.ready (jquery-1.12.4.js?ver=5.8.2:3582)
    at HTMLDocument.completed (jquery-1.12.4.js?ver=5.8.2:3617)

This error is causing the generatepress sections created on the pages to not display properly.
I have activated and deactivated the plugins to isolate the one that could give the problem but sometimes it happens with one and sometimes with another, it is not something fixed.

Any idea of What is the problem?

Thanks in advance

[Leo]

Hi David,

So does the issue occur with all plugins disabled except GP Premium?

Also are you referring to the Sections module here?

[David]

Yes, all disabled except GP Premium, and yes, Generatepress module Sections
Thanks

[David]

No idea? This problem does not allow me to edit the sections of my pages
Thanks

[Leo]

Sorry David. This reply slipped under our radar.

Any chance you can start a staging site with all plugins disabled except GP Premium and send us the dashboard login to take a look?

Thanks.

[David]

Hello,
The site is still under development, so you can touch what you deem necessary.
I have seen that it is a conflict between GP Premium and the Advanced Custom Fields plugin and its wp-color-picker Javascript library.

I send you the login data in private.

You can see that if I have the ACF plugin activated and I go to edit the page:
https://www.MYSITE.org.es/new/wp-admin/post.php?post=24&action=edit
The GP sections of the page are not displayed, it is displayed as if it were the classic editor and even if changes are made they are not saved.
However, if I deactivate the ACF plugin and go to edit the page, the sections are displayed and the page can be edited.

Thank you very much!!

[Ying]

Hi David,

The login doesn’t work for me, can you check?

[David]

Sorry, the user is generatesupport

[Elvin]

Hi David,

I’ve tested ACF’s color picker on my site and I didn’t encounter this error.

I’ve also inspected your site and it’s backend seems modified. It’s loading jquery from code.jquery.com instead of the jquery library found on /wp-includes. This is not WP default behavior and is likely caused by a plugin.

Can you disable ALL plugins except GP Premium and ACF and let us have a look?

[David]

Ok, Done!
Thanks!

[Elvin]

I see you have a lot of scripts enqueued on your child theme as well. Can you try temporary deactivating it and check?

Or perhaps try to comment out atleast this enqueued file and try checking again?

add_action( 'admin_enqueue_scripts', 'prefix_admin_scripts' );
  function prefix_admin_scripts() {
     // wp_enqueue_script( 'wp-color-picker' );
      wp_enqueue_script('wp-color-picker', plugins_url('wp-color-picker-script.js', __FILE__ ), array( 'farbtastic' ), false, true );
  }

[David]

Perfect! That add_action was the one that was causing the problem. I have commented it and everything works correctly.
Thank you very much!

[Elvin]

No problem. Glad you got it sorted. 😀

[Author]

Posts