[Bug?]: Toast module is not exported as it should while testing

[irg1008]

What's not working?

Basically I was testing some component that uses toast exported from @redwoodjs/web/toast

While on dev server, everything works as expected. but when testing the componente, specifically a function that later calls toast.error(...), I get the next error from jest:

    TypeError: _toast.toast.error is not a function

      75 |       },
      76 |       onError: (error) => {
    > 77 |         toast.error(error.message)
         |               ^
      78 |       },
      79 |     }
      80 |   )

Then a console.log shows that toast from import { toast } from '@redwoodjs/web/toast' has the next value:

      {
        CheckmarkIcon: [Getter],
        ErrorIcon: [Getter],
        LoaderIcon: [Getter],
        ToastBar: [Getter],
        ToastIcon: [Getter],
        Toaster: [Getter],
        default: [Getter],
        resolveValue: [Getter],
        toast: [Getter],
        useToaster: [Getter],
        useToasterStore: [Getter]
      }

When the value should be the inner "toast: [Getter]"

Only happens while testing

How do we reproduce the bug?

Just test some function in a react component that uses toaster from react-hot-toast while importing it from @redwoodjs/web/toast

What's your environment? (If it applies)

System:
    OS: Windows 11 10.0.22621
  Binaries:
    Node: 20.10.0 - ~\AppData\Local\Temp\xfs-df0b636b\node.CMD
    Yarn: 4.4.0 - ~\AppData\Local\Temp\xfs-df0b636b\yarn.CMD
  Browsers:
    Edge: Chromium (127.0.2651.74)
  npmPackages:
    @redwoodjs/auth-dbauth-setup: 8.4.1 => 8.4.1 
    @redwoodjs/core: 8.4.1 => 8.4.1 
    @redwoodjs/project-config: 8.4.1 => 8.4.1 
    @redwoodjs/realtime: 8.4.1 => 8.4.1 
    @redwoodjs/studio: 13.0.1 => 13.0.1 
  redwood.toml:
    [web]
    title = "Redwood App"
    port = "${WEB_PORT:8910}"
    host = "0.0.0.0"
    apiUrl = "/api"
    includeEnvironmentVariables = []
    [api]
    port = "${API_PORT:8911}"
    host = "0.0.0.0"
    [browser]
    open = true
    [notifications]
    versionUpdates = ["latest"]
    [studio.graphiql.authImpersonation]
    authProvider = "dbAuth"
    email = "..."
    userId = "1"
    roles = ["admin"]
    [graphql]
    fragments = true

Are you interested in working on this?

• I'm interested in working on this

[irg1008]

When using toast directly from react-hot-toast it works as expected. Maybe it has something to do with how we export it from the module:

@redwoodjs/web/toast

export { default as toast } from 'react-hot-toast';
export * from 'react-hot-toast';
//# sourceMappingURL=index.d.ts.map

[irg1008]

This is my tsconfig.json for the web side if it helps:

{
  "compilerOptions": {
    "noEmit": true,
    "allowJs": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "esModuleInterop": true,
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "Bundler",
    "skipLibCheck": false,
    "rootDirs": [
      "./src",
      "../.redwood/types/mirror/web/src",
      "../api/src",
      "../.redwood/types/mirror/api/src"
    ],
    "paths": {
      "src/*": [
        "./src/*",
        "../.redwood/types/mirror/web/src/*",
        "../api/src/*",
        "../.redwood/types/mirror/api/src/*"
      ],
      "$api/*": ["../api/*"],
      "types/*": ["./types/*", "../types/*"],
      "@redwoodjs/testing": ["../node_modules/@redwoodjs/testing/web"]
    },
    "typeRoots": [
      "../node_modules/@types",
      "./node_modules/@types",
      "../node_modules/@testing-library"
    ],
    "types": ["jest", "jest-dom"],
    "jsx": "preserve"
  },
  "include": [
    "src",
    "config",
    "../.redwood/types/includes/all-*",
    "../.redwood/types/includes/web-*",
    "../types",
    "./types"
  ]
}

[irg1008]

Ant to finally add more info, It could also be related to how jest config it's set in the next line:

redwood/packages/testing/config/jest/web/jest-preset.js

Line 57 in 9ec5f8c

'^@redwoodjs/web$': path.join(NODE_MODULES_PATH, '@redwoodjs/web/dist/cjs'),