hydrogen-cli ignoring --port argument, listening on random port

[contrebande-labs]

What is the location of your example repository?

No response

Which package or tool is having this issue?

CLI

What version of that package or tool are you using?

5.2.0

What version of Remix are you using?

1.19.1

Steps to Reproduce

Run shopify hydrogen dev or shopify hydrogen preview with a --port argument or without for the default port (3000).

Expected Behavior

The local mini oxygen server should start on a pre-defined default port or on the port specified with the --port argument.

Actual Behavior

Both shopify hydrogen dev and shopify hydrogen preview are ignoring the --port argument and start a server on a random port no matter what. Tests timeout waiting for the server to start on the specified port.

[frandiox]

Hi 👋 . I can't reproduce the problem:

---

Is perhaps your port already in use? If that's the case, the CLI will find the next open port (e.g. if you start two servers without the flag, they'll start in 3000 and 3001).

[artsparkAI]

Getting the same issue. The problem is has something to do with the usage of 'get-port' package. But oddly when I run get-port myself from a node REPL, it finds the port just fine.

[contrebande-labs]

Hi, @frandiox, no there is nothing running on the port specified with --port (I checked with lsof). Also, when I revert to the previous version of @shopify/cli-hydrogen (5.1.2), it binds to the correct port with the exact same command.

[frandiox]

Can you both try removing node_modules and installing again? I'm suspecting the CLI is importing get-port@6 instead of get-port@7 for some reason.

Otherwise, can you try creating a new project with npm create @shopify/hydrogen@latest, install deps and then npm run dev -- --port 3500?
This works for me, the dev server is started on 3500.

[contrebande-labs]

I have tried to remove node_modules and reinstalling with pnpm i. I wont have time to try to recreate the project from scratch until the weekend... But if this is not fixed by then, I will try that.

[frandiox]

Alright, I was able to reproduce it with pnpm.
The whole thing can be reproduced with a simple script:

import getPort from 'get-port';

const p1 = await getPort({port: 3000});
const p2 = await getPort({port: p1});

console.log({p1, p2}); // {p1: 3000, p2: 62425}

We are calling getPort twice, once in the CLI (since 5.2.0) and once in MiniOxygen itself. For some reason, getPort doesn't work when called twice like in the previous script. Unsure if this is a bug or is intended.

I guess PNPM is correctly surfacing this bug because it dedups dependencies. I've checked my node_modules installed with NPM and I have two copies of get-port@7 😅

For now, we can remove one of the calls.

[contrebande-labs]

Thanks!