[Bug]: Queries of Cells using afterQuery aren't mocked for components using them in Storybook

[Philzen]

What's not working?

This following feature (described in Tutorial Chapter 6: Multiple Comments) breaks when the referenced cell includes an afterQuery hook:

Shouldn't the CommentsCell cause an actual GraphQL request? How does this work?

Redwood has added some functionality around Storybook so that if you're testing a component that itself isn't a Cell (like the Article component) but that renders a cell (like CommentsCell), then it will mock the GraphQL and use the standard mock that goes along with that Cell.

If the referenced cell exports an afterQuery hook, a GraphQL request is indeed fired, breaking the story b/c the cell will render the Failure components instead of Success:

How do we reproduce the bug?

1. Have any kind of Cell with mocked data in storybook
2. Have a story that includes that cell (and typically successfully renders the Success component of that cell), for instance a Page
3. Add an afterQuery-hook to the cell. This can be the most simplest thinkable hook that basically does nothing:

     export const afterQuery = (data) => data 

4. Kill storybook and restart it (this is necessary due to [Bug]: Storybook requires restart after adding afterQuery Cell hook #11742)
5. The Page story that includes the Cell now renders the Failure component.

What's your environment? (If it applies)

System:
    OS: Linux 6.12 Manjaro Linux
    Shell: 5.2.37 - /bin/bash
  Binaries:
    Node: 20.16.0 - /tmp/xfs-904737a6/node
    Yarn: 4.4.0 - /tmp/xfs-904737a6/yarn
  Databases:
    SQLite: 3.47.2 - /usr/bin/sqlite3
  npmPackages:
    @redwoodjs/auth-dbauth-setup: 8.4.2 => 8.4.2 
    @redwoodjs/cli-storybook-vite: 8.4.2 => 8.4.2 
    @redwoodjs/core: 8.4.2 => 8.4.2 
    @redwoodjs/project-config: 8.4.2 => 8.4.2

Are you interested in working on this?

• I'm interested in working on this