NO BUG: Nav Menu Nestable dropdown does not appear properly in 1.9

[d19dotca]

Browser: Safari
OS: macOS
URL: Staging site running with Bricks 1.9

I noticed in the only staging website where I have used the new Nav Menu Nestable element, that the dropdown menu does not appear correctly, showing far too narrowly after upgrading to 1.9 from 1.8.6. Screenshots below…

In 1.8.6, it looked like this:

In 1.9, it looks like this:

This is after clearing all the caches and regenerating the CSS files as part of troubleshooting, and visiting the page in a different browser too. When narrowing this down further, unclear if this is related but I noticed that there were some changes to the Nav Menu Nestable code in the frontend-min.css file with reference to this line of code while comparing with a diff checking tool…

In 1.8.6:

.bricks-nav-menu>li>a,#brx-header.sticky>.brxe-block,#brx-header.sticky>.brxe-container,#brx-header.sticky>.brxe-div,#brx-header.sticky>.brxe-section{transition:inherit}#brx-header.sticky.slide-up{-ms-overflow-style:none;overflow-x:hidden;scrollbar-width:none;transform:translateY(-101%)}#brx-header.sticky.slide-up::-webkit-scrollbar{display:none}.brx-header-right

In 1.9:

.bricks-nav-menu>li>a,#brx-header.sticky>.brxe-block,#brx-header.sticky>.brxe-container,#brx-header.sticky>.brxe-div,#brx-header.sticky>.brxe-section{transition:inherit}#brx-header.sticky.slide-up{-ms-overflow-style:none;overflow-x:hidden;scrollbar-width:none;transform:translateY(-101%)}#brx-header.sticky.slide-up::-webkit-scrollbar{display:none}#brx-header.sticky.sliding{overflow:hidden}.brx-header-right

The only step I took to reproduce was simply upgrade to 1.9 from 1.8.6. When I downgrade back to 1.8.6 the Nav Menu Nestable dropdown looks perfect again, so this definitely seems related to Bricks changes in 1.9.

This seems like a bug to me, or at least there doesn’t appear to be a detailed changelog entry for such a change (nothing I’d have assumed would modify this behaviour). Would appreciate your insights into this and if it’s confirmed to be a bug then hopefully it can be resolved in the next release. Thank you in advance.

[aslotta]

Hey @d19dotca,

thanks for your report.

You’ve set a CSS selector for your mega menu that does not exist:

After changing it to a valid one (I chose .brxe-container for my test) everything works as expected:

We’ve already implemented a fix that accounts for invalid selectors. But ultimately this is a user error.

Best,

André

[d19dotca]

Question then, @aslotta … why did the selector disappear when upgrading to 1.9? Because it must have existed when it was at 1.8.6, right? Thats presumably why it appeared correctly in 1.8.6. Or am I misunderstanding that? In other words, with no changes at all, how can it display properly in 1.8.6 but not in 1.9, if it’s a selector issue? Doesn’t this mean that the selector name was changed during the upgrade? Isn’t at an issue?

[tole011]

You are not the only one… Same problem with mega menu.

[aslotta]

Hey @tole011,

some more details would help a lot to track down a possible issue.

Can you maybe share a URL with us? Are you using a custom selector? Did you make sure that this CSS selector is valid / the target element exists?

Best,

André

[aslotta]

Hey @d19dotca,

no. The selector must not have existed before. The logic changed in Bricks 1.9. And the pre 1.9 logic might have been more “forgiving”.

But as I already wrote in my previous comment we‘ve prepared a fallback for cases where users insert invalid selectors or selectors for non-existing elements.

Best,

André

[d19dotca]

I’ll run some tests to verify this. I’m pretty sure I remember having to use a selector in order for it to appear wide before on 1.8.x (I wanted it as wide as the header itself and had to use that selector I’m pretty sure), so that’s why I’m thinking this is still a bug in 1.9 if that selector was suddenly removed or changed. But perhaps I’m misremembering. I’ll run some tests and report back. I appreciate the help.

[tole011]

Hey André,

Sorry, I’ve already fixed it. I’ve had a custom selector and after upgrading to 1.9, the selector changed.
This is URL: https://radni.simpo.rs

Best regards,
Goran

[d19dotca]

@aslotta

no. The selector must not have existed before. The logic changed in Bricks 1.9. And the pre 1.9 logic might have been more “forgiving”.

This appears to be correct. I had explicitly specified a selector of #brxe-a0e1e6 in 1.8 but it appears that even in 1.8 that selector never existed (I likely received a new auto-generated selector when replacing some elements in the design process) even though it still worked fine in 1.8. If I set the CSS Selector in the Mega Menu section of the Dropdown element to a selector that exists currently, it then shows as expected again in 1.9.

Thank you for your assistance on this. I’m curious though… was there a changelog entry for this? Was it the one in 1.9 titled “Nav nestable: Nested mega menu wrong position”? If yes, this is another example of a changelog entry that doesn’t really yield much information or details as to what was changed or what users should expect when upgrading, and these extra details would be helpful in the changelog entries. There was no link for it or anything with extra details, assuming that’s even the right one. Please consider this in the future for the changelog entries.