From 8aba95c766403566017fd733464a4cdc8b9174b7 Mon Sep 17 00:00:00 2001
From: Michael <michaeldowseza@users.noreply.github.com>
Date: Mon, 4 Nov 2024 16:16:28 +0100
Subject: [PATCH] fix: S3 resource selector findModal selector test util
 returning incorrect modal (#2977)

---
 .../__snapshots__/test-utils-selectors.test.tsx.snap      | 1 +
 src/s3-resource-selector/s3-modal/index.tsx               | 2 ++
 src/s3-resource-selector/test-classes/styles.scss         | 8 ++++++++
 src/test-utils/dom/s3-resource-selector/index.ts          | 3 ++-
 4 files changed, 13 insertions(+), 1 deletion(-)
 create mode 100644 src/s3-resource-selector/test-classes/styles.scss

diff --git a/src/__tests__/__snapshots__/test-utils-selectors.test.tsx.snap b/src/__tests__/__snapshots__/test-utils-selectors.test.tsx.snap
index 6ec6aa69ea..ea13fb73e6 100644
--- a/src/__tests__/__snapshots__/test-utils-selectors.test.tsx.snap
+++ b/src/__tests__/__snapshots__/test-utils-selectors.test.tsx.snap
@@ -482,6 +482,7 @@ exports[`test-utils selectors 1`] = `
     "awsui_browse-button_1vtzr",
     "awsui_layout-uri_1vtzr",
     "awsui_layout-version_1vtzr",
+    "awsui_modal-root_rkh1e",
     "awsui_root_1u0yw",
     "awsui_root_1vtzr",
     "awsui_submit-button_12hyz",
diff --git a/src/s3-resource-selector/s3-modal/index.tsx b/src/s3-resource-selector/s3-modal/index.tsx
index b87f496b4f..646531253e 100644
--- a/src/s3-resource-selector/s3-modal/index.tsx
+++ b/src/s3-resource-selector/s3-modal/index.tsx
@@ -16,6 +16,7 @@ import { BucketsTable } from './buckets-table';
 import { ObjectsTable } from './objects-table';
 import { VersionsTable } from './versions-table';
 
+import testUtilStyles from '../test-classes/styles.css.js';
 import styles from './styles.css.js';
 
 export interface S3ModalProps {
@@ -125,6 +126,7 @@ export function S3Modal({
   return (
     <div>
       <InternalModal
+        className={testUtilStyles['modal-root']}
         visible={true}
         size="max"
         getModalRoot={getModalRoot}
diff --git a/src/s3-resource-selector/test-classes/styles.scss b/src/s3-resource-selector/test-classes/styles.scss
new file mode 100644
index 0000000000..b8445a1d8b
--- /dev/null
+++ b/src/s3-resource-selector/test-classes/styles.scss
@@ -0,0 +1,8 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+.modal-root {
+  /* used in test-utils */
+}
diff --git a/src/test-utils/dom/s3-resource-selector/index.ts b/src/test-utils/dom/s3-resource-selector/index.ts
index 7f45d047e7..f76504f367 100644
--- a/src/test-utils/dom/s3-resource-selector/index.ts
+++ b/src/test-utils/dom/s3-resource-selector/index.ts
@@ -12,6 +12,7 @@ import TableWrapper from '../table';
 import inContextStyles from '../../../s3-resource-selector/s3-in-context/styles.selectors.js';
 import modalStyles from '../../../s3-resource-selector/s3-modal/styles.selectors.js';
 import styles from '../../../s3-resource-selector/styles.selectors.js';
+import testUtilStyles from '../../../s3-resource-selector/test-classes/styles.selectors.js';
 
 class S3ModalWrapper extends ModalWrapper {
   findSubmitButton(): ButtonWrapper {
@@ -50,7 +51,7 @@ export default class S3ResourceSelectorWrapper extends ComponentWrapper {
   }
 
   findModal(): S3ModalWrapper | null {
-    const modal = createWrapper().findModal();
+    const modal = createWrapper().findModal(`.${testUtilStyles['modal-root']}`);
     return modal && new S3ModalWrapper(modal.getElement());
   }