diff --git a/packages/okta-react/CHANGELOG.md b/packages/okta-react/CHANGELOG.md
index 1628ec6a8..96ae5e036 100644
--- a/packages/okta-react/CHANGELOG.md
+++ b/packages/okta-react/CHANGELOG.md
@@ -1,3 +1,9 @@
+# 2.0.1
+
+### Bug Fixes
+
+- [#700](https://github.com/okta/okta-oidc-js/pull/700) LoginCallback: render error as string
+
# 2.0.0
### Features
diff --git a/packages/okta-react/package.json b/packages/okta-react/package.json
index 36c80fd65..eb77f1ebf 100644
--- a/packages/okta-react/package.json
+++ b/packages/okta-react/package.json
@@ -1,6 +1,6 @@
{
"name": "@okta/okta-react",
- "version": "2.0.0",
+ "version": "2.0.1",
"description": "React support for Okta",
"main": "./dist/index.js",
"scripts": {
diff --git a/packages/okta-react/src/LoginCallback.js b/packages/okta-react/src/LoginCallback.js
index e8724a602..214b27898 100644
--- a/packages/okta-react/src/LoginCallback.js
+++ b/packages/okta-react/src/LoginCallback.js
@@ -21,7 +21,7 @@ const LoginCallback = () => {
}, [authService]);
if(authState.error) {
- return
${authState.error}
;
+ return {authState.error.toString()}
;
}
return null;
diff --git a/packages/okta-react/test/jest/loginCallback.test.js b/packages/okta-react/test/jest/loginCallback.test.js
new file mode 100644
index 000000000..748a4e335
--- /dev/null
+++ b/packages/okta-react/test/jest/loginCallback.test.js
@@ -0,0 +1,101 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import LoginCallback from '../../src/LoginCallback';
+import Security from '../../src/Security';
+import AuthSdkError from '@okta/okta-auth-js/lib/errors/AuthSdkError';
+import AuthApiError from '@okta/okta-auth-js/lib/errors/AuthApiError';
+import OAuthError from '@okta/okta-auth-js/lib/errors/OAuthError';
+
+describe('', () => {
+ let authService;
+ let authState;
+ let mockProps;
+ beforeEach(() => {
+ authState = {
+ isPending: true
+ };
+ authService = {
+ on: jest.fn(),
+ updateAuthState: jest.fn(),
+ getAuthState: jest.fn().mockImplementation(() => authState),
+ handleAuthentication: jest.fn()
+ };
+ mockProps = { authService };
+ });
+
+ it('renders the component', () => {
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.find(LoginCallback).length).toBe(1);
+ expect(wrapper.text()).toBe('');
+ });
+
+ it('calls handleAuthentication', () => {
+ mount(
+
+
+
+ );
+ expect(authService.handleAuthentication).toHaveBeenCalledTimes(1);
+ });
+
+ it('renders empty by default', () => {
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.text()).toBe('');
+ });
+
+ describe('shows errors', () => {
+ test('generic', () => {
+ const errorMessage = 'I am a test error message';
+ authState.error = new Error(errorMessage);
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.text()).toBe(`Error: ${errorMessage}`);
+ });
+ test('AuthSdkError', () => {
+ const errorMessage = 'I am a test error message';
+ authState.error = new AuthSdkError(errorMessage);
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.text()).toBe(`AuthSdkError: ${errorMessage}`);
+ });
+ test('AuthApiError', () => {
+ const errorSummary = 'I am a test error message';
+ authState.error = new AuthApiError({ errorSummary });
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.text()).toBe(`AuthApiError: ${errorSummary}`);
+ });
+ test('OAuthError', () => {
+ const errorCode = 400;
+ const errorSummary = 'I am a test error message';
+ authState.error = new OAuthError(errorCode, errorSummary);
+ const wrapper = mount(
+
+
+
+ );
+ expect(wrapper.text()).toBe(`OAuthError: ${errorSummary}`);
+ });
+ });
+
+
+
+
+});