Skip Navigation

Open

Reported for: WPML Multilingual CMS 4.6.11

Topic Tags: Bug

Overview of the issue

If you are using the Language Switcher Gutenberg block and its Dropdown click option, you will notice that when clicking outside the dropdown area, it won’t be close as expected.

Workaround

Please, make sure of having a full site backup of your site before proceeding.

  • Open …/wp-content/plugins/sitepress-multilingual-cms/classes/block-editor/Blocks/LanguageSwitcher/Render.php file.
  • Look for line 123.
  • Replace:
    				if ( $dpFirstItem ) {
    					$dpFirstItem->setAttribute(
    						'onclick',
    						"(()=>{const ariaExpanded = this.children[0].getAttribute('aria-expanded');
    					this.children[0].setAttribute('aria-expanded', ariaExpanded === 'true' ? 'false' : 'true');})(this);"
    					);
    				}
    
  • With:
    if ($dpFirstItem) {
        $dpFirstItem->setAttribute(
            'onclick',
            "(()=>{
                const ariaExpanded = this.children[0].getAttribute('aria-expanded');
                this.children[0].setAttribute('aria-expanded', ariaExpanded === 'true' ? 'false' : 'true');
                
                if (ariaExpanded !== 'true') {
                    const expandedItem = this;
                    const closeExpandedItem = (event) => {
                        if (!expandedItem.contains(event.target)) {
                            expandedItem.children[0].setAttribute('aria-expanded', 'false');
                            document.removeEventListener('click', closeExpandedItem);
                        }
                    };
                    document.addEventListener('click', closeExpandedItem);
                }
            })(this);"
        );
    }
    

Leave a Reply

Please stay on topic and be respectful to others. If you need help with issues not related to this post, use our Support Forum to start a chat or submit a ticket.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>