Dynamic Tags: Styling Controls and Icons Not Rendering – Follow-up(2)

Hello Elementor Team and Community,

I am developing a custom Elementor Dynamic Tag for my plugin and have run into two significant issues related to control rendering. I have previously asked about this in a different context but did not receive a solution, so I am creating this dedicated topic to explain the problem in detail.

I would greatly appreciate any insight from the core team, especially @ricav or @miloss84.

Here are the problems I’m facing:

Issue 1: Styling Controls Generate No CSS

I have added standard Elementor styling controls (color, typography, border, padding, etc.) within the register_controls() method of my Dynamic Tag class. The controls appear correctly in the Elementor editor panel.

However, the CSS defined in the selectors parameter is never output to the page, either on the frontend or in the backend editor preview.

Code Example:

$this->add_control(
        'custom_padding',
        [
            'label' => esc_html__('Padding', 'my-plugin'),
            'type' => \Elementor\Controls_Manager::DIMENSIONS,
            'size_units' => [ 'px', '%', 'em' ],
            'selectors' => [
                '{{WRAPPER}} .women-wc-quick-checkout' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
            ],
        ]
    );

The Problem:
It seems that Dynamic Tags do not have a dedicated wrapper element like Widgets do. Therefore, the {{WRAPPER}} placeholder doesn’t resolve to a unique class, and Elementor’s system for collecting and printing CSS rules for these selectors is not triggered for Dynamic Tags. The entire style management system that widgets use appears to be bypassed.

Issue 2: Icons Render Without CSS Styles

I have added an icon control and am using the recommended Icons_Manager::render_icon() method to output it.

Code Example:

// In register_controls():
$this->add_control(
    'button_icon',
    [
        'label' => esc_html__('Icon', 'my-plugin'),
        'type' => \Elementor\Controls_Manager::ICONS,
    ]
);

// In render():
$settings = $this->get_settings();
$icon = $settings['button_icon'];
\Elementor\Icons_Manager::render_icon( $icon, [ 'aria-hidden' => 'true' ] );

The HTML markup for the icon (e.g., <i class="fas fa-check"></i> or <svg>...</svg>) is generated correctly. However, the necessary CSS stylesheets (for Font Awesome or custom Elementor Icons) are not enqueued. This results in a blank space where the icon should be (for Font Awesome) or a broken SVG path.

The Problem:
It seems the Icons_Manager::enqueue_icon_styles() function, which is automatically called when rendering widgets, is not triggered in the context of a Dynamic Tag’s render() method.

Core Question
Are styling controls and icon managers intended to work within Dynamic Tags in the same way they do for Widgets? If not, what is the recommended alternative for applying styles and rendering icons from within a Dynamic Tag?

If they are intended to work, could you please point me towards the correct method or hook needed to:

1. Force Elementor to parse the selectors and output the corresponding CSS.
2. Ensure that the required icon CSS/JS libraries are loaded when Icons_Manager::render_icon() is called.

Any code snippet, documentation link, or guidance on the proper architecture for this would be immensely helpful. Thank you for your time and for building such a powerful platform.