From 4339ae8340d71607788ca3d1890449f04464ecba Mon Sep 17 00:00:00 2001
From: Andrew Holloway <booc0mtaco@users.noreply.github.com>
Date: Wed, 10 Jul 2024 17:05:29 -0500
Subject: [PATCH] test(Modal): add EDS assert for prop misuse

---
 src/components/Modal/Modal.test.tsx | 22 ++++++++++++++++++++++
 src/components/Modal/Modal.tsx      |  7 ++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/src/components/Modal/Modal.test.tsx b/src/components/Modal/Modal.test.tsx
index da99f9cd0..e8b59bbbf 100644
--- a/src/components/Modal/Modal.test.tsx
+++ b/src/components/Modal/Modal.test.tsx
@@ -131,4 +131,26 @@ describe('Modal', () => {
     expect(renderMethod).toThrow(Error);
     consoleErrorMock.mockRestore();
   });
+
+  it('prints a warning when height is used with size="sm"', () => {
+    const modalWithoutTitleOrAriaLabel = (
+      <Modal height="auto" onClose={() => {}} open size="sm">
+        <Modal.Header>
+          <Modal.Title>Modal Title</Modal.Title>
+        </Modal.Header>
+        <Modal.Body>Modal body content.</Modal.Body>
+        <Modal.Footer>Modal footer content.</Modal.Footer>
+      </Modal>
+    );
+    const renderMethod = () => {
+      render(modalWithoutTitleOrAriaLabel);
+    };
+
+    // expect console error from react, suppressed.
+    const consoleWarningMock = jest.spyOn(console, 'warn');
+    consoleWarningMock.mockImplementation();
+    expect(renderMethod).not.toThrow();
+    expect(consoleWarningMock).toHaveBeenCalledTimes(1);
+    consoleWarningMock.mockRestore();
+  });
 });
diff --git a/src/components/Modal/Modal.tsx b/src/components/Modal/Modal.tsx
index 5bcb0ac2e..3ff1a9970 100644
--- a/src/components/Modal/Modal.tsx
+++ b/src/components/Modal/Modal.tsx
@@ -3,6 +3,7 @@ import clsx from 'clsx';
 import type { MutableRefObject, ReactNode } from 'react';
 import React from 'react';
 
+import { assertEdsUsage } from '../../util/logging';
 import type { ExtractProps } from '../../util/utility-types';
 import type { Size } from '../../util/variant-types';
 
@@ -302,7 +303,11 @@ export const Modal = (props: ModalProps) => {
     }
   }
 
-  // TODO-AH: add check to make sure folks aren't using size="lg" with "height"
+  // check to make sure folks aren't using size="lg" with "height"
+  assertEdsUsage(
+    [rest.size !== 'lg' && typeof rest.height !== 'undefined'],
+    'Height is only supported when size is set to "lg"',
+  );
 
   const componentClassName = clsx(styles['modal'], modalContainerClassName);