React-Router v8 #8958

Description

@abegehr

Preliminary Checks

Reproduction

https://github.com/abegehr/rr8-clerk

Publishable key

pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

Description

React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
Would be nice to get @clerk/react-router with react-router@8 support.

Repro:

  1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
  2. Install clerk for RR: npm i @clerk/react-router
  3. Get an error:
anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: rr8-clerk@undefined
npm error Found: react-router@8.0.0
npm error node_modules/react-router
npm error react-router@"8.0.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
npm error node_modules/@clerk/react-router
npm error @clerk/react-router@"*" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

Environment

System:
OS: macOS 26.5.1
CPU: (8) arm64 Apple M2
Memory: 188.14 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
Browsers:
Chrome: 149.0.7827.115
Safari: 26.5
npmPackages:
@react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions

      , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
       blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
      }
      } catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
      })();
      (function(){
      try {
      var __m = "github.com";
      var __re = new RegExp('^' + "github\\.com" + '
      
      Skip to content

      React-Router v8 #8958

      Description

      @abegehr

      Preliminary Checks

      Reproduction

      https://github.com/abegehr/rr8-clerk

      Publishable key

      pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

      Description

      React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
      Would be nice to get @clerk/react-router with react-router@8 support.

      Repro:

      1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
      2. Install clerk for RR: npm i @clerk/react-router
      3. Get an error:
      anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
      npm error code ERESOLVE
      npm error ERESOLVE unable to resolve dependency tree
      npm error
      npm error While resolving: rr8-clerk@undefined
      npm error Found: react-router@8.0.0
      npm error node_modules/react-router
      npm error react-router@"8.0.0" from the root project
      npm error
      npm error Could not resolve dependency:
      npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
      npm error node_modules/@clerk/react-router
      npm error @clerk/react-router@"*" from the root project
      npm error
      npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
      npm error
      npm error
      npm error For a full report see:
      npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
      npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

      Environment

      System:
      OS: macOS 26.5.1
      CPU: (8) arm64 Apple M2
      Memory: 188.14 MB / 16.00 GB
      Shell: 5.9 - /bin/zsh
      Binaries:
      Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
      npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
      pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
      Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
      Browsers:
      Chrome: 149.0.7827.115
      Safari: 26.5
      npmPackages:
      @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

      Activity

      Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

      Metadata

      Metadata

      Assignees

      No one assigned

        Labels

        Type

        No type

        Projects

        No projects

          Milestone

          No milestone

          Relationships

          None yet

          Development

          No branches or pull requests

          Issue actions

          , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
          Skip to content

          React-Router v8 #8958

          Description

          @abegehr

          Preliminary Checks

          Reproduction

          https://github.com/abegehr/rr8-clerk

          Publishable key

          pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

          Description

          React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
          Would be nice to get @clerk/react-router with react-router@8 support.

          Repro:

          1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
          2. Install clerk for RR: npm i @clerk/react-router
          3. Get an error:
          anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
          npm error code ERESOLVE
          npm error ERESOLVE unable to resolve dependency tree
          npm error
          npm error While resolving: rr8-clerk@undefined
          npm error Found: react-router@8.0.0
          npm error node_modules/react-router
          npm error react-router@"8.0.0" from the root project
          npm error
          npm error Could not resolve dependency:
          npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
          npm error node_modules/@clerk/react-router
          npm error @clerk/react-router@"*" from the root project
          npm error
          npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
          npm error
          npm error
          npm error For a full report see:
          npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
          npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

          Environment

          System:
          OS: macOS 26.5.1
          CPU: (8) arm64 Apple M2
          Memory: 188.14 MB / 16.00 GB
          Shell: 5.9 - /bin/zsh
          Binaries:
          Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
          npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
          pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
          Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
          Browsers:
          Chrome: 149.0.7827.115
          Safari: 26.5
          npmPackages:
          @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

          Activity

          Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

          Metadata

          Metadata

          Assignees

          No one assigned

            Labels

            Type

            No type

            Projects

            No projects

              Milestone

              No milestone

              Relationships

              None yet

              Development

              No branches or pull requests

              Issue actions

              , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
              Skip to content

              React-Router v8 #8958

              Description

              @abegehr

              Preliminary Checks

              Reproduction

              https://github.com/abegehr/rr8-clerk

              Publishable key

              pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

              Description

              React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
              Would be nice to get @clerk/react-router with react-router@8 support.

              Repro:

              1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
              2. Install clerk for RR: npm i @clerk/react-router
              3. Get an error:
              anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
              npm error code ERESOLVE
              npm error ERESOLVE unable to resolve dependency tree
              npm error
              npm error While resolving: rr8-clerk@undefined
              npm error Found: react-router@8.0.0
              npm error node_modules/react-router
              npm error react-router@"8.0.0" from the root project
              npm error
              npm error Could not resolve dependency:
              npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
              npm error node_modules/@clerk/react-router
              npm error @clerk/react-router@"*" from the root project
              npm error
              npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
              npm error
              npm error
              npm error For a full report see:
              npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
              npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

              Environment

              System:
              OS: macOS 26.5.1
              CPU: (8) arm64 Apple M2
              Memory: 188.14 MB / 16.00 GB
              Shell: 5.9 - /bin/zsh
              Binaries:
              Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
              npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
              pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
              Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
              Browsers:
              Chrome: 149.0.7827.115
              Safari: 26.5
              npmPackages:
              @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

              Activity

              Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

              Metadata

              Metadata

              Assignees

              No one assigned

                Labels

                Type

                No type

                Projects

                No projects

                  Milestone

                  No milestone

                  Relationships

                  None yet

                  Development

                  No branches or pull requests

                  Issue actions

                  , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
                  Skip to content

                  React-Router v8 #8958

                  Description

                  @abegehr

                  Preliminary Checks

                  Reproduction

                  https://github.com/abegehr/rr8-clerk

                  Publishable key

                  pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

                  Description

                  React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
                  Would be nice to get @clerk/react-router with react-router@8 support.

                  Repro:

                  1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
                  2. Install clerk for RR: npm i @clerk/react-router
                  3. Get an error:
                  anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
                  npm error code ERESOLVE
                  npm error ERESOLVE unable to resolve dependency tree
                  npm error
                  npm error While resolving: rr8-clerk@undefined
                  npm error Found: react-router@8.0.0
                  npm error node_modules/react-router
                  npm error react-router@"8.0.0" from the root project
                  npm error
                  npm error Could not resolve dependency:
                  npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
                  npm error node_modules/@clerk/react-router
                  npm error @clerk/react-router@"*" from the root project
                  npm error
                  npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
                  npm error
                  npm error
                  npm error For a full report see:
                  npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
                  npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

                  Environment

                  System:
                  OS: macOS 26.5.1
                  CPU: (8) arm64 Apple M2
                  Memory: 188.14 MB / 16.00 GB
                  Shell: 5.9 - /bin/zsh
                  Binaries:
                  Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
                  npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
                  pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
                  Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
                  Browsers:
                  Chrome: 149.0.7827.115
                  Safari: 26.5
                  npmPackages:
                  @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

                  Activity

                  Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

                  Metadata

                  Metadata

                  Assignees

                  No one assigned

                    Labels

                    Type

                    No type

                    Projects

                    No projects

                      Milestone

                      No milestone

                      Relationships

                      None yet

                      Development

                      No branches or pull requests

                      Issue actions

                      , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
                      Skip to content

                      React-Router v8 #8958

                      Description

                      @abegehr

                      Preliminary Checks

                      Reproduction

                      https://github.com/abegehr/rr8-clerk

                      Publishable key

                      pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

                      Description

                      React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
                      Would be nice to get @clerk/react-router with react-router@8 support.

                      Repro:

                      1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
                      2. Install clerk for RR: npm i @clerk/react-router
                      3. Get an error:
                      anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
                      npm error code ERESOLVE
                      npm error ERESOLVE unable to resolve dependency tree
                      npm error
                      npm error While resolving: rr8-clerk@undefined
                      npm error Found: react-router@8.0.0
                      npm error node_modules/react-router
                      npm error react-router@"8.0.0" from the root project
                      npm error
                      npm error Could not resolve dependency:
                      npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
                      npm error node_modules/@clerk/react-router
                      npm error @clerk/react-router@"*" from the root project
                      npm error
                      npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
                      npm error
                      npm error
                      npm error For a full report see:
                      npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
                      npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

                      Environment

                      System:
                      OS: macOS 26.5.1
                      CPU: (8) arm64 Apple M2
                      Memory: 188.14 MB / 16.00 GB
                      Shell: 5.9 - /bin/zsh
                      Binaries:
                      Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
                      npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
                      pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
                      Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
                      Browsers:
                      Chrome: 149.0.7827.115
                      Safari: 26.5
                      npmPackages:
                      @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

                      Activity

                      Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

                      Metadata

                      Metadata

                      Assignees

                      No one assigned

                        Labels

                        Type

                        No type

                        Projects

                        No projects

                          Milestone

                          No milestone

                          Relationships

                          None yet

                          Development

                          No branches or pull requests

                          Issue actions

                          , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
                          Skip to content

                          React-Router v8 #8958

                          Description

                          @abegehr

                          Preliminary Checks

                          Reproduction

                          https://github.com/abegehr/rr8-clerk

                          Publishable key

                          pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

                          Description

                          React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
                          Would be nice to get @clerk/react-router with react-router@8 support.

                          Repro:

                          1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
                          2. Install clerk for RR: npm i @clerk/react-router
                          3. Get an error:
                          anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
                          npm error code ERESOLVE
                          npm error ERESOLVE unable to resolve dependency tree
                          npm error
                          npm error While resolving: rr8-clerk@undefined
                          npm error Found: react-router@8.0.0
                          npm error node_modules/react-router
                          npm error react-router@"8.0.0" from the root project
                          npm error
                          npm error Could not resolve dependency:
                          npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
                          npm error node_modules/@clerk/react-router
                          npm error @clerk/react-router@"*" from the root project
                          npm error
                          npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
                          npm error
                          npm error
                          npm error For a full report see:
                          npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
                          npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

                          Environment

                          System:
                          OS: macOS 26.5.1
                          CPU: (8) arm64 Apple M2
                          Memory: 188.14 MB / 16.00 GB
                          Shell: 5.9 - /bin/zsh
                          Binaries:
                          Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
                          npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
                          pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
                          Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
                          Browsers:
                          Chrome: 149.0.7827.115
                          Safari: 26.5
                          npmPackages:
                          @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

                          Activity

                          Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

                          Metadata

                          Metadata

                          Assignees

                          No one assigned

                            Labels

                            Type

                            No type

                            Projects

                            No projects

                              Milestone

                              No milestone

                              Relationships

                              None yet

                              Development

                              No branches or pull requests

                              Issue actions

                              , 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
                              Skip to content

                              React-Router v8 #8958

                              Description

                              @abegehr

                              Preliminary Checks

                              Reproduction

                              https://github.com/abegehr/rr8-clerk

                              Publishable key

                              pk_test_c3VidGxlLWNhcmlib3UtMjguY2xlcmsuYWNjb3VudHMuZGV2JA

                              Description

                              React-router released version 8: https://www.npmjs.com/package/react-router and https://reactrouter.com/upgrading/future#update-to-latest-v8x
                              Would be nice to get @clerk/react-router with react-router@8 support.

                              Repro:

                              1. Init an RR app with npx create-react-router@latest, as per https://reactrouter.com/tutorials/quickstart
                              2. Install clerk for RR: npm i @clerk/react-router
                              3. Get an error:
                              anton@Antons-MBA rr8-clerk % npm i @clerk/react-router
                              npm error code ERESOLVE
                              npm error ERESOLVE unable to resolve dependency tree
                              npm error
                              npm error While resolving: rr8-clerk@undefined
                              npm error Found: react-router@8.0.0
                              npm error node_modules/react-router
                              npm error react-router@"8.0.0" from the root project
                              npm error
                              npm error Could not resolve dependency:
                              npm error peer react-router@"^7.9.0" from @clerk/react-router@3.4.7
                              npm error node_modules/@clerk/react-router
                              npm error @clerk/react-router@"*" from the root project
                              npm error
                              npm error Fix the upstream dependency conflict, or retry this command with --force or --legacy-peer-deps to accept an incorrect (and potentially broken) dependency resolution.
                              npm error
                              npm error
                              npm error For a full report see:
                              npm error /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-eresolve-report.txt
                              npm error A complete log of this run can be found in: /Users/anton/.npm/_logs/2026-06-22T23_12_59_011Z-debug-0.log

                              Environment

                              System:
                              OS: macOS 26.5.1
                              CPU: (8) arm64 Apple M2
                              Memory: 188.14 MB / 16.00 GB
                              Shell: 5.9 - /bin/zsh
                              Binaries:
                              Node: 24.16.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/node
                              npm: 11.13.0 - /Users/anton/.nvm/versions/node/v24.16.0/bin/npm
                              pnpm: 10.28.2 - /Users/anton/Library/pnpm/pnpm
                              Watchman: 2026.06.01.00 - /opt/homebrew/bin/watchman
                              Browsers:
                              Chrome: 149.0.7827.115
                              Safari: 26.5
                              npmPackages:
                              @react-router/dev: 8.0.0 => 8.0.0 @react-router/node: 8.0.0 => 8.0.0 @react-router/serve: 8.0.0 => 8.0.0 @tailwindcss/vite: ^4.2.2 => 4.3.1 @types/node: ^22 => 22.20.0 @types/react: ^19.2.14 => 19.2.17 @types/react-dom: ^19.2.3 => 19.2.3 isbot: ^5.1.36 => 5.1.44 react: ^19.2.7 => 19.2.7 react-dom: ^19.2.7 => 19.2.7 react-router: 8.0.0 => 8.0.0 tailwindcss: ^4.2.2 => 4.3.1 typescript: ^5.9.3 => 5.9.3 vite: ^8.0.3 => 8.0.16

                              Activity

                              Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

                              Metadata

                              Metadata

                              Assignees

                              No one assigned

                                Labels

                                Type

                                No type

                                Projects

                                No projects

                                  Milestone

                                  No milestone

                                  Relationships

                                  None yet

                                  Development

                                  No branches or pull requests

                                  Issue actions