fix(backend): Preserve url protocol when joining paths

[panteliselef]

Description

Internally when joinPaths was used to join strings that included a url protocol like https:// the utility function would remove the duplicate / from the protocol resulting in a string with this form 'https:/api.lclclerk.com/v1/organizations/org_2YRy2Bcrc05EMTY0nMY3qHTjbwj'

When this string was passed in a URL constructor like new URL(...) the URL would either be fixed automatically or throw an "Invalid URL" error.

I believe it came down to node version and different implementations of the URL class under the hood. In any case this PR ensures that absolute url string that is generated from joinPaths will keep the protocol intact.

Fixes #2706

Checklist

• npm test runs as expected.
• npm run build runs as expected.
• (If applicable) JSDoc comments have been added or updated for any package exports
• (If applicable) Documentation has been updated

Type of change

• 🐛 Bug fix
• 🌟 New feature
• 🔨 Breaking change
• 📖 Refactoring / dependency upgrade / documentation
• other:

Packages affected

• @clerk/backend
• @clerk/chrome-extension
• @clerk/clerk-js
• @clerk/clerk-expo
• @clerk/fastify
• gatsby-plugin-clerk
• @clerk/localizations
• @clerk/nextjs
• @clerk/clerk-react
• @clerk/remix
• @clerk/clerk-sdk-node
• @clerk/shared
• @clerk/themes
• @clerk/types
• build/tooling/chore

[changeset-bot]

🦋 Changeset detected

Latest commit: f0e076d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 6 packages

Name	Type
@clerk/backend	Patch
@clerk/fastify	Patch
gatsby-plugin-clerk	Patch
@clerk/nextjs	Patch
@clerk/remix	Patch
@clerk/clerk-sdk-node	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[panteliselef]

Solves #2706

[dimkl]

🤔 Even though we should apply the change in this PR since it fixes the URL, It seems that we haven't done any change in this part of the code for a lot of time and the current code works for node@v16, node@v18, node@v20.

❯ nvm exec 16 node -e 'console.log(new URL("https:/api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/"))'
Running node v16.19.0 (npm v9.2.0)
URL {
  href: 'https://api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  origin: 'https://api.clerk.com/',
  protocol: 'https:',
  username: '',
  password: '',
  host: 'api.clerk.com',
  hostname: 'api.clerk.com',
  port: '',
  pathname: '/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  search: '',
  searchParams: URLSearchParams {},
  hash: ''
}
❯ nvm exec 18 node -e 'console.log(new URL("https:/api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/"))'
Running node v18.18.2 (npm v9.8.1)
URL {
  href: 'https://api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  origin: 'https://api.clerk.com/',
  protocol: 'https:',
  username: '',
  password: '',
  host: 'api.clerk.com',
  hostname: 'api.clerk.com',
  port: '',
  pathname: '/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  search: '',
  searchParams: URLSearchParams {},
  hash: ''
}
❯ nvm exec 20 node -e 'console.log(new URL("https:/api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/"))'
Running node v20.9.0 (npm v10.1.0)
URL {
  href: 'https://api.clerk.com/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  origin: 'https://api.clerk.com/',
  protocol: 'https:',
  username: '',
  password: '',
  host: 'api.clerk.com',
  hostname: 'api.clerk.com',
  port: '',
  pathname: '/v1/organizations/org_xxxxxxxxxxxxxxxxx/',
  search: '',
  searchParams: URLSearchParams {},
  hash: ''
}

[panteliselef]

Yes, this maybe have to do with edge vs node runtime. I'm still investigating. The fix is valid but I will merge after I've successfully reproduced.

[panteliselef]

!snapshot

[octoper]

!snapshot

[octoper]

!snapshot

[clerk-cookie]

Hey @octoper - the snapshot version command generated the following package versions:

Package	Version
@clerk/backend	1.0.1-snapshot.vf0e076d
@clerk/chrome-extension	1.0.1-snapshot.vf0e076d
@clerk/clerk-js	5.0.1-snapshot.vf0e076d
@clerk/clerk-expo	1.0.1-snapshot.vf0e076d
@clerk/fastify	1.0.1-snapshot.vf0e076d
gatsby-plugin-clerk	5.0.1-snapshot.vf0e076d
@clerk/localizations	2.0.1-snapshot.vf0e076d
@clerk/nextjs	5.0.1-snapshot.vf0e076d
@clerk/clerk-react	5.0.1-snapshot.vf0e076d
@clerk/remix	4.0.1-snapshot.vf0e076d
@clerk/clerk-sdk-node	5.0.1-snapshot.vf0e076d
@clerk/shared	2.0.1-snapshot.vf0e076d
@clerk/themes	2.0.1-snapshot.vf0e076d
@clerk/types	4.0.1-snapshot.vf0e076d

Tip: Use the snippet copy button below to quickly install the required packages.
@clerk/backend

npm i @clerk/backend@1.0.1-snapshot.vf0e076d --save-exact

@clerk/chrome-extension

npm i @clerk/chrome-extension@1.0.1-snapshot.vf0e076d --save-exact

@clerk/clerk-js

npm i @clerk/clerk-js@5.0.1-snapshot.vf0e076d --save-exact

@clerk/clerk-expo

npm i @clerk/clerk-expo@1.0.1-snapshot.vf0e076d --save-exact

@clerk/fastify

npm i @clerk/fastify@1.0.1-snapshot.vf0e076d --save-exact

gatsby-plugin-clerk

npm i gatsby-plugin-clerk@5.0.1-snapshot.vf0e076d --save-exact

@clerk/localizations

npm i @clerk/localizations@2.0.1-snapshot.vf0e076d --save-exact

@clerk/nextjs

npm i @clerk/nextjs@5.0.1-snapshot.vf0e076d --save-exact

@clerk/clerk-react

npm i @clerk/clerk-react@5.0.1-snapshot.vf0e076d --save-exact

@clerk/remix

npm i @clerk/remix@4.0.1-snapshot.vf0e076d --save-exact

@clerk/clerk-sdk-node

npm i @clerk/clerk-sdk-node@5.0.1-snapshot.vf0e076d --save-exact

@clerk/shared

npm i @clerk/shared@2.0.1-snapshot.vf0e076d --save-exact

@clerk/themes

npm i @clerk/themes@2.0.1-snapshot.vf0e076d --save-exact

@clerk/types

npm i @clerk/types@4.0.1-snapshot.vf0e076d --save-exact

[panteliselef]

We manage to replicate this in CF workers. It seems like the implementation of the URL constructor does not auto fixe the url as node or browser runtimes do. Thanks @octoper for replicating.