From 6346b63ce94b9163642159b58605c501451ed3f8 Mon Sep 17 00:00:00 2001 From: Ian VanSchooten Date: Fri, 18 Feb 2022 18:29:48 -0500 Subject: [PATCH 1/2] Mock window in browser environments --- addons/interactions/src/preset/argsEnhancers.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/addons/interactions/src/preset/argsEnhancers.ts b/addons/interactions/src/preset/argsEnhancers.ts index 57d7d8d4106d..cbcb796af72f 100644 --- a/addons/interactions/src/preset/argsEnhancers.ts +++ b/addons/interactions/src/preset/argsEnhancers.ts @@ -1,8 +1,11 @@ import { Args, addons } from '@storybook/addons'; +import { window as globalWindow } from 'global'; import { FORCE_REMOUNT, STORY_RENDER_PHASE_CHANGED } from '@storybook/core-events'; import { AnyFramework, ArgsEnhancer } from '@storybook/csf'; import { instrument } from '@storybook/instrumenter'; -import { fn } from 'jest-mock'; +import { ModuleMocker } from 'jest-mock'; + +const { fn } = new ModuleMocker(globalWindow); // Aliasing `fn` to `action` here, so we get a more descriptive label in the UI. const { action } = instrument({ action: fn }, { retain: true }); From 5952b57fb4d06ff9e16e46b43af7eaf000790663 Mon Sep 17 00:00:00 2001 From: Ian VanSchooten Date: Mon, 21 Feb 2022 21:30:21 -0500 Subject: [PATCH 2/2] Bind `fn` to JestMock correctly. --- addons/interactions/src/preset/argsEnhancers.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/addons/interactions/src/preset/argsEnhancers.ts b/addons/interactions/src/preset/argsEnhancers.ts index cbcb796af72f..d7a71ae9d9ef 100644 --- a/addons/interactions/src/preset/argsEnhancers.ts +++ b/addons/interactions/src/preset/argsEnhancers.ts @@ -1,11 +1,11 @@ import { Args, addons } from '@storybook/addons'; -import { window as globalWindow } from 'global'; import { FORCE_REMOUNT, STORY_RENDER_PHASE_CHANGED } from '@storybook/core-events'; import { AnyFramework, ArgsEnhancer } from '@storybook/csf'; import { instrument } from '@storybook/instrumenter'; import { ModuleMocker } from 'jest-mock'; -const { fn } = new ModuleMocker(globalWindow); +const JestMock = new ModuleMocker(global); +const fn = JestMock.fn.bind(JestMock); // Aliasing `fn` to `action` here, so we get a more descriptive label in the UI. const { action } = instrument({ action: fn }, { retain: true });