diff --git a/.changeset/shiny-games-buy.md b/.changeset/shiny-games-buy.md new file mode 100644 index 00000000000..d7946d65aad --- /dev/null +++ b/.changeset/shiny-games-buy.md @@ -0,0 +1,6 @@ +--- +"@clerk/clerk-js": patch +"@clerk/clerk-react": patch +--- + +Replace semver with custom regex in versionSelector diff --git a/package-lock.json b/package-lock.json index 2e13204d4d4..13bfc30b5a6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -37762,7 +37762,6 @@ "eslint-config-custom": "*", "react-refresh": "^0.14.0", "react-refresh-typescript": "^2.0.5", - "semver": "^7.5.2", "ts-loader": "^9.3.0", "typescript": "*", "webpack": "^5.85.0", @@ -38601,7 +38600,6 @@ "@clerk/shared": "2.0.0-beta-v5.11", "@clerk/types": "4.0.0-beta-v5.13", "eslint-config-custom": "*", - "semver": "^7.5.4", "tslib": "2.4.1" }, "devDependencies": { diff --git a/packages/clerk-js/package.json b/packages/clerk-js/package.json index e7f84ad54be..48011bce9e0 100644 --- a/packages/clerk-js/package.json +++ b/packages/clerk-js/package.json @@ -87,7 +87,6 @@ "eslint-config-custom": "*", "react-refresh": "^0.14.0", "react-refresh-typescript": "^2.0.5", - "semver": "^7.5.2", "ts-loader": "^9.3.0", "typescript": "*", "webpack": "^5.85.0", diff --git a/packages/react/package.json b/packages/react/package.json index ce513f16a6a..db7c2a733fa 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -79,7 +79,6 @@ "@clerk/shared": "2.0.0-beta-v5.11", "@clerk/types": "4.0.0-beta-v5.13", "eslint-config-custom": "*", - "semver": "^7.5.4", "tslib": "2.4.1" }, "devDependencies": { diff --git a/packages/react/src/utils/__tests__/versionSelector.test.ts b/packages/react/src/utils/__tests__/versionSelector.test.ts index 4ad8d33f862..d600b325218 100644 --- a/packages/react/src/utils/__tests__/versionSelector.test.ts +++ b/packages/react/src/utils/__tests__/versionSelector.test.ts @@ -5,6 +5,7 @@ describe('versionSelector', () => { it('should return the clerkJSVersion if it is provided', () => { expect(versionSelector('1.0.0')).toEqual('1.0.0'); }); + it('should use the major version if there is no prerelease tag', () => { // @ts-ignore global.PACKAGE_VERSION = '1.0.0'; @@ -13,6 +14,7 @@ describe('versionSelector', () => { expect(versionSelector(undefined)).toEqual('1'); }); + it('should use the prerelease tag when it is not snapshot', () => { // @ts-ignore global.PACKAGE_VERSION = '1.0.0-next.0'; @@ -21,6 +23,7 @@ describe('versionSelector', () => { expect(versionSelector(undefined)).toEqual('next'); }); + it('should use the exact JS version if tag is snapshot', () => { // @ts-ignore global.PACKAGE_VERSION = '1.0.0-snapshot.0'; @@ -29,4 +32,25 @@ describe('versionSelector', () => { expect(versionSelector(undefined)).toEqual('2.0.0-snapshot.0'); }); + + // We replaced semver with 2 custom regexes + // so we're testing the same cases as semver tests + // https://github.com/npm/node-semver/blob/main/test/functions/prerelease.js + // https://github.com/npm/node-semver/blob/main/test/functions/major.js + test.each([ + ['1.2.3', 1], + [' 1.2.3 ', 1], + [' 2.2.3-4 ', 4], + [' 3.2.3-pre ', 'pre'], + ['v5.2.3', 5], + [' v8.2.3 ', 8], + ['\t13.2.3', 13], + ['1.2.2-alpha.1', 'alpha'], + ['1.2.2-beta.1', 'beta'], + ['1.2.2-rc.1', 'rc'], + ['1.2.2', 1], + ['1.2.2-pre', 'pre'], + ])('versionSelector(%s) should return %i', (version, expected) => { + expect(versionSelector(undefined, version)).toEqual(expected.toString()); + }); }); diff --git a/packages/react/src/utils/versionSelector.ts b/packages/react/src/utils/versionSelector.ts index fdbbfc85f3c..6a07495706c 100644 --- a/packages/react/src/utils/versionSelector.ts +++ b/packages/react/src/utils/versionSelector.ts @@ -1,6 +1,3 @@ -import major from 'semver/functions/major'; -import prerelease from 'semver/functions/prerelease'; - /** * This version selector is a bit complicated, so here is the flow: * 1. Use the clerkJSVersion prop on the provider @@ -8,14 +5,15 @@ import prerelease from 'semver/functions/prerelease'; * 3. Use the prerelease tag of `@clerk/clerk-react` * 4. Fallback to the major version of `@clerk/clerk-react` * @param clerkJSVersion - The optional clerkJSVersion prop on the provider + * @param packageVersion - The version of `@clerk/clerk-react` that will be used if an explicit version is not provided * @returns The npm tag, version or major version to use */ -export const versionSelector = (clerkJSVersion: string | undefined) => { +export const versionSelector = (clerkJSVersion: string | undefined, packageVersion = PACKAGE_VERSION) => { if (clerkJSVersion) { return clerkJSVersion; } - const prereleaseTag = getPrereleaseTag(PACKAGE_VERSION); + const prereleaseTag = getPrereleaseTag(packageVersion); if (prereleaseTag) { if (prereleaseTag === 'snapshot') { return JS_PACKAGE_VERSION; @@ -24,8 +22,13 @@ export const versionSelector = (clerkJSVersion: string | undefined) => { return prereleaseTag; } - return getMajorVersion(PACKAGE_VERSION); + return getMajorVersion(packageVersion); }; -const getPrereleaseTag = (packageVersion: string) => prerelease(packageVersion)?.[0].toString(); -const getMajorVersion = (packageVersion: string) => major(packageVersion).toString(); +const getPrereleaseTag = (packageVersion: string) => + packageVersion + .trim() + .replace(/^v/, '') + .match(/-(.+?)(\.|$)/)?.[1]; + +const getMajorVersion = (packageVersion: string) => packageVersion.trim().replace(/^v/, '').split('.')[0];