paper-dropdown-menu does not closes when click any scrollbars

[mmurugesan]

We are using polymer version 1.9.9 (got this through polymer --version) and TypeScript.

We have 100+ places in our application we used paper-dropdown-menu. Once we clicked the dropdown to expand the item it does not closes as expected if we click / change any scrollbars in the application. If we click any where else other than scrollbars it closes as expected. What could be the reason?

Here is my html code.

{{t('Record template for')}} {{label}}

Here is my TypeScript code (for custom-dropdown-menu.ts):

import { WindowLocation } from "common/window/WindowLocation"; import { CustomWindow } from "windows/views/custom-window";

const paperDropdownMenuConstructor = window.customElements.get("paper-dropdown-menu") as new () => PaperDropdownMenu; export class CustomDropDownMenu extends Polymer.mixinBehaviors([Polymer.IronResizableBehavior, TranslateBehavior], paperDropdownMenuConstructor) { public static get is() { return "custom-dropdown-menu"; }

public constructor() {
    super();
}

public ready() {
    super.ready();

    this.addEventListener("iron-resize", this.resized);
}

public resized() {
    const dockedArea = this.dockedArea(this);
    const alignment = (dockedArea === WindowLocation.dockRight)
        ? "right"
        : "left";

    this.setAttribute("horizontal-align", alignment);
}

private dockedArea(element: HTMLElement) {
    if (element instanceof CustomWindow)
        return (element as CustomWindow).dockedArea;

    return element
        ? this.dockedArea(element.offsetParent as HTMLElement)
        : undefined;
}

public connectedCallback() {
    super.connectedCallback();
}

} window.customElements.define(customDropDownMenu.is, customDropDownMenu);

Since, it generated multiple dropdowns based on the template the div or parent element will have scrollbar. After expanding any dropdown if I adjust the scrollbar to scroll to see other elements the opened values still appears unless until I click anywhere else (other than the scrollbar). I need to close the dropdown even while adjusting the scrollbar also.

Please note, even instead of using the custom-dropdown-menu, i tried directly using the paper-dropdown-menu also in-place of custom-dropdown-menu. But still facing the same issue.

Please suggest the way that I can fix this.

Thanks in advance.

[mmurugesan]

Here is the attached gif. On this while I moving the scroll it is not closing where it should. While clicking other than scrollbar it closes the menu that is correct.

I want to close the menu while clicking/moving scroll also. Please suggest on this.