Bug: POS Desktop Preview fails with 404 "Redirect url can't be constructed" on Windows

[Monasheeman]

Please confirm that you have:

• [x] Searched existing issues to see if your issue is a duplicate. (If you’ve found a duplicate issue, feel free to add additional information in a comment on it.)
• [x] Reproduced the issue in the latest CLI version.

In which of these areas are you experiencing a problem?

Extension

Expected behavior

Body:

I am unable to preview a POS UI Smart Grid extension on the desktop web-based POS. It consistently fails with a 404 error, "Redirect url can't be constructed".

Environment:

Shopify CLI Version: (Run shopify version in your terminal to get this)

Node.js Version: (Run node -v to get this)

npm Version: (Run npm -v to get this)

Operating System: Windows

Steps to Reproduce:

Run npm init @shopify/app@latest and create a new Remix app with TypeScript.

Run npm run shopify app generate extension and create a POS UI Smart Grid extension with TypeScript React.

Run npm run shopify app dev.

Open the developer console and click the preview link for pos.home.tile.render.

Expected Behavior: The desktop POS preview should open and load the extension.

Actual Behavior: A 404 error page is displayed with the message: Redirect url can't be constructed for extension...

Troubleshooting Steps Taken:

Restarted the dev server.

Ran the dev server with the --reset flag.

Updated Node.js, npm, and Shopify CLI to the latest versions.

Manually set the App URL and Redirect URLs in the Partner Dashboard.

Tried multiple browsers and incognito mode.

The issue occurs even on a brand new, unmodified project.

Actual behavior

Body:

I am unable to preview a POS UI Smart Grid extension on the desktop web-based POS. It consistently fails with a 404 error, "Redirect url can't be constructed".

Environment:

Shopify CLI Version: (Run shopify version in your terminal to get this)

Node.js Version: (Run node -v to get this)

npm Version: (Run npm -v to get this)

Operating System: Windows

Steps to Reproduce:

Run npm init @shopify/app@latest and create a new Remix app with TypeScript.

Run npm run shopify app generate extension and create a POS UI Smart Grid extension with TypeScript React.

Run npm run shopify app dev.

Open the developer console and click the preview link for pos.home.tile.render.

Expected Behavior: The desktop POS preview should open and load the extension.

Actual Behavior: A 404 error page is displayed with the message: Redirect url can't be constructed for extension...

Troubleshooting Steps Taken:

Restarted the dev server.

Ran the dev server with the --reset flag.

Updated Node.js, npm, and Shopify CLI to the latest versions.

Manually set the App URL and Redirect URLs in the Partner Dashboard.

Tried multiple browsers and incognito mode.

The issue occurs even on a brand new, unmodified project.

Verbose output

Verbose output

Paste the output here!

Reproduction steps

Operating System

windows 11

Shopify CLI version (shopify --version)

3.84.1

Shell

No response

Node version (run node -v if you're not sure)

No response

What language and version are you using in your application?

No response

[isaacroldan]

Hi @Monasheeman, thanks for the report. Could you please re-format your issue to clarify the error and the steps taken? is really hard to read as it is right now and i'm not sure if this is a CLI bug or not.

[sshaw]

I have the same problem. Once you run shopify app dev for an app with a POS extension and click on the Preview URL you get the an Extension targets section with the POS extensions. Copying and pasting URL provided by the clipboard link results in a JSON response with Redirect url can't be constructed.

If you copy the Shopify POS scheme URL from the View on Mobile button and paste it into your mobile browser (Chrome on Android in my case), the resulting URL is not opened. The browser just searches so, it appears the com.shopify.pos// scheme is not registered (sigh). This is with the current POS, installed today. Sigh

[isaacroldan]

Hi @sshaw, the correct way is to use the URL from View on Mobile either copying it or scanning the QR. I'll pass this to the team to see why it might not be loaded if you have the app installed.

The clipboard link shouldn't be there, that's a bug, so it's normal to get a Redirect url can't be constructed. error (FWIW, it does work fine for me on iOS)

[github-actions[bot]]

This issue seems inactive. If it's still relevant, please add a comment saying so. Otherwise, take no action. → If there's no activity within a week, then a bot will automatically close this. Thanks for helping to improve Shopify's dev tooling and experience.

P.S. You can learn more about why we stale issues here.