[Bug]: Modals are clipping combobox dropdowns

[wkeese]

Package

carbon-components

Browser

Chrome

Package version

10.44

Description

Modals are now clipping the combobox dropdown, or at least, forcing it to remain in the modal.

This is a regression from #7698, which is no longer needed because the real problem was fixed in #9418.

So, the solution here (I believe) is to roll back #7698.

CodeSandbox example

https://codesandbox.io/s/cocky-lovelace-d95h5?file=/index.js

Steps to reproduce

Open https://codesandbox.io/s/cocky-lovelace-d95h5?file=/index.js, scroll down to the combobox, and open the dropdown.

Note that it does not overlay the modal's "Cancel" and "Submit" buttons like it should.

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems

[tay1orjones]

This appears to also be related to #7565? Maybe not though since this doesn't mention scrollable areas inside modal, just the modal itself.

[wkeese]

Yeah, #7565 is more of a philosophical ticket whereas this is about a specific node/class. I added my thoughts to #7565 though.

[wkeese]

Revision on my earlier comments:

In addition to rolling back #7698, can't you roll back #9418 and put the position:relative on the checkbox itself, or the immediate checkbox wrapper? You need to do that anyway to fix #9444.

It's best to avoid position:relative on ancestors of dropdowns.

[francinelucca]

is this and #7565 the same issue? if so, should we close one?

[tw15egan]

Yeah @francinelucca they are encountering the same issue. It seems like the other issue has a bit more history / workarounds, so lets close this one in favor of that 👍🏻