md-menu click catcher is fixed to a container.

[shlomiassaf]

Bug, feature request, or proposal:

bug

What is the expected behavior?

The click catcher for md-menu should be applied on the whole screen.

What is the current behavior?

<div class="md-menu-click-catcher"></div>

The click catcher element is located within the menu directive this means that in some situations the fixed viewport is not the body but some element in the DOM tree between the body and the click catcher.
This can happen when an element (ancestor of css catcher) applies CSS transform. When this happen the click catcher will be bound to the element's view port and not the body.

A great example is the SideNav, the sidenav's content element applies a transform: translate3d(0px, 0px, 0px); and when opened the margin-left CSS property reduce's the content size thus reduces the click catcher size, in this scenario clicks over the sidebar navigation are will not trigger a close event. (hovers will works as well... etc)

The menu is rendered in the the overlay container area but its not using the overlay backdrop, I guess since you can't control the styling of the backdrop to make it transparent...

[shlomiassaf]

Another issue related to the click catcher element is when a menu item has a routerLink that tat points to a route that does not exist. This will trigger an exception.

When this happens the click catcher is not removed, if the click catcher is not inside a router outlet (above it) the whole app becomes non responsive (can't click)

[fxck]

related
#998
#1417
#1410

[shlomiassaf]

The issue is really using a backdrop inside the menu content but creating the dom element inside the overlay container.

The right solution is to use the overlay's backdrop and being able to control the backdrop background color

[jelbourn]

The current behavior is just temporary until menu uses the Overlay's backdrop.

[jelbourn]

Closed via #1534

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}