Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Detach then attach the menu target element before showing the menu once will append the menu to the document body. #861

Closed
doctorj opened this issue Oct 23, 2023 · 0 comments
Assignees
Labels
bug Something isn't working version 2.x.x Version 2.x.x issues
Projects
Milestone

Comments

@doctorj
Copy link

doctorj commented Oct 23, 2023

I noticed this issue with DropdownButton but it applies to any element that has DropMenu set.
Sometimes it happens that menu position is at the bottom of the page instead near the button. In that case, menu element is missing top and left style properties, and also does not have dui-dd-* class set.
What I was able to find is that this happens when parent of element that has DropMenu (or the element itself) is removed, and appended again. And one more condition for this to happen is: menu must not be activated before first removal.
It sounds complicated, but it happens all the time when I'm switching views by setting content on AppLayout.
Here is the example and instructions to reproduce:

    public void onModuleLoad() {
        var layout = AppLayout.create("Domino-ui starter");

		Button b1 = Button.create("Button")
						.setDropMenu(Menu.<String>create()
										.setDropDirection(DropDirection.BOTTOM_RIGHT)
										.appendChild(MenuItem.create("Item 1"))
										.appendChild(MenuItem.create("Item 2"))
						)
						;
		DivElement d1 = div().appendChild(b1);

		DivElement p = div();
		p.appendChild(div().addCss(dui_flex, dui_gap_1, dui_m_b_10)
							.appendChild(Button.create("Remove")
											.addClickListener(evt -> d1.remove())
							)
							.appendChild(Button.create("Add")
											.addClickListener(evt -> layout.getContent().appendChild(d1))
							)
		);

		layout.getContent().appendChild(p);
		layout.getContent().appendChild(d1);

        body().appendChild(layout);
    }

There are two buttons, Remove and Add to remove/add DivElement which is parent of Button that has DropMenu set.
First we clik Remove to remove it, then Add to set it back again, and then when we clik on Button. The menu is wrongly positioned at the bottom.

There is a case when this will not happen, so we can start from begining:
First we clik on Button and menu opens nicely positioned. Then we click Remove and Add. After that, we click on Button again, and menu still opens properly.

@vegegoku vegegoku self-assigned this Oct 26, 2023
@vegegoku vegegoku added the bug Something isn't working label Oct 26, 2023
@vegegoku vegegoku added this to To do in Domino UI via automation Oct 26, 2023
@vegegoku vegegoku added this to the 2.0.0-RC4 milestone Oct 26, 2023
@vegegoku vegegoku changed the title v2: strange menu positioning strange menu positioning Oct 26, 2023
@vegegoku vegegoku added the version 2.x.x Version 2.x.x issues label Oct 26, 2023
@vegegoku vegegoku changed the title strange menu positioning Detach then attach the menu target element before showing the menu once will append the menu to the document body. Oct 27, 2023
vegegoku added a commit that referenced this issue Oct 27, 2023
…e menu once will append the menu to the document body
Domino UI automation moved this from To do to Done Oct 27, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working version 2.x.x Version 2.x.x issues
Projects
Domino UI
  
Done
Development

No branches or pull requests

2 participants