diff --git a/test-app/tests/integration/components/basic-dropdown-test.js b/test-app/tests/integration/components/basic-dropdown-test.js
index 89574db9..61876ac4 100644
--- a/test-app/tests/integration/components/basic-dropdown-test.js
+++ b/test-app/tests/integration/components/basic-dropdown-test.js
@@ -11,6 +11,7 @@ import {
waitUntil,
find,
settled,
+ pauseTest
} from '@ember/test-helpers';
let deprecations = [];
@@ -1397,6 +1398,55 @@ module('Integration | Component | basic-dropdown', function (hooks) {
wormhole.remove();
});
+ test('Shadow dom: Its `toggle` action opens and closes the dropdown with renderInPlace', async function (assert) {
+
+ await render(hbs`
+
+
+ Click me
+
+
+
+
+
+ `);
+
+ assert
+ .dom('#dropdown-is-opened', this.element.getRootNode())
+ .doesNotExist('The dropdown is closed');
+
+ const triggerElement = find('[data-shadow]')?.shadowRoot.querySelector(
+ '.ember-basic-dropdown-trigger',
+ );
+
+ await click(triggerElement);
+
+ assert
+ .dom('.ember-basic-dropdown-content', find('[data-shadow]').shadowRoot)
+ .exists('The dropdown is rendered');
+
+
+ assert.dom('#dropdown-is-opened', find('[data-shadow]').shadowRoot).exists('The dropdown is opened');
+
+ await click(find('[data-shadow]').shadowRoot.getElementById('dropdown-is-opened'));
+
+ assert.dom('#dropdown-is-opened', find('[data-shadow]').shadowRoot).exists('The dropdown stays opened when clicking content');
+
+ await click(triggerElement);
+
+ assert
+ .dom('#dropdown-is-opened', find('[data-shadow]').shadowRoot)
+ .doesNotExist('The dropdown is closed again');
+
+ await click(triggerElement);
+
+ assert.dom('#dropdown-is-opened', find('[data-shadow]').shadowRoot).exists('The dropdown is opened 2d time');
+
+ await click(find('[data-shadow]').shadowRoot.getElementById('dropdown-is-opened'));
+
+ assert.dom('#dropdown-is-opened', find('[data-shadow]').shadowRoot).exists('The dropdown stays opened when clicking content after 2d open');
+ });
+
test('Shadow dom: Its `toggle` action opens and closes the dropdown when wormhole is inside shadow dom', async function (assert) {
await render(hbs`
@@ -1406,7 +1456,7 @@ module('Integration | Component | basic-dropdown', function (hooks) {
-
+
`);