[Menu] Having multiple menuItems adds inline width to MenuList

[sairamdevarashetty]

I have found the following code in menulist.js, can I know why it exists ?

if (list && element.clientHeight < list.clientHeight) {
        var size = (0, _scrollbarSize2.default)() + 'px';
        // $FlowFixMe
        list.style.paddingRight = size;
        // $FlowFixMe
        list.style.width = 'calc(100% + ' + size + ')';
      }

[sairamdevarashetty]

Before :

After :

[oliviertassinari]

This piece of logic is here in order to handle scroll bar positioning issue. However, I'm wondering if that's really needed. Have you tried commenting the logic?

[sairamdevarashetty]

I just did and the width is full as supposed to be ,

After Commenting the code :

[sairamdevarashetty]

but for now I just added the following code to fix it

                           <Menu
	                        id="choose-mobility-name"
	                        anchorEl={this.state.anchorEl}
	                        open={this.state.openMenu}
	                        style={{
	                        	maxHeight:"inherit"
	                        }}
			        		MenuListProps={{
	                            style:{
	                              width: this.state.widthOfMenuItem
	                            },
	                            className:"sairam",
	                        }}
	                    >

[oliviertassinari]

I have changed the behavior. Now the user style takes precedence over the internal scroll logic handling.