🐞 Bug report: <script> element in custom control content_template moves following elements to bottom of page

[Jonas-360ty]

Prerequisites

• I have searched for similar issues in both open and closed tickets and cannot find a duplicate.
• The issue still exists against the latest stable version of Elementor.

Description

I am creating a custom widget with a custom control. In the custom control in the content_template() function is created a <script> tag where I would console.log some stuff to debug.
example (the custom control is the "basepath" one):

public function content_template() {
        $control_uid = $this->get_control_uid();
		?>
		<div class="elementor-control-field">

			<# if ( data.label ) {#>
				<label for="<?php echo $control_uid; ?>" class="elementor-control-title">{{{ data.label }}}</label>
			<# } #>
                
			<div class="elementor-control-input-wrapper">
                <script>
                    console.log("test")
                 </script>
                <select class="control-select">
                </select>

                <input id="<?php echo esc_attr( $control_uid ); ?>" type="hidden" class = "control-input" data-setting="{{{ data.name }}}"></input>
            </div>

		</div>

		<# if ( data.description ) { #>
			<div class="elementor-control-field-description">{{{ data.description }}}</div>
		<# } #>

		<?php
	}

This results into all the elements that come after the script tag to be inserted at the bottom of the html, where all the others scripts are located.

Steps to reproduce

create a custom control as described in the docs and add it to a widget. (Dont forget to register the control).
Here is a simple control to test:

<?php

class Elementor_Test_Control extends \Elementor\Base_Data_Control {
    public function get_type() {
        return 'test-control';
    }


	public function content_template() {
        $control_uid = $this->get_control_uid();
?>
	<div>
            <p id="control-test-1">im here</p>
            <p id="control-test-2">but im here</p>
        </div>


<?php
	}

}

Using this control should show the 2 paragraphs in the editor.

Now add an <script> tag between the 2 paragraphs:

<?php

class Elementor_Test_Control extends \Elementor\Base_Data_Control {
    public function get_type() {
        return 'test-control';
    }


	public function content_template() {
        $control_uid = $this->get_control_uid();
?>
	<div>
            <p id="control-test-1">im here</p>
            <script></script>
            <p id="control-test-2">but im here</p>
        </div>


<?php
	}

}

now the paragraph is gone from the editor and moved to the bottom of the page.

open the devtools console and execute the document.getElementById("control-test-2") command and check where the element is. You can also right click on it and choose "reveal in elements panel" to view it in the elements panel.

Isolating the problem

• This bug happens with only Elementor plugin active (and Elementor Pro).
• This bug happens with a Blank WordPress theme active (Hello theme).
• I can reproduce this bug consistently using the steps above.

System Info

== Server Environment ==
Operating System: WINNT
Software: Apache/2.4.48 (Win64) OpenSSL/1.1.1k PHP/8.0.7
MySQL version: mariadb.org binary distribution v10.4.19
PHP Version: 8.0.7
PHP Max Input Vars: 1000
PHP Max Post Size: 12800M
GD Installed: No
ZIP Installed: Yes
Write Permissions: All right
Elementor Library: Connected

== WordPress Environment ==
Version: 5.9
Site URL: http://localhost/elementor_plugin_test
Home URL: http://localhost/elementor_plugin_test
WP Multisite: No
Max Upload Size: 13 GB
Memory limit: 512M
Permalink Structure: /%year%/%monthnum%/%day%/%postname%/
Language: de-DE
Timezone: Europe/Vienna
Admin Email: jb@360ty.world
Debug Mode: Active

== Theme ==
Name: Twenty Twenty-One
Version: 1.4
Author: the WordPress team
Child Theme: No

== User ==
Role: administrator
WP Profile lang: de_AT
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36

== Active Plugins ==
360ty Elementor Addon
Version: 1.1.6
Author: 360ty - Multimediafabrik

Elementor
	Version: 3.5.4
	Author: Elementor.com

Enable jQuery Migrate Helper
	Version: 1.3.0
	Author: The WordPress Team

Happy Elementor Addons
	Version: 3.4.0
	Author: weDevs

== Elementor Experiments ==
Optimized DOM Output: Active by default
Improved Asset Loading: Active by default
Improved CSS Loading: Active by default
Inline Font Icons: Inactive by default
Accessibility Improvements: Active by default
Import Export Template Kit: Active by default
Additional Custom Breakpoints: Active by default
Hide native WordPress widgets from search results: Active by default
Landing Pages: Active by default
Color Sampler: Active by default
Favorite Widgets: Active by default
Admin Top Bar: Active by default

== Log ==

PHP: showing 2 of 2PHP: 2022-01-25 11:49:43 [error X 4][C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php::516] Uncaught TypeError: Elementor\Controls_Manager::register(): Argument #1 ($control_instance) must be of type Elementor\Base_Control, string given, called in C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\360ty_Elementor_Addon_Plugin-1.1.6\class-widgets.php on line 103 and defined in C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php:516
Stack trace:
#0 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\360ty_Elementor_Addon_Plugin-1.1.6\class-widgets.php(103): Elementor\Controls_Manager->register('algolia', Object(Elementor_Algolia_Control))
#1 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor360ty\Widgets->register_algolia_control(Object(Elementor\Controls_Manager))
#2 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#3 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#4 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(474): do_action('elementor/contr...', Object(Elementor\Controls_Manager))
#5 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(590): Elementor\Controls_Manager->register_controls()
#6 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(609): Elementor\Controls_Manager->get_controls()
#7 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(766): Elementor\Controls_Manager->get_control('section')
#8 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(419): Elementor\Controls_Manager->add_control_to_stack(Object(Elementor\Core\DocumentTypes\Page), 'document_settin...', Array, Array)
#9 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(1459): Elementor\Controls_Stack->add_control('document_settin...', Array)
#10 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\document.php(1537): Elementor\Controls_Stack->start_controls_section('document_settin...', Array)
#11 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\document.php(585): Elementor\Core\Base\Document->register_document_controls()
#12 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\document-types\page-base.php(61): Elementor\Core\Base\Document->register_controls()
#13 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2253): Elementor\Core\DocumentTypes\PageBase->register_controls()
#14 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(494): Elementor\Controls_Stack->init_controls()
#15 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(300): Elementor\Controls_Stack->get_stack()
#16 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\settings\page\model.php(173): Elementor\Controls_Stack->get_controls()
#17 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2253): Elementor\Core\Settings\Page\Model->register_controls()
#18 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(494): Elementor\Controls_Stack->init_controls()
#19 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(300): Elementor\Controls_Stack->get_stack()
#20 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2340): Elementor\Controls_Stack->get_controls()
#21 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(1099): Elementor\Controls_Stack->sanitize_settings(Array)
#22 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2087): Elementor\Controls_Stack->get_data('settings')
#23 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\base-object.php(142): Elementor\Controls_Stack->get_init_settings()
#24 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\base-object.php(57): Elementor\Core\Base\Base_Object->ensure_settings()
#25 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\settings\page\manager.php(77): Elementor\Core\Base\Base_Object->set_settings('post_status', 'publish')
#26 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\settings\manager.php(151): Elementor\Core\Settings\Page\Manager->get_model_for_config()
#27 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(510): Elementor\Core\Settings\Manager::get_settings_managers_config()
#28 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor\Core\Editor\Editor->enqueue_scripts('')
#29 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#30 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#31 C:\xampp\htdocs\elementor_plugin_test\wp-includes\script-loader.php(2083): do_action('wp_enqueue_scri...')
#32 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): wp_enqueue_scripts('')
#33 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#34 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#35 C:\xampp\htdocs\elementor_plugin_test\wp-includes\general-template.php(3015): do_action('wp_head')
#36 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\editor-templates\editor-wrapper.php(31): wp_head()
#37 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(317): include('C:\xampp\htdocs...')
#38 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(158): Elementor\Core\Editor\Editor->print_editor_template()
#39 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor\Core\Editor\Editor->init('')
#40 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#41 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#42 C:\xampp\htdocs\elementor_plugin_test\wp-admin\admin.php(408): do_action('admin_action_el...')
#43 C:\xampp\htdocs\elementor_plugin_test\wp-admin\post.php(12): require_once('C:\xampp\htdocs...')
#44 {main}
thrown [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2022-01-25 11:54:07 [error X 1][C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php::516] Uncaught TypeError: Elementor\Controls_Manager::register(): Argument #1 ($control_instance) must be of type Elementor\Base_Control, string given, called in C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\360ty_Elementor_Addon_Plugin-1.1.6\class-widgets.php on line 103 and defined in C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php:516
Stack trace:
#0 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\360ty_Elementor_Addon_Plugin-1.1.6\class-widgets.php(103): Elementor\Controls_Manager->register('algolia', Object(Elementor_Algolia_Control))
#1 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor360ty\Widgets->register_algolia_control(Object(Elementor\Controls_Manager))
#2 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#3 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#4 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(474): do_action('elementor/contr...', Object(Elementor\Controls_Manager))
#5 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(590): Elementor\Controls_Manager->register_controls()
#6 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(609): Elementor\Controls_Manager->get_controls()
#7 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\managers\controls.php(766): Elementor\Controls_Manager->get_control('section')
#8 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(419): Elementor\Controls_Manager->add_control_to_stack(Object(Elementor\Core\DocumentTypes\Page), 'document_settin...', Array, Array)
#9 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(1459): Elementor\Controls_Stack->add_control('document_settin...', Array)
#10 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\document.php(1537): Elementor\Controls_Stack->start_controls_section('document_settin...', Array)
#11 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\base\document.php(585): Elementor\Core\Base\Document->register_document_controls()
#12 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\document-types\page-base.php(61): Elementor\Core\Base\Document->register_controls()
#13 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2253): Elementor\Core\DocumentTypes\PageBase->register_controls()
#14 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(494): Elementor\Controls_Stack->init_controls()
#15 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(300): Elementor\Controls_Stack->get_stack()
#16 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\settings\page\model.php(173): Elementor\Controls_Stack->get_controls()
#17 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(2253): Elementor\Core\Settings\Page\Model->register_controls()
#18 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(494): Elementor\Controls_Stack->init_controls()
#19 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\base\controls-stack.php(791): Elementor\Controls_Stack->get_stack()
#20 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\settings\manager.php(152): Elementor\Controls_Stack->get_tabs_controls()
#21 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(510): Elementor\Core\Settings\Manager::get_settings_managers_config()
#22 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor\Core\Editor\Editor->enqueue_scripts('')
#23 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#24 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#25 C:\xampp\htdocs\elementor_plugin_test\wp-includes\script-loader.php(2083): do_action('wp_enqueue_scri...')
#26 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): wp_enqueue_scripts('')
#27 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#28 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#29 C:\xampp\htdocs\elementor_plugin_test\wp-includes\general-template.php(3015): do_action('wp_head')
#30 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\includes\editor-templates\editor-wrapper.php(31): wp_head()
#31 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(317): include('C:\xampp\htdocs...')
#32 C:\xampp\htdocs\elementor_plugin_test\wp-content\plugins\elementor\core\editor\editor.php(158): Elementor\Core\Editor\Editor->print_editor_template()
#33 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(303): Elementor\Core\Editor\Editor->init('')
#34 C:\xampp\htdocs\elementor_plugin_test\wp-includes\class-wp-hook.php(327): WP_Hook->apply_filters('', Array)
#35 C:\xampp\htdocs\elementor_plugin_test\wp-includes\plugin.php(470): WP_Hook->do_action(Array)
#36 C:\xampp\htdocs\elementor_plugin_test\wp-admin\admin.php(408): do_action('admin_action_el...')
#37 C:\xampp\htdocs\elementor_plugin_test\wp-admin\post.php(12): require_once('C:\xampp\htdocs...')
#38 {main}
thrown [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]

JS: showing 2 of 2JS: 2022-01-27 07:40:49 [error X 2][http://localhost/elementor_plugin_test/wp-content/plugins/360ty_Elementor_Addon_Plugin-1.1.6/controls/assets/js/algolia-control.js?ver=5.9:27:36] Cannot read properties of undefined (reading 'algolia')
JS: 2022-01-27 10:29:41 [error X 1][http://localhost/elementor_plugin_test/wp-content/plugins/360ty_Elementor_Addon_Plugin-1.1.6/controls/assets/js/algolia-control.js?ver=5.9:39:24] Cannot read properties of undefined (reading 'ajax')

== Elementor - Compatibility Tag ==

360ty Elementor Addon: Compatible
Happy Elementor Addons: Compatible