data-test-id can be used with OverlayProps (#1275)

Co-authored-by: Dusty Greif <dgreif@users.noreply.github.com>
primer · Jun 9, 2021 · 6887707 · 6887707 · vercel · Jun 9, 2021
1 parent 48443b7
commit 6887707
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 0 deletions.
diff --git a/.changeset/cool-rocks-drive.md b/.changeset/cool-rocks-drive.md
@@ -0,0 +1,5 @@
+---
+"@primer/components": patch
+---
+
+data props can be used in overlayProps.
diff --git a/src/Overlay.tsx b/src/Overlay.tsx
@@ -65,6 +65,7 @@ export type OverlayProps = {
   onClickOutside: (e: TouchOrMouseEvent) => void
   onEscape: (e: KeyboardEvent) => void
   visibility?: 'visible' | 'hidden'
+  [additionalKey: string]: unknown
 } & Omit<ComponentProps<typeof StyledOverlay>, 'visibility' | keyof SystemPositionProps>
 
 /**

diff --git a/src/stories/ActionMenu.stories.tsx b/src/stories/ActionMenu.stories.tsx
@@ -97,6 +97,7 @@ export function SimpleListStory(): JSX.Element {
           onAction={onAction}
           anchorContent="Menu"
           overlayProps={{
+            'data-test-id': 'some_test_id',
             onMouseDown: (e: React.MouseEvent) =>
               // eslint-disable-next-line no-console
               console.log('onMouseDown in the internal Overlay can be useful for controlling event interactions', e)