Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

✅ 🐞 Bug Report: Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page - [ED-10146] #21649

Closed
3 of 5 tasks
mirkoappel opened this issue Mar 13, 2023 · 2 comments
Closed
3 of 5 tasks

✅ 🐞 Bug Report: Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page - [ED-10146] #21649

mirkoappel opened this issue Mar 13, 2023 · 2 comments
Labels
bug Indicates a bug with one or multiple components. component/lightbox References any instance and component of Elementor’s Lightbox feature. mod* solved Indicates that an Issue has been Solved, or a Feature Request has been Released. status/merged Indicates when a Pull Request has been merged to a Release. type/styles Indicates when a topic is related to the styles or design of a component. widget/video References the Video widget.
Milestone
3.15.0

Comments

@mirkoappel
Copy link

mirkoappel commented Mar 13, 2023 •
edited by nicholaszein

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

<div class="dialog-widget-content dialog-lightbox-widget-content elementor-aspect-ratio-11 elementor-aspect-ratio-169" style="top: 0px; left: 0px;">
    <a role="button" tabindex="0" aria-label="Schließen (Esc)" href="#" class="dialog-close-button dialog-lightbox-close-button">
        <i class="eicon-close"></i>
    </a>
    <div class="dialog-header dialog-lightbox-header"></div>
    <div class="dialog-message dialog-lightbox-message zoomIn"></div>
    <div class="dialog-buttons-wrapper dialog-lightbox-buttons-wrapper"></div>
</div>

The problem is caused by the .elementor-aspect-ratio-class.

Each dialog widget should have only one .elementor-aspect-ratio class to set the aspect ratio. But in some cases there are two or more of them, so they overwrite each other. This leads to an incorrect aspect ratio of the lightbox video for some videos. In fact, the videos that are clicked second or third get the aspect ratio of the video that was clicked first. It shouldn't be like this!

Steps to reproduce

build it

  1. Place more than one video widget on the page
  2. Enable the lightbox option for each video widget
  3. Give each video widget a different aspect ratio

try it

  1. Click on the first video: The aspect ratio of the lightbox video is correct
  2. Click on the second video: The lightbox video's aspect ratio is incorrect, it will get the aspect ratio of the video that was clicked first

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 following the steps above.

System Info

System Info 
					
== Server Environment ==
	Operating System: Linux
	Software: nginx/1.22.0
	MySQL version: mariadb.org binary distribution v10.4.28
	PHP Version: 7.4.33
	PHP Memory Limit: 128M
	PHP Max Input Vars: 10000
	PHP Max Post Size: 2000M
	GD Installed: Yes
	ZIP Installed: Yes
	Write Permissions: All right
	Elementor Library: Connected

== WordPress Environment ==
	Version: 6.1.1
	Site URL: https://mirkoappel.de
	Home URL: https://mirkoappel.de
	WP Multisite: No
	Max Upload Size: 2 GB
	Memory limit: 128M
	Max Memory limit: 128M
	Permalink Structure: /news/%postname%/
	Language: de-DE
	Timezone: Europe/Berlin
	Admin Email: [REDACTED]
	Debug Mode: Inactive

== Theme ==
	Name: feather
	Version: 1.0
	Author: Mirko Appel
	Child Theme: No

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

== Active Plugins ==
	Admin Columns
		Version: 4.5.5
		Author: AdminColumns.com

	Admin Menu Editor
		Version: 1.10.4
		Author: Janis Elsts

	Advanced Custom Fields PRO
		Version: 5.12.2
		Author: Delicious Brains

	Code Snippets
		Version: 3.2.2
		Author: Code Snippets Pro

	Disable Gutenberg
		Version: 2.9
		Author: Jeff Starr

	DynamicConditions
		Version: 1.6.0
		Author: RTO GmbH

	Ele Custom Skin
		Version: 3.1.7
		Author: Dudaster.com

	Elementor
		Version: 3.11.4
		Author: Elementor.com

	Elementor Pro
		Version: 3.11.5
		Author: Elementor.com

	Extras for Elementor
		Version: 2.2.51
		Author: Namogo

	Intuitive Custom Post Order
		Version: 3.1.4.1
		Author: hijiri

	Page scroll to id
		Version: 1.7.7
		Author: malihu

	Post Types Unlimited
		Version: 1.1
		Author: WPExplorer

	Regenerate Thumbnails
		Version: 3.1.5
		Author: Alex Mills (Viper007Bond)

	WebP Express
		Version: 0.25.5
		Author: Bjørn Rosell

	Yoast SEO
		Version: 20.2.1
		Author: Team Yoast


== Eigenschaften ==
	Custom Fonts: 0
	Custom Icons: 0

== Integrations ==
	


== Elementor-Experimente ==
	Optimierte DOM Ausgabe: Standardmäßig aktiviert
	Verbessertes Laden von Assets: Aktiv
	Verbessertes Laden von CSS: Aktiv
	Inline-Schriftarten-Symbole: Standardmäßig deaktiviert
	Verbesserungen der Zugänglichkeit: Standardmäßig aktiviert
	Zusätzliche benutzerdefinierte Breakpoints: Inaktiv
	admin_menu_rearrangement: Standardmäßig deaktiviert
	Flexbox Container: Aktiv
	Upgrade Swiper Library: Standardmäßig deaktiviert
	Default to New Theme Builder: Standardmäßig aktiviert
	Editor V2: Standardmäßig deaktiviert
	Startseiten: Inaktiv
	Nested Elements: Standardmäßig deaktiviert
	Lazy Load Background Images: Standardmäßig deaktiviert
	Als Standard speichern: Standardmäßig aktiviert
	Page Transitions: Inaktiv
	Notes: Standardmäßig aktiviert
	Loop: Standardmäßig aktiviert
	Form Submissions: Standardmäßig aktiviert
	Scroll Snap: Inaktiv
	Mega Menu: Standardmäßig deaktiviert


== Protokoll ==
	
Log: showing 16 of 162023-02-28 09:20:50 [info] Elementor data updater process has been completed. [array (
  'plugin' => 'Elementor Pro',
  'from' => '3.7.3',
  'to' => '3.11.3',
)]
2023-03-08 18:47:17 [info] elementor::elementor_updater Started 
2023-03-08 18:47:17 [info] Elementor/Upgrades - _on_each_version Start  
2023-03-08 18:47:17 [info] Elementor/Upgrades - _on_each_version Finished 
2023-03-08 18:47:17 [info] Elementor data updater process has been completed. [array (
  'plugin' => 'Elementor',
  'from' => '3.11.2',
  'to' => '3.11.3',
)]
2023-03-08 18:47:17 [info] Elementor data updater process has been queued. [array (
  'plugin' => 'Elementor',
  'from' => '3.11.2',
  'to' => '3.11.3',
)]
2023-03-12 17:32:58 [info] Elementor data updater process has been queued. [array (
  'plugin' => 'Elementor',
  'from' => '3.11.3',
  'to' => '3.11.4',
)]
2023-03-12 17:32:59 [info] elementor::elementor_updater Started 
2023-03-12 17:32:59 [info] Elementor/Upgrades - _on_each_version Finished 
2023-03-12 17:32:59 [info] Elementor/Upgrades - _on_each_version Start  
2023-03-12 17:32:59 [info] Elementor data updater process has been completed. [array (
  'plugin' => 'Elementor',
  'from' => '3.11.3',
  'to' => '3.11.4',
)]
2023-03-14 00:01:45 [info] elementor-pro::elementor_pro_updater Started 
2023-03-14 00:01:45 [info] Elementor Pro/Upgrades - _on_each_version Start  
2023-03-14 00:01:45 [info] Elementor Pro/Upgrades - _on_each_version Finished 
2023-03-14 00:01:45 [info] Elementor data updater process has been completed. [array (
  'plugin' => 'Elementor Pro',
  'from' => '3.11.3',
  'to' => '3.11.5',
)]
2023-03-14 00:01:45 [info] Elementor data updater process has been queued. [array (
  'plugin' => 'Elementor Pro',
  'from' => '3.11.3',
  'to' => '3.11.5',
)]

PHP: showing 10 of 10PHP: 2023-02-28 09:27:09 [notice X 57][/home/wp/disk/wordpress/wp-content/plugins/elementor/core/common/modules/ajax/module.php::175] Undefined index: data [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-02-28 09:29:53 [notice X 7][/home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/theme-builder/classes/conditions-manager.php::168] Undefined index: editor_post_id [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-02-28 09:34:56 [notice X 47][/home/wp/disk/wordpress/wp-content/plugins/elementor/app/modules/import-export/module.php::629] Trying to get property 'label' of non-object [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-02-28 09:34:59 [notice X 69][/home/wp/disk/wordpress/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php::150] Undefined index: condition_type [array (
  'trace' => '
#0: /home/wp/disk/wordpress/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(150): Elementor\Core\Logger\Manager -> rest_error_handler()
#1: ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> normalize_template_json_item()
#2: /home/wp/disk/wordpress/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(120): class type array_map()
#3: /home/wp/disk/wordpress/wp-content/plugins/elementor-pro/core/app/modules/site-editor/data/endpoints/templates.php(59): ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> normalize_templates_json()
#4: /home/wp/disk/wordpress/wp-content/plugins/elementor/data/base/endpoint.php(158): ElementorPro\Core\App\Modules\SiteEditor\Data\Endpoints\Templates -> get_items()
',
)]
PHP: 2023-02-28 23:24:47 [notice X 17][/home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/posts/skins/skin-content-base.php::264] Trying to get property 'ID' of non-object [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-03-02 15:36:28 [notice X 4][/home/wp/disk/wordpress/wp-content/plugins/elementor/includes/frontend.php::1436] Trying to get property 'post_excerpt' of non-object [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-03-04 00:49:57 [error X 1][/home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/theme-builder/classes/conditions-manager.php::295] Uncaught Error: Call to a member function update_meta() on bool in /home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/theme-builder/classes/conditions-manager.php:295
Stack trace:
#0 /home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/theme-builder/classes/conditions-manager.php(168): ElementorPro\Modules\ThemeBuilder\Classes\Conditions_Manager->save_conditions()
#1 [internal function]: ElementorPro\Modules\ThemeBuilder\Classes\Conditions_Manager->ajax_save_theme_template_conditions()
#2 /home/wp/disk/wordpress/wp-content/plugins/elementor/core/common/modules/ajax/module.php(175): call_user_func()
#3 /home/wp/disk/wordpress/wp-includes/class-wp-hook.php(308): Elementor\Core\Common\Modules\Ajax\Module->handle_ajax_request()
#4 /home/wp/disk/wordpress/wp-includes/class-wp-hook.php(332): WP_Hook->apply_filters()
#5 /home/wp/disk/wordpress/wp-includes/plugin.php(517): WP_Hook->do_action()
#6 /home/wp/disk/wordpress/wp-admin/admin-ajax.php(188): do_action()
#7 {main}
  thrown [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-03-07 11:32:45 [notice X 94][/home/wp/disk/wordpress/wp-content/plugins/elementor/includes/controls/groups/image-size.php::110] Trying to access array offset on value of type null [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-03-12 17:33:03 [warning X 1][/home/wp/disk/wordpress/wp-content/plugins/elementor/core/files/manager.php::111] unlink(/home/wp/disk/wordpress/wp-content/uploads/elementor/css/post-17558.css): No such file or directory [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2023-03-12 17:42:53 [notice X 23][/home/wp/disk/wordpress/wp-content/plugins/elementor-pro/modules/dynamic-tags/acf/tags/acf-text.php::33] Undefined offset: 1 [array (
  'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]

JS: showing 16 of 16JS: 2023-02-28 08:27:15 [error X 7][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:1087291] Cannot read properties of null (reading 'getBoundingClientRect') 
JS: 2023-02-28 09:10:26 [error X 598][https://mirkoappel.de/wp-includes/js/jquery/jquery.min.js?ver=3.6.1:2:51824] Cannot read properties of undefined (reading 'replace') 
JS: 2023-03-02 10:37:36 [error X 3][https://mirkoappel.de/wp-content/plugins/elementor/assets/lib/backbone/backbone.marionette.min.js?ver=2.4.5.e1:24:19952] View (cid: "view356") has already been destroyed and cannot be used. 
JS: 2023-03-02 10:44:18 [error X 7][https://mirkoappel.de/wp-admin/post.php?post=16474&action=elementor#:1:1] Identifier '$dcWidgetIdInput' has already been declared 
JS: 2023-03-02 10:48:31 [error X 1][https://mirkoappel.de/wp-content/plugins/elementor/assets/lib/backbone/backbone.marionette.min.js?ver=2.4.5.e1:24:19952] View (cid: "view27440") has already been destroyed and cannot be used. 
JS: 2023-03-02 11:40:47 [error X 115][https://mirkoappel.de/wp-content/plugins/elementor-pro/assets/lib/sticky/jquery.sticky.min.js?ver=3.11.3:1:1162] Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'. 
JS: 2023-03-02 14:05:47 [error X 2][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:931389] Cannot read properties of undefined (reading 'settings') 
JS: 2023-03-03 12:08:55 [error X 2][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:907724] Cannot read properties of undefined (reading 'route') 
JS: 2023-03-04 08:30:07 [error X 4][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:656177] elementorFrontend.elements.window.jQuery is not a function 
JS: 2023-03-04 08:30:07 [error X 4][https://mirkoappel.de/wp-content/plugins/elementor-extras/assets/js/frontend.min.js?ver=2.2.51:1:4462] Cannot read properties of undefined (reading '$previewContents') 
JS: 2023-03-04 23:40:33 [error X 1][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:676196] Cannot read properties of undefined (reading 'get') 
JS: 2023-03-06 10:38:43 [error X 11][https://mirkoappel.de/wp-content/plugins/elementor/assets/lib/backbone/backbone.marionette.min.js?ver=2.4.5.e1:24:19952] View (cid: "view284") has already been destroyed and cannot be used. 
JS: 2023-03-06 10:41:09 [error X 814][https://mirkoappel.de/wp-content/plugins/elementor-pro/assets/js/frontend.min.js?ver=3.11.3:2:10935] Failed to execute 'observe' on 'IntersectionObserver': parameter 1 is not of type 'Element'. 
JS: 2023-03-07 16:31:27 [error X 4][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor.min.js?ver=3.11.2:3:791668] Cannot read properties of undefined (reading 'localized') 
JS: 2023-03-13 18:01:30 [error X 1][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/editor-loader-v1.min.js?ver=3.11.4:2:37] Cannot read properties of undefined (reading 'start') 
JS: 2023-03-13 18:01:30 [error X 1][https://mirkoappel.de/wp-content/plugins/elementor/assets/js/container-converter.min.js?ver=3.11.4:2:5351] elementor is not defined 



== Elementor - Compatibility Tag ==
	
	Elementor Pro: Die Kompatibilität ist nicht angegeben
	Extras for Elementor: Die Kompatibilität ist nicht angegeben

== Elementor Pro - Compatibility Tag ==
@mirkoappel mirkoappel added the status/awaiting_triage Indicates when an Issue, Pull Request, or Discussion awaits to be triaged. label Mar 13, 2023
@nicholaszein nicholaszein changed the title Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page 🐞 Bug Report: Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page - [ED-10146] Mar 15, 2023
@nicholaszein nicholaszein added bug Indicates a bug with one or multiple components. component/lightbox References any instance and component of Elementor’s Lightbox feature. widget/video References the Video widget. type/styles Indicates when a topic is related to the styles or design of a component. and removed status/awaiting_triage Indicates when an Issue, Pull Request, or Discussion awaits to be triaged. labels Mar 15, 2023
@nicholaszein
Copy link
Contributor

Hello @mirkoappel!

Thank you for submitting your issue! 🙏

🏷️ This issue has been labeled and will be forwarded to the team for validation and possible solution. Please keep in mind that we can't provide any ETA on when this issue could be fixed if it is validated. We ask for patience.

Best regards

@nicholaszein nicholaszein added status/merged Indicates when a Pull Request has been merged to a Release. product/3.15 labels Jul 6, 2023
@nicholaszein nicholaszein added this to the 3.15.0 milestone Jul 6, 2023
@nicholaszein nicholaszein changed the title 🐞 Bug Report: Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page - [ED-10146] ✅ 🐞 Bug Report: Video lightbox gets the wrong aspect ratio when more then one video widget is used on the same page - [ED-10146] Aug 2, 2023
@nicholaszein nicholaszein added the solved Indicates that an Issue has been Solved, or a Feature Request has been Released. label Aug 2, 2023
@nicholaszein
Copy link
Contributor

Hello there!

We have great news! 🙌

📢 We're happy to announce that the issue you raised was resolved in Elementor Core v.3.15.0! 🥳

✅ Feel free to check it out and update your plugin to the new version!

Check the changelog for more information:
Changelog of Elementor and Elementor Pro

Cheers 🥂

@elementor elementor locked and limited conversation to collaborators Aug 2, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
bug Indicates a bug with one or multiple components. component/lightbox References any instance and component of Elementor’s Lightbox feature. mod* solved Indicates that an Issue has been Solved, or a Feature Request has been Released. status/merged Indicates when a Pull Request has been merged to a Release. type/styles Indicates when a topic is related to the styles or design of a component. widget/video References the Video widget.
Projects
None yet
Milestone
3.15.0
Development

No branches or pull requests
2 participants
@mirkoappel @nicholaszein