title: React + keycloak-js: #error=login_required loop when accessing home page
body: <p>I'm having some trouble performing Authentication using keycloak-js and @react-keycloak/web in a basic React app. My code looks as follows:</p>
  <p>index.js:</p>
  <pre><code>import React from 'react';
  import ReactDOM from 'react-dom/client';
  import { ReactKeycloakProvider } from &quot;@react-keycloak/web&quot;;
  import App from './App';
  import Keycloak from &quot;keycloak-js&quot;;
  
  import { Routes, Route, BrowserRouter } from 'react-router-dom';
  
  let keycloak = new Keycloak({
      url: &quot;http://localhost:8081/&quot;,
      realm: &quot;realm&quot;,
      clientId: &quot;realm-public&quot;,
      loadUserProfileAtStartup: false
  });
  
  keycloak.init({
      redirectUri: &quot;http://localhost:3000/home&quot;,
      pkceMethod: &quot;S256&quot;
  });
  
  const root = ReactDOM.createRoot(document.getElementById('root'));
  
  root.render(
      &lt;ReactKeycloakProvider authClient={keycloak}&gt;
          &lt;React.StrictMode&gt;
              &lt;BrowserRouter&gt;
                  &lt;Routes&gt;
                      &lt;Route path=&quot;/&quot; element={&lt;App keycloak={keycloak}/&gt;} /&gt;
                  &lt;/Routes&gt;
              &lt;/BrowserRouter&gt;
         &lt;/React.StrictMode&gt;
      &lt;/ReactKeycloakProvider&gt;
  );
  </code></pre>
  <p>App.js:</p>
  <pre><code>function App({keycloak}) {
      return (
          &lt;div&gt;
              &lt;p&gt; 12345 &lt;/p&gt;
              &lt;button onClick={() =&gt; keycloak.login()}&gt; Click me &lt;/button&gt;
          &lt;/div&gt;
      );
  }
  </code></pre>
  <p>The issue occurs when I visit http://localhost:3000/ . I get stuck in a loop redirecting to my redirectUri (http://localhost:3000/home) with an error=login_required message appended to it, which seemed especially odd as I hadn't set onLoad to login-required; the full URL is below</p>
  <p>http://localhost:3000/home#error=login_required&amp;state=0d0fffaa-66f3-4cb6-9764-26f34539b7c0</p>
  <p>Versions:</p>
  <ul>
  <li><strong>react: 18.2.0</strong></li>
  <li>@react-keycloak/web: 3.4.0</li>
  <li>react-router-dom: 6.3.0</li>
  <li>keycloak-js: 19.0.1</li>
  </ul>
  <p>Please let me know if any other info is needed. Any help is greatly appreciated.</p>
  <p><strong>EDIT:</strong> Removing the pkceMethod option from keycloak.init() fixes the issue. I want to use PKCE authentication however so this is not a viable solution.</p>