Error: Cannot read property 'getAuthState' of undefined

[niteshchaudhary]

Hi All, I am getting below error while running my app:

Error: Cannot read property 'getAuthState' of undefined
TypeError: Cannot read property 'getAuthState' of undefined
    at node_modules/@okta/src/Security.tsx:48:24
    at useReducer (node_modules/react-dom/cjs/react-dom-server.node.development.js:1194:57)
    at Object.useState (node_modules/react-dom/cjs/react-dom-server.node.development.js:1132:10)
    at Object.useState (node_modules/react/cjs/react.development.js:1497:21)
    at Security (node_modules/@okta/okta-react/bundles/okta-react.cjs.js:53:31)
    at processChild (node_modules/react-dom/cjs/react-dom-server.node.development.js:3043:14)
    at resolve (node_modules/react-dom/cjs/react-dom-server.node.development.js:2960:5)
    at ReactDOMServerRenderer.render (node_modules/react-dom/cjs/react-dom-server.node.development.js:3435:22)
    at ReactDOMServerRenderer.read (node_modules/react-dom/cjs/react-dom-server.node.development.js:3373:29)
    at renderToString (node_modules/react-dom/cjs/react-dom-server.node.development.js:3988:27)

below is the code:

import React from 'react';
import {StaticRouter, Route} from 'react-router-dom';
import { OktaAuth } from '@okta/okta-auth-js';
import {Security, SecureRoute, LoginCallback} from '@okta/okta-react';
import firstpage from './FirstPage';

const oktaAuth = new OktaAuth({
  issuer: 'https://abcdef.okta.com'',
  clientId: 'abcdabcd',
  redirectUri: window.location.origin + '/callback'
});

function Root() {
    return (
            <StaticRouter>
                <Security oktaAuth={oktaAuth}>
                    <SecureRoute
                        path="/abc/xyz"
                        component={firstpage}
                    />
                    <Route
                        path="/implicit/callback"
                        component={LoginCallback}
                    />
                </Security>
            </StaticRouter>
    );
}
export default hot(module)(Root);

"@okta/okta-auth-js": "^4.7.1",
"@okta/okta-react": "^4.1.0",

node -v = v12.21.0
npm -v = 6.14.11

can you suggest what could be the issue here?

[oleksandrpravosudko-okta]

Thanks for reaching out @niteshchaudhary.

It looks like you are attempting to run okta-react on a server side - this is currently not supported.

[cmacdonnacha]

I'm actually getting this same error while running tests with React testing Library + Jest. Any suggestions on how to fix it?

[DanielRuf]

Same here. It seems they do not fully support TypeScript projects and missed some declarations.

[shuowu]

Try moduleNameMapper in jest config, also see the example config here.