[Bug?]: Studio - Mailer Template Renderer not picking up installed Renderers

[jacebenson]

What's not working?

I'm trying to use the Redwood Studio to develop some email messages, and I came across this issue I mentioned in Discord.

I decided to try to recreate the issue in new setup and see if I can recreate it simply. It reproduces for me. I tried this with both JS and TS. Fails the same way.

The issue is I cannot pick the renderer in the Redwood Studio.

How do we reproduce the bug?

yarn create redwood-app ./redwoodblog
# √ Select your preferred language · **JavaScript**
# √ Do you want to initialize a git repo? · **no** / Yes
# √ Do you want to run yarn install? · no / **Yes**
cd redwoodblog
yarn rw setup mailer
yarn rw build
yarn rw studio
# in a new terminal
yarn rw dev
# open the localhost:4318 and goto the Mailer Templates, you should see the issue

What's your environment? (If it applies)

System:
    OS: Windows 11 10.0.22631
  Binaries:
    Node: 20.17.0 - ~\AppData\Local\Temp\xfs-47f42861\node.CMD
    Yarn: 4.4.0 - ~\AppData\Local\Temp\xfs-47f42861\yarn.CMD
  Browsers:
    Edge: Chromium (127.0.2651.74)
  npmPackages:
    @redwoodjs/core: 8.3.0 => 8.3.0
    @redwoodjs/project-config: 8.3.0 => 8.3.0
    @redwoodjs/realtime: 8.3.0 => 8.3.0
    @redwoodjs/studio: 12 => 12.0.0
  redwood.toml:
    [web]
      title = "Redwood App"
      port = 8910
      apiUrl = "/.redwood/functions" # You can customize graphql and dbauth urls individually too: see https://redwoodjs.com/docs/app-configuration-redwood-toml#api-paths
      includeEnvironmentVariables = [
        # Add any ENV vars that should be available to the web side to this array
        # See https://redwoodjs.com/docs/environment-variables#web
      ]
    [api]
      port = 8911
    [browser]
      open = true
    [notifications]
      versionUpdates = ["latest"]

Are you interested in working on this?

• [ ] I'm interested in working on this

[dthyresson]

@jacebenson The server file should start the watchers

https://github.com/redwoodjs/studio/blob/66304997bd4bce3290edc487ba0fb3189b813051/api/src/server.ts#L106

which then will resync:

https://github.com/redwoodjs/studio/blob/66304997bd4bce3290edc487ba0fb3189b813051/api/src/util/fsWatching.ts#L42

which will look for your miler config in dist snd upsert th renderers:

https://github.com/redwoodjs/studio/blob/66304997bd4bce3290edc487ba0fb3189b813051/api/src/services/mailRenderers/mailRenderers.ts#L29

Perhaps they don't populate initially?

Could you try while studio is running to make some modification to mailer.js such that it forces a re-synch?

@Josh-Walker-GM any other ideas?

[dthyresson]

Another thing to try @jacebenson is to open up the GraphiQL explorer on Studio -- not the explorer in the Studio - bu there one running within Studio on its port -- the one the web app talks to -- and manually invoke the resyncMailRenderers operation.

That "should" refetch and resync.

[jacebenson]

Okay I tried calling that mutation from the :4318 studio app and I got no change.

mutation {
  resyncMailRenderers
}

However when i run that mutation, i get this error on my studio terminal

Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only URLs with a scheme in: file, data, and node are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'
    at throwIfUnsupportedURLScheme (node:internal/modules/esm/load:249:11)
    at defaultLoad (node:internal/modules/esm/load:130:3)
    at ModuleLoader.load (node:internal/modules/esm/loader:553:13)
    at ModuleLoader.moduleProvider (node:internal/modules/esm/loader:434:56)
    at new ModuleJob (node:internal/modules/esm/module_job:71:27)
    at #createModuleJob (node:internal/modules/esm/loader:447:17)
    at ModuleLoader.getJobFromResolveResult (node:internal/modules/esm/loader:259:34)    
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:240:17)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)        
    at async ModuleLoader.import (node:internal/modules/esm/loader:472:23) {
  code: 'ERR_UNSUPPORTED_ESM_URL_SCHEME'
}

This feels like we're getting somewhere.

[dthyresson]

^^^ @Josh-Walker-GM going to need your help/memory here about what might be going on with Studio renderers.

[jacebenson]

I tried this on my ubuntu laptop and ... it just works. I'm not sure where the file loader is loading the file but I believe this is a windows only issue.

[cjreimer]

By the way, I'm seeing this same behavior as well. Note that I'm on Windows as well. I do see the following warning when starting Studio as well, although the features (I haven't tested them all) other than the selection of renderers appear to work.

Importing Server Functions... 
/otel-trace 506 ms
...Done importing in 507 ms
(node:1488) [FSTWRN002] FastifyWarning: The graphqlProxy plugin being registered mixes async and callback styles, which will result in an error in `fastify@5`
(Use `node --trace-warnings ...` to show where the warning was created)
{"level":30,"time":1728602101396,"pid":1488,"hostname":"CENGYS-PC-00006","msg":"Starting OpenTelemetry span processor"}
GraphQL Yoga Server endpoint at graphql

I may have seen a path type error in the console at some point, but can't replicate the console error regarding the path at this point.