examples icon indicating copy to clipboard operation
examples copied to clipboard

MSW example not working

Open SylRob opened this issue 3 years ago • 2 comments

I am actually using the "indie stack" of remix, and I'm struggling to find a working setting for msw to work on both server and client side, I thought I would look into the example to find my solution but could not make this example works

here is the step I took :

npx create-remix@latest --template examples/msw
? TypeScript or JavaScript? (Use arrow keys)
❯ TypeScript 
  JavaScript
? Do you want me to run `npm install`? (Y/n) y

Then running the dev server

$ npm run dev

> dev
> remix dev

Watching Remix app in development mode...
💿 Built in 327ms
Remix App Server started at http://localhost:3000 (http://xxx.xxx.xx.x:3000)

When accessing the browser, here is what popup in my terminal :

There was an error running the data loader for route root
FetchError: request to https://my-mock-api.com/ failed, reason: getaddrinfo ENOTFOUND my-mock-api.com
    at ClientRequest.<anonymous> (/xxxxxx/remix-example/node_modules/@remix-run/web-fetch/src/fetch.js:111:11)
    at ClientRequest.emit (node:events:513:28)
    at TLSSocket.socketErrorListener (node:_http_client:494:9)
    at TLSSocket.emit (node:events:513:28)
    at emitErrorNT (node:internal/streams/destroy:151:8)
    at emitErrorCloseNT (node:internal/streams/destroy:116:3)
    at processTicksAndRejections (node:internal/process/task_queues:82:21)
GET / 500 - - 112.438 ms
GET /mockServiceWorker.js 404 - - 3.404 ms

GET /mockServiceWorker.js 404 - - 3.404 ms disappear if I run the msw init command line: npx msw init public/ --save

in the "indie stack", it looks like the initialization of msw is done differently with something like that in package.json :

{
...
"dev:remix": "cross-env NODE_ENV=development binode --require ./mocks -- @remix-run/dev:remix dev",
...
}

SylRob avatar Oct 25 '22 06:10 SylRob

@kettanaito Do you have any time to look into this please?

MichaelDeBoey avatar Oct 26 '22 16:10 MichaelDeBoey

The GET request for the worker script implies it's not being served correctly by the application. @MichaelDeBoey, do you know when the Indie stack initializes the worker? Perhaps there's an issue that it doesn't?

kettanaito avatar Oct 26 '22 17:10 kettanaito

@MichaelDeBoey @kettanaito

Could you please review PR https://github.com/remix-run/examples/pull/69 to see if it's possible to use same dev script like indie-stack ?

I've tested successfully "msw" example with the new change.

leapful avatar Nov 14 '22 16:11 leapful