diff --git a/package-lock.json b/package-lock.json
index 79470a43..1d31fc30 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,20 +5,11 @@
"requires": true,
"dependencies": {
"@axa-fr/react-oidc-context": {
- "version": "3.1.6",
- "resolved": "https://registry.npmjs.org/@axa-fr/react-oidc-context/-/react-oidc-context-3.1.6.tgz",
- "integrity": "sha512-xG/lX+VUIP7URndf7TigVYmUjsZ97tukwAAs2d10O0RitKquPbt1ZjmK6Xulg1ztUBC94eAtjELXql16VZptWw==",
- "requires": {
- "@axa-fr/react-oidc-core": "^3.1.6",
- "prop-types": "^15.7.2"
- }
- },
- "@axa-fr/react-oidc-core": {
- "version": "3.1.6",
- "resolved": "https://registry.npmjs.org/@axa-fr/react-oidc-core/-/react-oidc-core-3.1.6.tgz",
- "integrity": "sha512-lYyR5kz5MlgSO903dT+AhePSXBRPa/rcFI16oUFrZCl99eVlWKeZU3RQ1uvyU0dGGslPhElL+JIZVUjFDwj3zQ==",
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/@axa-fr/react-oidc-context/-/react-oidc-context-4.0.0.tgz",
+ "integrity": "sha512-7zE+YdaZmVY+On0XJNOrVOWVSHQ8aYJLnajp9VntVGCxOF9AWMhT74hato3IxJzAENXQ+dlwUMgeEGGqQYAJWw==",
"requires": {
- "prop-types": "^15.7.2"
+ "@openid/appauth": "1.3.1"
}
},
"@axa-fr/react-toolkit-action": {
@@ -5251,6 +5242,31 @@
}
}
},
+ "@openid/appauth": {
+ "version": "1.3.1",
+ "resolved": "https://registry.npmjs.org/@openid/appauth/-/appauth-1.3.1.tgz",
+ "integrity": "sha512-e54kpi219wES2ijPzeHe1kMnT8VKH8YeTd1GAn9BzVBmutz3tBgcG1y8a4pziNr4vNjFnuD4W446Ua7ELnNDiA==",
+ "requires": {
+ "@types/base64-js": "^1.3.0",
+ "@types/jquery": "^3.5.5",
+ "base64-js": "^1.5.1",
+ "follow-redirects": "^1.13.3",
+ "form-data": "^4.0.0",
+ "opener": "^1.5.2"
+ },
+ "dependencies": {
+ "form-data": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz",
+ "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==",
+ "requires": {
+ "asynckit": "^0.4.0",
+ "combined-stream": "^1.0.8",
+ "mime-types": "^2.1.12"
+ }
+ }
+ }
+ },
"@pmmmwh/react-refresh-webpack-plugin": {
"version": "0.4.3",
"resolved": "https://registry.npmjs.org/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.4.3.tgz",
@@ -9620,6 +9636,11 @@
"@babel/types": "^7.3.0"
}
},
+ "@types/base64-js": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/@types/base64-js/-/base64-js-1.3.0.tgz",
+ "integrity": "sha512-ZmI0sZGAUNXUfMWboWwi4LcfpoVUYldyN6Oe0oJ5cCsHDU/LlRq8nQKPXhYLOx36QYSW9bNIb1vvRrD6K7Llgw=="
+ },
"@types/braces": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/@types/braces/-/braces-3.0.0.tgz",
@@ -9835,6 +9856,14 @@
}
}
},
+ "@types/jquery": {
+ "version": "3.5.13",
+ "resolved": "https://registry.npmjs.org/@types/jquery/-/jquery-3.5.13.tgz",
+ "integrity": "sha512-ZxJrup8nz/ZxcU0vantG+TPdboMhB24jad2uSap50zE7Q9rUeYlCF25kFMSmHR33qoeOgqcdHEp3roaookC0Sg==",
+ "requires": {
+ "@types/sizzle": "*"
+ }
+ },
"@types/json-schema": {
"version": "7.0.7",
"resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.7.tgz",
@@ -10021,6 +10050,11 @@
"@types/node": "*"
}
},
+ "@types/sizzle": {
+ "version": "2.3.3",
+ "resolved": "https://registry.npmjs.org/@types/sizzle/-/sizzle-2.3.3.tgz",
+ "integrity": "sha512-JYM8x9EGF163bEyhdJBpR2QX1R5naCJHC8ucJylJ3w9/CVBaskdQ8WqBf8MmQrd1kRvp/a4TS8HJ+bxzR7ZJYQ=="
+ },
"@types/source-list-map": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
@@ -13874,11 +13908,6 @@
"randomfill": "^1.0.3"
}
},
- "crypto-js": {
- "version": "4.0.0",
- "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.0.0.tgz",
- "integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg=="
- },
"crypto-random-string": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-1.0.0.tgz",
@@ -23117,30 +23146,6 @@
"resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz",
"integrity": "sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg=="
},
- "oidc-client": {
- "version": "1.11.5",
- "resolved": "https://registry.npmjs.org/oidc-client/-/oidc-client-1.11.5.tgz",
- "integrity": "sha512-LcKrKC8Av0m/KD/4EFmo9Sg8fSQ+WFJWBrmtWd+tZkNn3WT/sQG3REmPANE9tzzhbjW6VkTNy4xhAXCfPApAOg==",
- "requires": {
- "acorn": "^7.4.1",
- "base64-js": "^1.5.1",
- "core-js": "^3.8.3",
- "crypto-js": "^4.0.0",
- "serialize-javascript": "^4.0.0"
- },
- "dependencies": {
- "acorn": {
- "version": "7.4.1",
- "resolved": "https://registry.npmjs.org/acorn/-/acorn-7.4.1.tgz",
- "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A=="
- },
- "core-js": {
- "version": "3.9.1",
- "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.9.1.tgz",
- "integrity": "sha512-gSjRvzkxQc1zjM/5paAmL4idJBFzuJoo+jDjF1tStYFMV2ERfD02HhahhCGXUyHxQRG4yFKVSdO6g62eoRMcDg=="
- }
- }
- },
"on-finished": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
@@ -23185,6 +23190,11 @@
"integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==",
"dev": true
},
+ "opener": {
+ "version": "1.5.2",
+ "resolved": "https://registry.npmjs.org/opener/-/opener-1.5.2.tgz",
+ "integrity": "sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A=="
+ },
"opn": {
"version": "5.5.0",
"resolved": "https://registry.npmjs.org/opn/-/opn-5.5.0.tgz",
diff --git a/package.json b/package.json
index 9d019d3c..a3636d71 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,7 @@
}
},
"dependencies": {
- "@axa-fr/react-oidc-context": "3.1.6",
+ "@axa-fr/react-oidc-context": "4.0.0",
"@axa-fr/react-toolkit-all": "1.4.0",
"@axa-fr/react-toolkit-core": "1.4.0",
"@axa-fr/react-toolkit-modal-default": "1.3.23",
@@ -47,7 +47,6 @@
"lodash": "4.17.21",
"moment": "2.29.1",
"mw.validation": "1.0.15",
- "oidc-client": "1.11.5",
"prism-react-renderer": "1.2.1",
"prop-types": "15.7.2",
"react": "17.0.1",
diff --git a/public/environment.development.json b/public/environment.development.json
index 5d1362f8..e972513e 100644
--- a/public/environment.development.json
+++ b/public/environment.development.json
@@ -14,12 +14,7 @@
"isEnabled": true,
"client_id": "interactive.public",
"redirect_uri": "http://localhost:9999/authentication/callback",
- "response_type": "code",
- "post_logout_redirect_uri": "http://localhost:9999/",
"scope": "openid profile email api offline_access",
- "authority": "https://demo.identityserver.io",
- "silent_redirect_uri": "http://localhost:9999/authentication/silent_callback",
- "automaticSilentRenew": true,
- "loadUserInfo": true
+ "authority": "https://demo.identityserver.io"
}
}
diff --git a/src/App/App.js b/src/App/App.js
index 4e94bbf6..3e57c1ab 100644
--- a/src/App/App.js
+++ b/src/App/App.js
@@ -1,23 +1,40 @@
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
-import { AuthenticationProvider, oidcLog, InMemoryWebStorage } from '@axa-fr/react-oidc-context';
+import { OidcProvider, useOidcUser, useOidcAccessToken, OidcSecure } from '@axa-fr/react-oidc-context';
import Routes from 'Layout/Routes';
import UserProvider from 'App/UserProvider';
import FetchProvider from 'App/FetchProvider';
import NotificationProvider from 'App/NotificationProvider';
+import { PropTypes } from 'prop-types';
-const App = ({ oidc, fetchConfig, apiUrl, baseUrl }) => (
- <AuthenticationProvider loggerLevel={oidcLog.NONE} configuration={oidc} isEnabled={oidc.isEnabled} InMemoryWebStorage={InMemoryWebStorage}>
- <UserProvider>
- <FetchProvider apiUrl={apiUrl} fetchConfig={fetchConfig}>
- <NotificationProvider>
- <Router basename={baseUrl}>
- <Routes />
- </Router>
- </NotificationProvider>
- </FetchProvider>
+const App = ({ oidc, fetchConfig, apiUrl, baseUrl, OidcProviderCmpt, OidcSecureCmpt, useOidcUserFn, useOidcAccessTokenFn }) => (
+ <OidcProviderCmpt configuration={oidc}>
+ <UserProvider useOidcUser={useOidcUserFn}>
+ <OidcSecureCmpt>
+ <FetchProvider apiUrl={apiUrl} fetchConfig={fetchConfig} useOidcAccessToken={useOidcAccessTokenFn}>
+ <NotificationProvider>
+ <Router basename={baseUrl}>
+ <Routes />
+ </Router>
+ </NotificationProvider>
+ </FetchProvider>
+ </OidcSecureCmpt>
</UserProvider>
- </AuthenticationProvider>
+ </OidcProviderCmpt>
);
+App.propTypes = {
+ OidcProviderCmpt: PropTypes.func,
+ OidcSecureCmpt: PropTypes.func,
+ useOidcUserFn: PropTypes.func,
+ useOidcAccessTokenFn: PropTypes.func,
+};
+
+App.defaultProps = {
+ OidcProviderCmpt: OidcProvider,
+ OidcSecureCmpt: OidcSecure,
+ useOidcUserFn: useOidcUser,
+ useOidcAccessTokenFn: useOidcAccessToken,
+};
+
export default App;
diff --git a/src/App/App.test.js b/src/App/App.test.js
index e3c2a04d..29092c75 100644
--- a/src/App/App.test.js
+++ b/src/App/App.test.js
@@ -1,36 +1,26 @@
-import React from 'react';
+import React, { createContext } from 'react';
import { WrapperStaticRouter } from 'shared/testsUtils';
-import { render, act } from '@testing-library/react';
+import { render, act, waitFor } from '@testing-library/react';
import App from './App';
+const useOidcUserMock = jest.fn().mockReturnValue({
+ oidcUser: {
+ name: 'Samuel Gomez',
+ },
+});
+const useOidcAccessTokenMock = jest.fn().mockReturnValue({
+ accessToken: 'accessTokenfdsfdsqgvqvsqfs',
+});
+
const envMock = {
baseUrl: '/',
- oidc: {
- client_id: 'interactive.public',
- redirect_uri: 'http://localhost:3000/authentication/callback',
- response_type: 'code',
- post_logout_redirect_uri: 'http://localhost:3000/',
- scope: 'openid profile email api offline_access',
- authority: 'https://demo.identityserver.io',
- silent_redirect_uri: 'http://localhost:3000/authentication/silent_callback',
- automaticSilentRenew: true,
- loadUserInfo: true,
- isEnabled: false,
- client_name: 'client_name',
- grant_types: [''],
- application_type: 'application_type',
- response_types: ['response_type', 'response_type'],
- redirect_uris: ['redirect_uri/callback', 'redirect_uri/authentification/callback', 'redirect_uri/authentication/silent_callback'],
- subject_type: 'public',
- id_token_signed_response_alg: 'id_token_signed_response_alg',
- token_type: 'Bearer',
- iam_reference: 'iam_reference',
- triggerAuthFlow: true,
- },
+ OidcProviderCmpt: ({ children }) => <>{children}</>,
+ OidcSecureCmpt: ({ children }) => <>{children}</>,
+ useOidcUserFn: useOidcUserMock,
+ useOidcAccessTokenFn: useOidcAccessTokenMock,
};
-it('Should App render without crashing', async () => {
- await act(async () => {
- const { asFragment } = render(<App {...envMock} />, { wrapper: WrapperStaticRouter });
- expect(asFragment()).toMatchSnapshot();
- });
+
+it('Should render App', () => {
+ const { asFragment } = render(<App {...envMock} />, { wrapper: WrapperStaticRouter });
+ expect(asFragment()).toMatchSnapshot();
});
diff --git a/src/App/FetchProvider/FetchProvider.js b/src/App/FetchProvider/FetchProvider.js
index 080107a7..6774f676 100644
--- a/src/App/FetchProvider/FetchProvider.js
+++ b/src/App/FetchProvider/FetchProvider.js
@@ -1,7 +1,6 @@
-import React, { createContext, useContext } from 'react';
+import React, { createContext } from 'react';
import mergeObj from 'shared/helpers/mergeObj';
import { STATUS_API } from 'shared/constants';
-import { UserContext } from 'App/UserProvider';
export const FetchContext = createContext({ fetchCustom: fetch });
export const FetchContextProvider = FetchContext.Provider;
@@ -19,11 +18,11 @@ export const setFetchCustom = ({ apiUrl, fetchAuthConfig, fetchFn = fetch, merge
};
};
-const FetchProvider = ({ apiUrl, fetchConfig, children, mergeObjFn = mergeObj, setFetchCustomFn = setFetchCustom, UserContextObj = UserContext }) => {
- const { authAccessToken } = useContext(UserContextObj);
+const FetchProvider = ({ apiUrl, fetchConfig, children, useOidcAccessToken, mergeObjFn = mergeObj, setFetchCustomFn = setFetchCustom }) => {
+ const { accessToken } = useOidcAccessToken();
const authConfig = {
headers: {
- Authorization: `Bearer ${authAccessToken}`,
+ Authorization: `Bearer ${accessToken}`,
},
};
const fetchAuthConfig = mergeObjFn(fetchConfig, authConfig);
diff --git a/src/App/FetchProvider/FetchProvider.test.js b/src/App/FetchProvider/FetchProvider.test.js
index c000bd25..0f032841 100644
--- a/src/App/FetchProvider/FetchProvider.test.js
+++ b/src/App/FetchProvider/FetchProvider.test.js
@@ -15,17 +15,16 @@ const BaseWithFetch = () => {
return <Base {...fetchProps} />;
};
-const UserContext = createContext();
-const UserContextProvider = UserContext.Provider;
-
const Base = ({ fetchCustom }) => <div>{fetchCustom ? 'haveFetchCustom' : 'notHaveFetchCustom'}</div>;
+const useOidcAccessTokenMock = jest.fn().mockReturnValue({
+ accessToken: 'accessTokenfdsfdsqgvqvsqfs',
+});
+
const App = () => (
- <UserContextProvider value={{ authAccessToken: 'authAccessToken' }}>
- <FetchProvider apiUrl={apiMock} fetchConfig={fetchConfig} UserContextObj={UserContext}>
- <BaseWithFetch />
- </FetchProvider>
- </UserContextProvider>
+ <FetchProvider apiUrl={apiMock} fetchConfig={fetchConfig} useOidcAccessToken={useOidcAccessTokenMock}>
+ <BaseWithFetch />
+ </FetchProvider>
);
describe('setFetchCustom', () => {
diff --git a/src/App/UserProvider/UserProvider.js b/src/App/UserProvider/UserProvider.js
index 8a9fe17a..490087b2 100644
--- a/src/App/UserProvider/UserProvider.js
+++ b/src/App/UserProvider/UserProvider.js
@@ -1,11 +1,9 @@
import React, { createContext } from 'react';
import { get, isEmpty } from 'lodash';
-import { useReactOidc } from '@axa-fr/react-oidc-context';
import { PROFILS } from 'shared/constants';
export const UserContext = createContext({
authName: '',
- authAccessToken: '',
authRole: '',
authUid: '',
});
@@ -13,39 +11,29 @@ export const UserContextProvider = UserContext.Provider;
const NON_CONNECTE = 'Non Connecté';
-export const getAuthName = ({ oidcUser, isEmptyFn = isEmpty, getFn = get }) =>
- !isEmptyFn(getFn(oidcUser, 'profile.name')) ? oidcUser.profile.name : NON_CONNECTE;
-
-export const getAuthAccessToken = ({ oidcUser, isEmptyFn = isEmpty, getFn = get }) =>
- !isEmptyFn(getFn(oidcUser, 'access_token')) ? oidcUser.access_token : '';
+export const getAuthName = ({ oidcUser, isEmptyFn = isEmpty, getFn = get }) => (!isEmptyFn(getFn(oidcUser, 'name')) ? oidcUser.name : NON_CONNECTE);
export const setAuthRole = ({ memberOf, profils = PROFILS }) => profils.map(profil => (memberOf.search(`${profil}`) !== -1 ? profil : '')).join('');
export const getAuthRole = ({ oidcUser, setAuthRoleFn = setAuthRole, isEmptyFn = isEmpty, getFn = get }) =>
- !isEmptyFn(getFn(oidcUser, 'profile.member_of')) ? setAuthRoleFn({ memberOf: oidcUser.profile.member_of[0] }) : '';
+ !isEmptyFn(getFn(oidcUser, 'member_of')) ? setAuthRoleFn({ memberOf: oidcUser.member_of[0] }) : '';
export const getAuthUid = ({ oidcUser, isEmptyFn = isEmpty, getFn = get }) =>
- !isEmptyFn(getFn(oidcUser, 'profile.axa_uid_racf')) ? oidcUser.profile.axa_uid_racf : '';
+ !isEmptyFn(getFn(oidcUser, 'axa_uid_racf')) ? oidcUser.axa_uid_racf : '';
/**
*
* @param {Object} oidcUser
*/
-const extractDataFromOAuthToken = (
- oidcUser,
- getAuthNameFn = getAuthName,
- getAuthAccessTokenFn = getAuthAccessToken,
- getAuthRoleFn = getAuthRole,
- getAuthUidFn = getAuthUid,
-) => ({
+const extractDataFromOAuthToken = (oidcUser, getAuthNameFn = getAuthName, getAuthRoleFn = getAuthRole, getAuthUidFn = getAuthUid) => ({
authName: getAuthNameFn({ oidcUser }),
- authAccessToken: getAuthAccessTokenFn({ oidcUser }),
authRole: getAuthRoleFn({ oidcUser }),
authUid: getAuthUidFn({ oidcUser }),
});
-const UserProvider = ({ children, useReactOidcFn = useReactOidc }) => {
- const { oidcUser } = useReactOidcFn();
+const UserProvider = ({ children, useOidcUser }) => {
+ const { oidcUser } = useOidcUser();
return <UserContextProvider value={{ ...extractDataFromOAuthToken(oidcUser) }}>{children}</UserContextProvider>;
};
+
export default UserProvider;
diff --git a/src/App/UserProvider/UserProvider.test.js b/src/App/UserProvider/UserProvider.test.js
index 22857946..78facf9b 100644
--- a/src/App/UserProvider/UserProvider.test.js
+++ b/src/App/UserProvider/UserProvider.test.js
@@ -1,11 +1,10 @@
import React, { useContext } from 'react';
import { render } from '@testing-library/react';
-import UserProvider, { UserContext, getAuthName, getAuthAccessToken, getAuthRole, setAuthRole, getAuthUid } from './UserProvider';
+import UserProvider, { UserContext, getAuthName, getAuthRole, setAuthRole, getAuthUid } from './UserProvider';
-const Base = ({ authName, authAccessToken, authRole, authUid }) => (
+const Base = ({ authName, authRole, authUid }) => (
<ul>
<li>{authName ? 'have authName' : 'notHave authName'}</li>
- <li>{authAccessToken ? 'have authAccessToken' : 'notHave authAccessToken'}</li>
<li>{authRole ? 'have authRole' : 'notHave authRole'}</li>
<li>{authUid ? 'have authUid' : 'notHave authUid'}</li>
</ul>
@@ -17,85 +16,78 @@ const BaseWithUser = () => {
};
const oidcUser = {
- access_token: 'tokenid',
- profile: {
- name: 'FDS',
- member_of: ['CN=Admin'],
- axa_uid_racf: 'S000007',
- },
+ name: 'Bob Smith',
+ given_name: 'Bob',
+ family_name: 'Smith',
+ email: 'BobSmith@email.com',
+ email_verified: true,
+ website: 'http://bob.com',
+ sub: '11',
+ member_of: ['CN=Admin'],
+ axa_uid_racf: 'S000007',
};
+
const profils = ['Admin', 'USER'];
-const useReactOidcMock = jest.fn().mockReturnValue({
+
+const useOidcUserMock = jest.fn().mockReturnValue({
oidcUser,
});
const App = () => (
- <UserProvider useReactOidcFn={useReactOidcMock}>
+ <UserProvider useOidcUser={useOidcUserMock}>
<BaseWithUser />
</UserProvider>
);
describe('Render App with Base have user props', () => {
- it('Should Base have fetchCustom props when call setFetchCustom', () => {
+ it('Should Base have user props when render App with UserProvider', () => {
const { asFragment, getByText } = render(<App />);
expect(asFragment()).toMatchSnapshot();
expect(getByText('have authName')).toBeDefined();
- expect(getByText('have authAccessToken')).toBeDefined();
expect(getByText('have authRole')).toBeDefined();
expect(getByText('have authUid')).toBeDefined();
});
});
describe('getAuthName', () => {
- it('Should return FDS When getAuthName called with profile name "FDS" ', () => {
+ it('Should return "Bob Smith" when getAuthName called with profile name "Bob Smith" ', () => {
const result = getAuthName({ oidcUser });
- expect(result).toEqual('FDS');
+ expect(result).toEqual('Bob Smith');
});
- it('Should return "" When getAuthName called with no profile', () => {
+ it('Should return "" when getAuthName called with no name profile', () => {
const result = getAuthName({});
expect(result).toEqual('Non Connecté');
});
});
-describe('getAuthAccessToken', () => {
- it('Should return FDS When getAuthAccessToken called with access_token "tokenid" ', () => {
- const result = getAuthAccessToken({ oidcUser });
- expect(result).toEqual('tokenid');
- });
- it('Should return "" When getAuthAccessToken called with no access_token', () => {
- const result = getAuthAccessToken({});
- expect(result).toEqual('');
- });
-});
-
describe('getAuthRole', () => {
- it('Should return Admin When getAuthRole called with profile member_of "CN=Admin" ', () => {
+ it('Should return Admin when getAuthRole called with profile member_of "CN=Admin" ', () => {
const result = getAuthRole({ oidcUser, profils });
expect(result).toEqual('Admin');
});
- it('Should return "" When getAuthRole called with no profile member_of', () => {
+ it('Should return "" when getAuthRole called with no profile member_of', () => {
const result = getAuthRole({});
expect(result).toEqual('');
});
});
describe('getAuthUid', () => {
- it('Should return S000007 When getAuthUID called with profile axa_uid_racf = "S000007" ', () => {
+ it('Should return S000007 when getAuthUID called with profile axa_uid_racf = "S000007" ', () => {
const result = getAuthUid({ oidcUser });
expect(result).toEqual('S000007');
});
- it('Should return "" When getAuthUID called with no profile axa_uid_racf', () => {
+ it('Should return "" when getAuthUID called with no profile axa_uid_racf', () => {
const result = getAuthUid({});
expect(result).toEqual('');
});
});
describe('setAuthRole', () => {
- it('Should return Admin When memberOf contain Admin ', () => {
+ it('Should return Admin when memberOf contain Admin ', () => {
const result = setAuthRole({ memberOf: 'CN=Admin', profils });
expect(result).toEqual('Admin');
});
- it('Should return "" When memberOf not autorized', () => {
+ it('Should return "" when memberOf not autorized', () => {
const result = setAuthRole({ memberOf: 'CN=OTHER', profils });
expect(result).toEqual('');
});
diff --git a/src/App/UserProvider/__snapshots__/UserProvider.test.js.snap b/src/App/UserProvider/__snapshots__/UserProvider.test.js.snap
index 617d967e..6baa61f9 100644
--- a/src/App/UserProvider/__snapshots__/UserProvider.test.js.snap
+++ b/src/App/UserProvider/__snapshots__/UserProvider.test.js.snap
@@ -1,14 +1,11 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Render App with Base have user props Should Base have fetchCustom props when call setFetchCustom 1`] = `
+exports[`Render App with Base have user props Should Base have user props when render App with UserProvider 1`] = `
<DocumentFragment>
<ul>
<li>
have authName
</li>
- <li>
- have authAccessToken
- </li>
<li>
have authRole
</li>
diff --git a/src/App/__snapshots__/App.test.js.snap b/src/App/__snapshots__/App.test.js.snap
index 46e2991d..ab169e42 100644
--- a/src/App/__snapshots__/App.test.js.snap
+++ b/src/App/__snapshots__/App.test.js.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Should App render without crashing 1`] = `
+exports[`Should render App 1`] = `
<DocumentFragment>
<div
class="af-header"
@@ -47,7 +47,7 @@ exports[`Should App render without crashing 1`] = `
<span
class="af-info-user__name"
>
- Non Connecté
+ Samuel Gomez
</span>
</a>
</div>
diff --git a/src/Demos/Button/__tests__/__snapshots__/Button.test.js.snap b/src/Demos/Button/__tests__/__snapshots__/Button.test.js.snap
index cb94571d..8bf18b76 100644
--- a/src/Demos/Button/__tests__/__snapshots__/Button.test.js.snap
+++ b/src/Demos/Button/__tests__/__snapshots__/Button.test.js.snap
@@ -14,6 +14,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-classic\\">
+ <span className=\\"af-btn__text\\">Classic button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -419,6 +425,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"reverse\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-reverse\\">
+ <span className=\\"af-btn__text\\">Reversed button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -860,6 +872,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button disabled=\\"disabled\\" classModifier=\\"disabled\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-disabled\\">
+ <span className=\\"af-btn__text\\">Disabled button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -1338,6 +1356,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"success\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-success\\">
+ <span className=\\"af-btn__text\\">Success button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -1779,6 +1803,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"danger\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-danger\\">
+ <span className=\\"af-btn__text\\">Danger button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -2220,6 +2250,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"small\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-small\\">
+ <span className=\\"af-btn__text\\">OK</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -2662,6 +2698,13 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"hasiconRight\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-reverse-with-right-icon\\">
+ <span className=\\"af-btn__text\\">With right icon button</span>
+ <i className=\\"glyphicon glyphicon-arrowthin-right\\" />
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -3180,6 +3223,13 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button classModifier=\\"hasiconLeft\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-reverse-with-left-icon\\">
+ <i className=\\"glyphicon glyphicon-arrowthin-left\\" />
+ <span className=\\"af-btn__text\\">With left icon button</span>
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -3698,6 +3748,12 @@ exports[`<ButtonPage/> Should render ButtonPage 1`] = `
class="af-livecode"
>
<div
+ code="
+ <Button className=\\"af-btn--circle\\" type=\\"submit\\" onClick={e => console.log(e)} id=\\"btn-circle\\">
+ <i className=\\"glyphicon glyphicon-floppy-disk\\" />
+ </Button>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
diff --git a/src/Demos/Modal/__tests__/__snapshots__/Modal.container.test.js.snap b/src/Demos/Modal/__tests__/__snapshots__/Modal.container.test.js.snap
index ecd0c72d..a2ed57be 100644
--- a/src/Demos/Modal/__tests__/__snapshots__/Modal.container.test.js.snap
+++ b/src/Demos/Modal/__tests__/__snapshots__/Modal.container.test.js.snap
@@ -35,7 +35,7 @@ exports[`<ModalPageContainer/> Should render ModalPageContainer 1`] = `
<Button type=\\"submit\\" onClick={openModalConfirm}>
<span className=\\"af-btn__text\\">Click me to launch modal</span>
</Button>
- <Modal isOpen={setIsOpen()} onOutsideTap={(onCancel)} classModifier={classModifier}>
+ <Modal isOpen={setIsOpen()} onOutsideTap={onCancel} classModifier={classModifier}>
<ModalCommonHeader onCancel={onCancel} title=\\"Validation des informations générales\\" />
<ModalCommonBody>
<Alert classModifier=\\"info\\" icon=\\"info-sign\\" title=\\"Vous allez créer un nouvel élément.\\" />
@@ -62,7 +62,7 @@ exports[`<ModalPageContainer/> Should render ModalPageContainer 1`] = `
<Button type="submit" onClick={openModalConfirm}>
<span className="af-btn__text">Click me to launch modal</span>
</Button>
- <Modal isOpen={setIsOpen()} onOutsideTap={(onCancel)} classModifier={classModifier}>
+ <Modal isOpen={setIsOpen()} onOutsideTap={onCancel} classModifier={classModifier}>
<ModalCommonHeader onCancel={onCancel} title="Validation des informations générales" />
<ModalCommonBody>
<Alert classModifier="info" icon="info-sign" title="Vous allez créer un nouvel élément." />
@@ -429,24 +429,12 @@ exports[`<ModalPageContainer/> Should render ModalPageContainer 1`] = `
>
{
</span>
- <span
- class="token tag script language-javascript punctuation"
- style="color: rgb(248, 248, 242);"
- >
- (
- </span>
<span
class="token tag script language-javascript"
style="color: rgb(255, 121, 198);"
>
onCancel
</span>
- <span
- class="token tag script language-javascript punctuation"
- style="color: rgb(248, 248, 242);"
- >
- )
- </span>
<span
class="token tag script language-javascript punctuation"
style="color: rgb(248, 248, 242);"
diff --git a/src/Demos/Modal/__tests__/__snapshots__/Modal.test.js.snap b/src/Demos/Modal/__tests__/__snapshots__/Modal.test.js.snap
index d9521140..cd43d11c 100644
--- a/src/Demos/Modal/__tests__/__snapshots__/Modal.test.js.snap
+++ b/src/Demos/Modal/__tests__/__snapshots__/Modal.test.js.snap
@@ -29,6 +29,22 @@ exports[`<ModalPage/> Should render ModalPage 1`] = `
class="af-livecode"
>
<div
+ code="
+<>
+ <Button type=\\"submit\\" onClick={openModalConfirm}>
+ <span className=\\"af-btn__text\\">Click me to launch modal</span>
+ </Button>
+ <Modal isOpen={setIsOpen()} onOutsideTap={onCancel} classModifier={classModifier}>
+ <ModalCommonHeader onCancel={onCancel} title=\\"Validation des informations générales\\" />
+ <ModalCommonBody>
+ <Alert classModifier=\\"info\\" icon=\\"info-sign\\" title=\\"Vous allez créer un nouvel élément.\\" />
+ <p>Confirmez-vous vouloir valider avec les informations suivantes ?</p>
+ </ModalCommonBody>
+ <ModalCommonFooter cancelLabel=\\"Annuler\\" onCancel={onCancel} onSubmit={onCancel} confirmLabel=\\"Valider\\" confirmClassModifier=\\"\\" />
+ </Modal>
+</>
+"
+ language="jsx"
style="position: relative; text-align: left; box-sizing: border-box; padding: 0px; overflow: hidden; white-space: pre; font-family: monospace; color: rgb(248, 248, 242); background-color: rgb(40, 42, 54); font-size: 12px;"
>
<textarea
@@ -44,7 +60,7 @@ exports[`<ModalPage/> Should render ModalPage 1`] = `
<Button type="submit" onClick={openModalConfirm}>
<span className="af-btn__text">Click me to launch modal</span>
</Button>
- <Modal isOpen={isOpen} onOutsideTap={onCancel} classModifier={classModifier}>
+ <Modal isOpen={setIsOpen()} onOutsideTap={onCancel} classModifier={classModifier}>
<ModalCommonHeader onCancel={onCancel} title="Validation des informations générales" />
<ModalCommonBody>
<Alert classModifier="info" icon="info-sign" title="Vous allez créer un nouvel élément." />
@@ -364,10 +380,22 @@ exports[`<ModalPage/> Should render ModalPage 1`] = `
{
</span>
<span
- class="token tag script language-javascript"
- style="color: rgb(255, 121, 198);"
+ class="token tag script language-javascript function"
+ style="color: rgb(80, 250, 123);"
>
- isOpen
+ setIsOpen
+ </span>
+ <span
+ class="token tag script language-javascript punctuation"
+ style="color: rgb(248, 248, 242);"
+ >
+ (
+ </span>
+ <span
+ class="token tag script language-javascript punctuation"
+ style="color: rgb(248, 248, 242);"
+ >
+ )
</span>
<span
class="token tag script language-javascript punctuation"
diff --git a/src/Layout/Menu/Menu.container.test.js b/src/Layout/Menu/Menu.container.test.js
index 3bfec31a..6e409dcc 100644
--- a/src/Layout/Menu/Menu.container.test.js
+++ b/src/Layout/Menu/Menu.container.test.js
@@ -1,26 +1,23 @@
import React from 'react';
-import { render, screen, fireEvent, act } from '@testing-library/react';
+import { render, screen, fireEvent } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
import { WrapperStaticRouter } from 'shared/testsUtils';
-import withWrapperEnvAndAuth from 'shared/hoc/withWrapperEnvAndAuth';
+import withUser from 'shared/hoc/withUser';
import MenuEnhanced, { setPositionInit, setToggleMenu } from './Menu.container';
import MENU_ITEMS, { CLASS_BODY_MENU_OPEN } from './constants';
-const MenuEnhancedWithEnvAndAuth = withWrapperEnvAndAuth(MenuEnhanced);
+const MenuEnhancedWithUser = withUser(MenuEnhanced);
describe('<MenuEnhanced/>', () => {
- it('Render <Menu/>', async () => {
- await act(async () => {
- const { asFragment } = render(<MenuEnhancedWithEnvAndAuth menuItems={MENU_ITEMS} />, { wrapper: WrapperStaticRouter });
- expect(asFragment()).toMatchSnapshot();
- });
+ it('Render <Menu/>', () => {
+ const { asFragment } = render(<MenuEnhancedWithUser menuItems={MENU_ITEMS} />, { wrapper: WrapperStaticRouter });
+ expect(asFragment()).toMatchSnapshot();
});
- it('Should call toggle class body When click on button', async () => {
- await act(async () => {
- render(<MenuEnhancedWithEnvAndAuth menuItems={MENU_ITEMS} />, { wrapper: WrapperStaticRouter });
- fireEvent.click(screen.getByTitle('Toggle menu'));
- expect(document.querySelector('body').getAttribute('class')).toEqual('af-menu-open');
- });
+
+ it('Should call toggle class body When click on button', () => {
+ render(<MenuEnhancedWithUser menuItems={MENU_ITEMS} />, { wrapper: WrapperStaticRouter });
+ fireEvent.click(screen.getByTitle('Toggle menu'));
+ expect(document.querySelector('body').getAttribute('class')).toEqual('af-menu-open');
});
});
@@ -55,6 +52,7 @@ describe('setToggleMenu', () => {
},
},
};
+
it('Should setIsMenuVisible to be called with true and toggleClass to be called with "af-menu-open" when isVisible = false', () => {
setToggleMenu({ setIsMenuVisible: setIsMenuVisibleMock, isVisible: false, documentObj: documentMock });
expect(setIsMenuVisibleMock).toBeCalledWith(true);
diff --git a/src/Layout/Menu/Menu.test.js b/src/Layout/Menu/Menu.test.js
index 8edb3bff..25a2c473 100644
--- a/src/Layout/Menu/Menu.test.js
+++ b/src/Layout/Menu/Menu.test.js
@@ -1,17 +1,15 @@
import React from 'react';
-import { render, act } from '@testing-library/react';
+import { render } from '@testing-library/react';
import { WrapperStaticRouter } from 'shared/testsUtils';
-import withWrapperEnvAndAuth from 'shared/hoc/withWrapperEnvAndAuth';
+import withUser from 'shared/hoc/withUser';
import { Menu } from './Menu';
import MENU_ITEMS from './constants';
-const MenuWithEnvAndAuth = withWrapperEnvAndAuth(Menu);
+const MenuWithUser = withUser(Menu);
describe('<Menu/>', () => {
- it('Render <Menu/>', async () => {
- await act(async () => {
- const { asFragment } = render(<MenuWithEnvAndAuth menuItems={MENU_ITEMS} isVisible />, { wrapper: WrapperStaticRouter });
- expect(asFragment()).toMatchSnapshot();
- });
+ it('Render <Menu/>', () => {
+ const { asFragment } = render(<MenuWithUser menuItems={MENU_ITEMS} isVisible />, { wrapper: WrapperStaticRouter });
+ expect(asFragment()).toMatchSnapshot();
});
});
diff --git a/src/Layout/Menu/MenuItem/MenuItem.container.test.js b/src/Layout/Menu/MenuItem/MenuItem.container.test.js
index f34bb978..c11b497c 100644
--- a/src/Layout/Menu/MenuItem/MenuItem.container.test.js
+++ b/src/Layout/Menu/MenuItem/MenuItem.container.test.js
@@ -1,15 +1,15 @@
import React from 'react';
import { render, act } from '@testing-library/react';
import { WrapperStaticRouter } from 'shared/testsUtils';
-import withWrapperEnvAndAuth from 'shared/hoc/withWrapperEnvAndAuth';
+import withUser from 'shared/hoc/withUser';
import MenuItemEnhanced from './MenuItem.container';
-const MenuEnhancedWithEnvAndAuth = withWrapperEnvAndAuth(MenuItemEnhanced);
+const MenuEnhancedWithUser = withUser(MenuItemEnhanced);
describe('<MenuItemEnhanced/>', () => {
it('Render <Menu/>', async () => {
await act(async () => {
- const { asFragment } = render(<MenuEnhancedWithEnvAndAuth />, { wrapper: WrapperStaticRouter });
+ const { asFragment } = render(<MenuEnhancedWithUser />, { wrapper: WrapperStaticRouter });
expect(asFragment()).toMatchSnapshot();
});
});
@@ -17,7 +17,7 @@ describe('<MenuItemEnhanced/>', () => {
it('Render <Menu/> hasChild', async () => {
await act(async () => {
const { asFragment } = render(
- <MenuEnhancedWithEnvAndAuth>
+ <MenuEnhancedWithUser>
{[
{
label: 'Accueil',
@@ -32,7 +32,7 @@ describe('<MenuItemEnhanced/>', () => {
url: 'slash',
},
]}
- </MenuEnhancedWithEnvAndAuth>,
+ </MenuEnhancedWithUser>,
{ wrapper: WrapperStaticRouter },
);
expect(asFragment()).toMatchSnapshot();
diff --git a/src/Layout/Routes/Routes.js b/src/Layout/Routes/Routes.js
index fa67a89d..4a81b7e2 100644
--- a/src/Layout/Routes/Routes.js
+++ b/src/Layout/Routes/Routes.js
@@ -1,6 +1,5 @@
import React from 'react';
import { Switch, Route } from 'react-router-dom';
-import { withOidcSecure } from '@axa-fr/react-oidc-context';
import PageNotFound from 'NotFound';
import PageUnauthorize from 'Unauthorize';
import Members from 'Members';
@@ -21,12 +20,12 @@ export const renderLayoutButton = parentProps => props => Layout(Button, props,
const Routes = props => (
<Switch>
- <Route exact path={ROUTE_URL.DASHBOARD} render={withOidcSecure(renderLayoutDashboard(props))} />
- <Route exact path={ROUTE_URL.MEMBERS} render={withOidcSecure(renderLayoutMembers(props))} />
- <Route exact path={ROUTE_URL.SEARCHMEMBERS} render={withOidcSecure(renderLayoutSearchMembers(props))} />
- <Route exact path={ROUTE_URL.SLASH} render={withOidcSecure(renderLayoutSlashDesignSystem(props))} />
- <Route exact path={ROUTE_URL.MODAL} render={withOidcSecure(renderLayoutModal(props))} />
- <Route exact path={ROUTE_URL.BUTTON} render={withOidcSecure(renderLayoutButton(props))} />
+ <Route exact path={ROUTE_URL.DASHBOARD} render={renderLayoutDashboard(props)} />
+ <Route exact path={ROUTE_URL.MEMBERS} render={renderLayoutMembers(props)} />
+ <Route exact path={ROUTE_URL.SEARCHMEMBERS} render={renderLayoutSearchMembers(props)} />
+ <Route exact path={ROUTE_URL.SLASH} render={renderLayoutSlashDesignSystem(props)} />
+ <Route exact path={ROUTE_URL.MODAL} render={renderLayoutModal(props)} />
+ <Route exact path={ROUTE_URL.BUTTON} render={renderLayoutButton(props)} />
<Route exact path={ROUTE_URL.UNAUTHORIZE} component={PageUnauthorize} />
<Route component={PageNotFound} />
</Switch>
diff --git a/src/Layout/Routes/Routes.test.js b/src/Layout/Routes/Routes.test.js
index da4f381d..03452a20 100644
--- a/src/Layout/Routes/Routes.test.js
+++ b/src/Layout/Routes/Routes.test.js
@@ -1,7 +1,6 @@
import React from 'react';
import { MemoryRouter } from 'react-router-dom';
-import { render, act } from '@testing-library/react';
-import { AuthenticationProvider } from '@axa-fr/react-oidc-context';
+import { render } from '@testing-library/react';
import MembersPage from 'Members';
import DashboardPage from 'Dashboard';
import SlashDesignSystemPage from 'SlashDesignSystem';
@@ -18,52 +17,31 @@ import {
} from './Routes';
import Routes from '.';
-const oidc = {
- isEnabled: true,
- client_id: '0123456',
- redirect_uri: 'http://localhost:3000/authentication/callback',
- response_type: 'code',
- post_logout_redirect_uri: 'http://localhost:3000/logout',
- scope: 'openid profile email',
- authority: 'https://autority/',
- silent_redirect_uri: 'http://localhost:3000/authentication/silent_callback',
- automaticSilentRenew: true,
- loadUserInfo: true,
- triggerAuthFlow: true,
-};
-
describe('Route', () => {
- it('Should render Routes', async () => {
- await act(async () => {
- const { asFragment } = render(
- <MemoryRouter initialEntries={['/']}>
- <AuthenticationProvider configuration={oidc} isEnabled>
- <Routes />
- </AuthenticationProvider>
- </MemoryRouter>,
- );
- expect(asFragment()).toMatchSnapshot();
- });
+ it('Should render Routes', () => {
+ const { asFragment } = render(
+ <MemoryRouter initialEntries={['/']}>
+ <Routes />
+ </MemoryRouter>,
+ );
+ expect(asFragment()).toMatchSnapshot();
});
- it('NotFound Page', async () => {
- await act(async () => {
- const { asFragment } = render(
- <MemoryRouter initialEntries={['/random']}>
- <AuthenticationProvider configuration={oidc} isEnabled={false}>
- <Routes />
- </AuthenticationProvider>
- </MemoryRouter>,
- );
+ it('NotFound Page', () => {
+ const { asFragment } = render(
+ <MemoryRouter initialEntries={['/random']}>
+ <Routes />
+ </MemoryRouter>,
+ );
- expect(asFragment()).toMatchSnapshot();
- });
+ expect(asFragment()).toMatchSnapshot();
});
const parentProps = {
authName: 'Bob Smith',
authRole: 'admin',
};
+
it('Should return <MembersPage /> with props when call renderLayoutMembers', () => {
const customProps = {
myProp: 'property members',
@@ -72,6 +50,7 @@ describe('Route', () => {
expect(result.type).toEqual(MembersPage);
expect(result.props.myProp).toEqual('property members');
});
+
it('Should return <DashboardPage /> with props when call renderLayoutDashboard', () => {
const customProps = {
myProp: 'property dashboard',
@@ -80,6 +59,7 @@ describe('Route', () => {
expect(result.type).toEqual(DashboardPage);
expect(result.props.myProp).toEqual('property dashboard');
});
+
it('Should return <SlashDesignSystemPage /> with props when call renderLayoutSlashDesignSystem', () => {
const customProps = {
myProp: 'property slash',
diff --git a/src/Layout/Routes/__snapshots__/Routes.test.js.snap b/src/Layout/Routes/__snapshots__/Routes.test.js.snap
index 282f3c1b..c09fdc11 100644
--- a/src/Layout/Routes/__snapshots__/Routes.test.js.snap
+++ b/src/Layout/Routes/__snapshots__/Routes.test.js.snap
@@ -63,22 +63,333 @@ exports[`Route NotFound Page 1`] = `
exports[`Route Should render Routes 1`] = `
<DocumentFragment>
<div
- class="oidc-authenticating"
+ class="af-header"
>
<div
- class="oidc-authenticating__container"
+ class="container af-header__wrapper"
+ >
+ <header
+ class="af-header__content"
+ role="banner"
+ >
+ <div
+ class="af-header__name"
+ >
+ <a
+ class="af-logo"
+ href="/"
+ >
+ <img
+ alt="Toolkit React Starter"
+ class="af-logo__brand"
+ src="slash-logo.svg"
+ />
+ </a>
+ <h2
+ class="af-header__title"
+ >
+ Toolkit React Starter
+ <span
+ class="af-header__subtitle"
+ >
+ by Slash Design System
+ </span>
+ </h2>
+ </div>
+ <div
+ class="af-info-user"
+ >
+ <a
+ class="af-info-user__link"
+ href="#"
+ title="Voir mon profil"
+ >
+ <span
+ class="af-info-user__name"
+ />
+ </a>
+ </div>
+ </header>
+ </div>
+ </div>
+ <div
+ class="af-nav-container"
+ >
+ <button
+ aria-controls="mainmenu"
+ aria-haspopup="true"
+ class="mask fade "
+ id="togglemenu"
+ type="button"
+ />
+ <nav
+ aria-label="Menu principal"
+ class="af-nav af-drawer left "
+ role="navigation"
+ >
+ <div
+ class="container af-nav__wrapper"
+ >
+ <div
+ class="af-nav__aside-header"
+ >
+ <h4
+ class="af-nav__aside-title"
+ >
+ Menu
+ </h4>
+ <button
+ aria-controls="mainmenu"
+ aria-haspopup="true"
+ class="af-nav__aside-close"
+ id="togglemenu"
+ type="button"
+ >
+ ×
+ </button>
+ </div>
+ <ul
+ aria-labelledby="togglemenu"
+ class="af-nav__list "
+ id="mainmenu"
+ role="menubar"
+ >
+ <li
+ class="af-nav__item af-nav__item--active "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Accueil"
+ class="af-nav__link"
+ href="/"
+ role="menuitem"
+ tabindex="0"
+ >
+ Accueil
+ </a>
+ </li>
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Membres"
+ class="af-nav__link"
+ href="/members"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Membres
+ </a>
+ </li>
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Rechercher"
+ class="af-nav__link"
+ href="/search-members"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Rechercher
+ </a>
+ </li>
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Slash DS"
+ class="af-nav__link"
+ href="/slash-design-system"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Slash DS
+ </a>
+ </li>
+ <li
+ class="af-nav__item af-nav__item--haschild "
+ role="none"
+ >
+ <span
+ aria-expanded="false"
+ class="af-nav__link"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Demos
+ </span>
+ <i
+ class="glyphicon glyphicon-arrow-xs-down"
+ />
+ <ul
+ aria-label=""
+ class="af-nav__list af-nav__list--children"
+ role="menu"
+ >
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Modal"
+ class="af-nav__link"
+ href="/demos/modal"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Modal
+ </a>
+ </li>
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Button"
+ class="af-nav__link"
+ href="/demos/button"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Button
+ </a>
+ </li>
+ </ul>
+ </li>
+ <li
+ class="af-nav__item af-nav__item--haschild "
+ role="none"
+ >
+ <span
+ aria-expanded="false"
+ class="af-nav__link"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Pages
+ </span>
+ <i
+ class="glyphicon glyphicon-arrow-xs-down"
+ />
+ <ul
+ aria-label=""
+ class="af-nav__list af-nav__list--children"
+ role="menu"
+ >
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Not found"
+ class="af-nav__link"
+ href="/notfound"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Not found
+ </a>
+ </li>
+ <li
+ class="af-nav__item "
+ role="none"
+ >
+ <a
+ aria-expanded="false"
+ aria-haspopup="true"
+ aria-label="Forbidden"
+ class="af-nav__link"
+ href="/forbidden"
+ role="menuitem"
+ tabindex="-1"
+ >
+ Forbidden
+ </a>
+ </li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </nav>
+ </div>
+ <a
+ aria-controls="mainmenu"
+ aria-haspopup="true"
+ class="btn af-title-bar__mobile-menu af-btn--circle"
+ href="#"
+ id="togglemenu"
+ role="button"
+ tabindex="0"
+ title="Toggle menu"
+ >
+ <i
+ class="glyphicon glyphicon-menu-hamburger"
+ />
+ </a>
+ <div
+ class="af-title-bar"
+ >
+ <div
+ class="container af-title-bar__wrapper"
>
<h1
- class="oidc-authenticating__title"
+ class="af-title-bar__title"
>
- Authentification en cours
+ Accueil
</h1>
- <p
- class="oidc-authenticating__content"
- >
- Vous allez être redirigé sur la page de login
- </p>
</div>
</div>
+ <div
+ class="af-main container"
+ >
+ <h1
+ class="af-title--content"
+ >
+ Tableau de bord
+ </h1>
+ </div>
+ <footer
+ class="af-footer"
+ >
+ <div
+ class="container-fluid container"
+ >
+ <a
+ class="af-logo"
+ href="https://www.axa.fr/"
+ target="blank"
+ title="Site Axa"
+ >
+ <img
+ alt="Logo Axa"
+ class="af-logo__brand"
+ src="logo-axa.svg"
+ />
+ </a>
+ <div
+ class="af-footer-content"
+ >
+ © 2020 AXA Tous droits réservés - v0.1.1
+ </div>
+ </div>
+ </footer>
</DocumentFragment>
`;
diff --git a/src/shared/hoc/withUser.js b/src/shared/hoc/withUser.js
new file mode 100644
index 00000000..71983f93
--- /dev/null
+++ b/src/shared/hoc/withUser.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import { UserContextProvider } from 'App/UserProvider/UserProvider';
+
+const withUser = Component => props => (
+ <UserContextProvider value={{ authRole: 'ADMIN' }}>
+ <Component {...props} />
+ </UserContextProvider>
+);
+
+export default withUser;
diff --git a/src/shared/hoc/withWrapperEnvAndAuth.js b/src/shared/hoc/withWrapperEnvAndAuth.js
index 8408b40f..192c1719 100644
--- a/src/shared/hoc/withWrapperEnvAndAuth.js
+++ b/src/shared/hoc/withWrapperEnvAndAuth.js
@@ -2,7 +2,7 @@
* This HOC is useful for testing components that need to be wwrapped by environment and authentication providers
*/
import React from 'react';
-import { AuthenticationProvider } from '@axa-fr/react-oidc-context';
+import { OidcProvider } from '@axa-fr/react-oidc-context';
import EnvironmentProvider from 'App/EnvironmentProvider';
const oidc = {
@@ -21,8 +21,8 @@ const oidc = {
export default Component => props => (
<EnvironmentProvider value={{ environment: { oidc } }}>
- <AuthenticationProvider configuration={oidc} isEnabled>
+ <OidcProvider configuration={oidc} isEnabled>
<Component {...props} />
- </AuthenticationProvider>
+ </OidcProvider>
</EnvironmentProvider>
);