From 76949c2205b84066cce8a8cdd3182536af0761ce Mon Sep 17 00:00:00 2001
From: Steve Dodier-Lazaro <[email protected]>
Date: Tue, 29 Jul 2025 21:48:48 +0200
Subject: [PATCH] Debug patch - test actions with a filtered spy

---
 code/.storybook/preview.tsx                 | 20 +++++++++++-
 code/core/template/stories/spies.stories.ts | 34 ++++++++++++++++++++-
 2 files changed, 52 insertions(+), 2 deletions(-)

diff --git a/code/.storybook/preview.tsx b/code/.storybook/preview.tsx
index 5ad330df65a..1e631d84954 100644
--- a/code/.storybook/preview.tsx
+++ b/code/.storybook/preview.tsx
@@ -17,9 +17,10 @@ import addonThemes from '@storybook/addon-themes';
 import addonTest from '@storybook/addon-vitest';
 
 import addonPseudoStates from 'storybook-addon-pseudo-states';
+import { action } from 'storybook/actions';
 import { DocsContext as DocsContextProps, useArgs } from 'storybook/preview-api';
 import type { PreviewWeb } from 'storybook/preview-api';
-import { sb } from 'storybook/test';
+import { sb, spyOn } from 'storybook/test';
 import {
   Global,
   ThemeProvider,
@@ -394,6 +395,22 @@ const parameters = {
   },
 };
 
+const beforeEach = async () => {
+  const originalConsoleWarn = console.warn;
+
+  spyOn(console, 'warn')
+    .mockName('')
+    .mockImplementation((...args) => {
+      // Check if the warn message matches a certain pattern
+      if (args[0].startsWith('hello')) {
+        action('console.warn')(args);
+      }
+
+      // Call the original console.warn function
+      originalConsoleWarn(...args);
+    });
+};
+
 export default definePreview({
   addons: [
     addonDocs(),
@@ -403,6 +420,7 @@ export default definePreview({
     addonPseudoStates(),
     templatePreview,
   ],
+  beforeEach,
   decorators,
   loaders,
   tags: ['test', 'vitest'],
diff --git a/code/core/template/stories/spies.stories.ts b/code/core/template/stories/spies.stories.ts
index e74f89c95c7..1069f8fe91a 100644
--- a/code/core/template/stories/spies.stories.ts
+++ b/code/core/template/stories/spies.stories.ts
@@ -1,28 +1,60 @@
 import { global as globalThis } from '@storybook/global';
 
-import { spyOn } from 'storybook/test';
+import { fn, spyOn } from 'storybook/test';
 
 const meta = {
   component: globalThis.__TEMPLATE_COMPONENTS__.Button,
   beforeEach() {
     spyOn(console, 'log').mockName('console.log');
     console.log('first');
+    console.warn('hello world (1/3)');
+  },
+  argTypes: {
+    onClick: {
+      action: 'clicked',
+    },
   },
 };
 
 export default meta;
 
+// This one should display clicked: {__isClassInstance__: true, __className__: "SyntheticBaseEvent", _reactName: "onClick", _targetInst: null, type: "click"…}
+export const DefaultStoryArgSpies = {
+  parameters: {
+    chromatic: { disable: true },
+  },
+  args: {
+    label: 'Button',
+  },
+};
+
+// This one should display "onClick" with the parameters; it does but the event appears twice for some reason.
+export const StoryArgSpiesWithUserSuppliedFunction = {
+  parameters: {
+    chromatic: { disable: true },
+  },
+  args: {
+    label: 'Button',
+    onClick: fn().mockImplementation(() => {
+      const a = 'b';
+    }),
+    // onClick: fn(),
+  },
+};
+
 export const ShowSpyOnInActions = {
   parameters: {
     chromatic: { disable: true },
   },
   beforeEach() {
     console.log('second');
+    console.warn('hi world (2/3)');
   },
   args: {
     label: 'Button',
     onClick: () => {
       console.log('third');
+      console.warn('hello and good bye (3/3)');
     },
   },
 };
-- 
2.50.1