Unable to have stories without mocks with this addon

[Slessi]

I need mocks for some, but not all stories. I am seeing the below error, for any story that does not define mocks:

TypeError: Cannot read properties of undefined (reading 'mocks')

at wrapper (http://localhost:6006/node_modules/.cache/storybook/1c3385a5d25e538d10b518b310c74d3ca2690b6aaffeadccd74da79736171f86/sb-vite/deps/storybook-addon-fetch-mock_preview.js?v=96f16fe2:2793:86) at http://localhost:6006/sb-preview/runtime.js:86:3164 at http://localhost:6006/sb-preview/runtime.js:86:3277 at hookified (http://localhost:6006/sb-preview/runtime.js:84:10607) at http://localhost:6006/sb-preview/runtime.js:100:3256 at http://localhost:6006/sb-preview/runtime.js:100:3918 at http://localhost:6006/sb-preview/runtime.js:84:11410 at unboundStoryFn (http://localhost:6006/sb-preview/runtime.js:100:5353) at renderWithHooks (http://localhost:6006/node_modules/.cache/storybook/1c3385a5d25e538d10b518b310c74d3ca2690b6aaffeadccd74da79736171f86/sb-vite/deps/chunk-AC6QIUQG.js?v=96f16fe2:12171:26) at mountIndeterminateComponent (http://localhost:6006/node_modules/.cache/storybook/1c3385a5d25e538d10b518b310c74d3ca2690b6aaffeadccd74da79736171f86/sb-vite/deps/chunk-AC6QIUQG.js?v=96f16fe2:14921:21)

Reproduction: https://github.com/Slessi/storybook-addon-fetch-mock-no-data-repro

I expect to be able to have stories without mocks, is this not possible? Am trying to migrate from storybook-addon-mock which allowed for this.

There was a similar issue at https://github.com/JohnAlbin/storybook-addon-fetch-mock/issues/6 but the author claims it was a problem on his end, however in my minimal reproduction I cannot imagine what I am doing wrong.

[RobinSCU]

I have the same problem with the addon but i think i found a temporary solution.

The Problem is that in the withFetchMock.ts are multiple lines of code trying to access the parameters object which isn't defined when you have no fetchMocks parameter in the global configs or in the story. Because of that issue we get an JS exception.

@JohnAlbin i think the issue starts add Line 76 in the withFetchMock.ts https://github.com/JohnAlbin/storybook-addon-fetch-mock/blob/main/src/withFetchMock.ts#L76, that is the first point where the code tries to access the parameters object.

Since we know that the parameters object is undefined i think you could skip the complete rest of the code except return storyFn(context) ?

some think like this:

// When parameters is undefined, render the story
if(!parameters)
  return storyFn(context);

// Add all the mocks.
addMocks(parameters.mocks);

// Do any additional configuration of fetchMock, e.g. setting
// fetchMock.config or calling other methods.
if (typeof parameters.useFetchMock === 'function') {
  parameters.useFetchMock(fetchMock);
}

// Add any catch-all mocks.
addMocks(parameters.catchAllMocks, 'catchAllMocks');

// Add any catch-all urls last.
if (Array.isArray(parameters.catchAllURLs)) {
  parameters.catchAllURLs.forEach((url) => {
    fetchMock.mock(
      {
        // Add descriptive name for debugging.
        name: `catchAllURLs[ ${url} ]`,
        url: `begin:${url}`,
      },
      // Catch-all mocks will respond with 404 to make it easy to determine
      // one of the catch-all mocks was used.
      404,
    );
  });
}

// Render the story with mocks.
return storyFn(context);

@Slessi for the meentime, you can just add a empty fetchMock Object to the preview.ts under parameters it fixed for me

    parameters: {
        fetchMock: {},
    },

[JohnAlbin]

Thanks for the analysis @RobinSCU and @Slessi!

I believe #20 fixes this issue then!