[Resolved] WordPress 5.5 javascript error on wpColorPickerL10n

[Liviu]

Starting with WordPress 5.5 GP Premium plugins elements and page-header started throwing javascript errors due to missing declaration of wpColorPickerL10n. The full error is below:

Uncaught ReferenceError: wpColorPickerL10n is not defined
at h.<computed>.<computed>._create (color-picker.min.js?ver=5.5:2)
at h.<computed>.<computed>.h.isFunction.a.<computed> [as _create] (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:45)
at h.<computed>.<computed>._createWidget (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:45)
at new h.<computed>.<computed> (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:45)
at HTMLInputElement.<anonymous> (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:45)
at Function.each (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:8)
at n.fn.init.each (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:8)
at n.fn.init.h.fn.<computed> [as wpColorPicker] (load-scripts.php?c=0&load[chunk_0]=underscore,shortcode,utils,jquery,backbone,wp-util,wp-backbone,media-models,moxiejs,plupload,wp-plupload,jquery-ui-core,jquery-u&load[chunk_1]=i-widget,jquery-ui-mouse,jquery-ui-sortable&ver=5.5:45)
at i.ready (load-scripts.php?c=0&load[chunk_0]=mce-view,imgareaselect,image-edit,wp-hooks,heartbeat,customize-base,customize-controls,customize-widgets,accordion,wp-sanitize,c&load[chunk_1]=ustomize-nav-menus,jquery-ui-slider,jquery-touch-punch,iris&ver=5.5:13)
at Object.<anonymous> (load-scripts.php?c=0&load[chunk_0]=mce-view,imgareaselect,image-edit,wp-hooks,heartbeat,customize-base,customize-controls,customize-widgets,accordion,wp-sanitize,c&load[chunk_1]=ustomize-nav-menus,jquery-ui-slider,jquery-touch-punch,iris&ver=5.5:13)

As far as I checked, the faulty JS file is wp-color-picker-alpha.js and its minified counter-part, wp-color-picker-alpha.min.js. Can you please update this in order for it to be fully compatible to 5.5? Right now the graphic customizer in the admin section is unusable due to this.

[Tom]

Hi there,

This is fixed in GP Premium 1.11.0, which is available for download/update in your Dashboard.

Let me know if you need more info 🙂

[Liviu]

Hello, Tom.

Thank you for the fast response, however please note that I’m using version 1.11.2 of the GP Premium plugin. I’ve cleared Autoptimize’s cache to rule out possible caching issues and made sure the browsers doesn’t serve a cached version of the files. I’ve check the files on the server and there are references of the wpColorPickerL10n in three JS files and one PHP file:
gp-premium/elements/assets/admin/wp-color-picker-alpha.js
gp-premium/elements/assets/admin/wp-color-picker-alpha.min.js
gp-premium/page-header/functions/js/wp-color-picker-alpha.min.js
gp-premium/elements/class-metabox.php

[Tom]

We define wpColorPickerL10n in class-metabox.php, as WP 5.5 no longer does by default.

So we still reference that variable in wp-color-picker-alpha.js, however we manually define it to prevent errors: https://www.screencast.com/t/SoiCzQkd3ASe

I’ll have to take a look at Page Headers – that’s a deprecated module, so it may have been missed.

[Liviu]

Tom, I really feel bad about this. The error is not on your side – I’ve just figured this out that it had something to do with my custom logic of creating brotli compressed version of JS files which did not get updated once I updated to 5.5. So basically the browser was receiving old Core WordPress core JS files instead of the new ones, causing the errors reported initially.

I’ve fixed this on my side and now the admin section is working properly again. I will mark this thread as closed, sorry for storming this on you without first checking everything on my side of things.

[Tom]

No worries! Caching can be tricky.

Glad it’s all working now 🙂

[Author]

Posts