Caldera Form with Autocomplete (Select2) field causes the Elementor Editor "Style" tab to fail

[mwittmann]

A Caldera Form containing an Autocomplete (Select2) field will cause the Elementor Editor to malfunction. Specifically, the Elementor Editor "Style" tab stops working. When you click on the "Style" tab for any widget on the page (not just the Caldera Form), a javascript error occurs.

Steps to Reproduce

1. Create a Caldera Form with an Autocomplete field.
2. Add the Caldera Form to an Elementor page or post using the Elementor Shortcode widget.
3. Click the "Update" button in Elementor to publish the page or post.
4. Reload (via browser "refresh" or similar) the Elementor Editor page.
5. Click on any element within the Editor (such as a Heading, Section, or Column).
6. Click on the "Style" tab.
7. RESULT: "Style" tab is blank. Browser DevTools console shows javascript error. (See error details below.) The javascript error message indicates an issue trying to initialize the Select2 field.

The problem goes away if you change the Caldera Form field to a regular Dropdown select field (instead of Autocomplete). Note also that the published Elementor page itself is fine, and the Caldera Form works fine on the published page. The Caldera Form also works fine on an plain (non-Elementor) WordPress page.

What Version Of Caldera Forms, WordPress and PHP Are You Using?

WordPress Version: 5.8.3; PHP Version: 7.3.33; MySQL Version: 10.3.23; Caldera Forms Version: 1.9.7

Does Your Issue Persist When You Disable All Other Plugins and Switch To The Default Theme?

Since it entails Elementor and Caldera Forms, both of those plugins need to be enabled. I've disabled all other add-on plugins (such as Elementor Pro, Caldera Forms for CiviCRM, Essential Addons for Elementor, etc.) and the problem persists.

What Is The Unexpected Behaviour?

The "Style" tab is blank, so you cannot change any settings usually available on the "Style" tab.

What PHP Errors Have You Logged While Reproducing This Bug?

None. Not applicable.

What JavaScript Errors Have You Seen While Reproducing This Bug?

editor.min.js?ver=3.6.1:2 Uncaught TypeError: Cannot read properties of undefined (reading '$element')
    at Select2.initSelect2Elements (editor.min.js?ver=3.6.1:2:532894)
    at Select2.onInit (editor.min.js?ver=3.6.1:2:533405)
    at Select2.Module.trigger (common-modules.min.js?ver=3.6.1:2:55029)
    at Select2.T.each.B.<computed> [as trigger] (common-modules.min.js?ver=3.6.1:2:53669)
    at init (common-modules.min.js?ver=3.6.1:2:53830)
    at Select2.Module (common-modules.min.js?ver=3.6.1:2:55107)
    at new child (common-modules.min.js?ver=3.6.1:2:55340)
    at Select2._createSuperInternal (editor.min.js?ver=3.6.1:2:4125)
    at new Select2 (editor.min.js?ver=3.6.1:2:531235)
    at n.applySavedValue (editor.min.js?ver=3.6.1:2:235340)

editor.min.js is located at https://mydomain.org/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.6.1.