Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: use getConfig not process.env #232

Merged
merged 3 commits into from
Nov 30, 2023
Merged

fix: use getConfig not process.env #232

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
4b2d65c
fix: use getConfig not process.env
cintnguyen Oct 27, 2023
d1bf6f9
Merge branch 'master' into runtime-config
deborahgu Nov 21, 2023
81ce59e
fix: properly use OPTIMIZELY_PROJECT_ID and increase test coverage
brian-smith-tcril Nov 29, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 0 additions & 11 deletions public/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,8 @@
<!doctype html>
<html lang="en-us" dir="ltr">
<head>
<title>Learner Dashboard | <%= process.env.SITE_NAME %></title>
deborahgu marked this conversation as resolved.
Show resolved Hide resolved
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="<%=htmlWebpackPlugin.options.FAVICON_URL%>" type="image/x-icon" />
<% if (process.env.OPTIMIZELY_URL) { %>
<script
src="<%= process.env.OPTIMIZELY_URL %>"
></script>
<% } else if (process.env.OPTIMIZELY_PROJECT_ID) { %>
<script
src="<%= process.env.MARKETING_SITE_BASE_URL %>/optimizelyjs/<%= process.env.OPTIMIZELY_PROJECT_ID %>.js"
></script>
<% } %>
</head>
<body>
<div id="root"></div>
Expand Down
28 changes: 22 additions & 6 deletions src/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@
import AppWrapper from 'containers/WidgetContainers/AppWrapper';
import LearnerDashboardHeader from 'containers/LearnerDashboardHeader';

import { getConfig } from '@edx/frontend-platform';
import messages from './messages';
import './App.scss';

Expand All @@ -41,8 +42,21 @@
const { supportEmail } = reduxHooks.usePlatformSettingsData();
const loadData = reduxHooks.useLoadData();

const optimizelyScript = () => {
if (getConfig().OPTIMIZELY_URL) {
return <script src={getConfig().OPTIMIZELY_URL} />;

Check warning on line 47 in src/App.jsx

View check run for this annotation

Codecov / codecov/patch

src/App.jsx#L47 

Added line #L47 was not covered by tests
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

missing test; could you add one?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tried tackling this in 370aa3f, ran into issues with runBasicTests() not respecting dynamic getConfig mocks. It seems to be a test scope issue. I am not quite sure what refactoring of App.test.jsx would be needed to get this working yet.

I will be out of office until end of next week, in the meantime @brian-smith-tcril and @httpsmenahassan have offered to take a look at this.

} if (getConfig().OPTIMIZELY_PROJECT_ID) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

missing test; could you add one?

return (

Check warning on line 49 in src/App.jsx

View check run for this annotation

Codecov / codecov/patch

src/App.jsx#L49 

Added line #L49 was not covered by tests
<script
src={`${getConfig().MARKETING_SITE_BASE_URL}/optimizelyjs/${getConfig().env.OPTIMIZELY_PROJECT_ID}.js`}
/>
);
}
return null;
};

React.useEffect(() => {
if (authenticatedUser?.administrator || process.env.NODE_ENV === 'development') {
if (authenticatedUser?.administrator || getConfig().NODE_ENV === 'development') {
window.loadEmptyData = () => {
loadData({ ...fakeData.globalData, courses: [] });
};
Expand All @@ -60,12 +74,12 @@
window.actions = actions;
window.track = track;
}
if (process.env.HOTJAR_APP_ID) {
if (getConfig().HOTJAR_APP_ID) {
try {
initializeHotjar({
hotjarId: process.env.HOTJAR_APP_ID,
hotjarVersion: process.env.HOTJAR_VERSION,
hotjarDebug: !!process.env.HOTJAR_DEBUG,
hotjarId: getConfig().HOTJAR_APP_ID,
hotjarVersion: getConfig().HOTJAR_VERSION,
hotjarDebug: !!getConfig().HOTJAR_DEBUG,
});
} catch (error) {
logError(error);
Expand All @@ -76,6 +90,8 @@
<>
<Helmet>
<title>{formatMessage(messages.pageTitle)}</title>
<link rel="shortcut icon" href={getConfig().FAVICON_URL} type="image/x-icon" />
deborahgu marked this conversation as resolved.
Show resolved Hide resolved
{optimizelyScript()}
</Helmet>
<div>
<AppWrapper>
Expand All @@ -93,7 +109,7 @@
)}
</main>
</AppWrapper>
<Footer logo={process.env.LOGO_POWERED_BY_OPEN_EDX_URL_SVG} />
<Footer logo={getConfig().LOGO_POWERED_BY_OPEN_EDX_URL_SVG} />
<ZendeskFab />
</div>
</>
Expand Down
8 changes: 6 additions & 2 deletions src/App.test.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,17 +37,21 @@ jest.mock('hooks', () => ({
}));
jest.mock('data/store', () => 'data/store');

const logo = 'fakeLogo.png';

jest.mock('@edx/frontend-platform', () => ({
getConfig: jest.fn(() => ({ LOGO_POWERED_BY_OPEN_EDX_URL_SVG: logo })),
}));

const loadData = jest.fn();
reduxHooks.useLoadData.mockReturnValue(loadData);

const logo = 'fakeLogo.png';
let el;

const supportEmail = 'test-support-url';
reduxHooks.usePlatformSettingsData.mockReturnValue({ supportEmail });

describe('App router component', () => {
process.env.LOGO_POWERED_BY_OPEN_EDX_URL_SVG = logo;
const { formatMessage } = useIntl();
describe('component', () => {
const runBasicTests = () => {
Expand Down
12 changes: 12 additions & 0 deletions src/__snapshots__/App.test.jsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,10 @@ exports[`App router component component initialize failure snapshot 1`] = `
<title>
Learner Home
</title>
<link
rel="shortcut icon"
type="image/x-icon"
/>
</HelmetWrapper>
<div>
<AppWrapper>
Expand Down Expand Up @@ -40,6 +44,10 @@ exports[`App router component component no network failure snapshot 1`] = `
<title>
Learner Home
</title>
<link
rel="shortcut icon"
type="image/x-icon"
/>
</HelmetWrapper>
<div>
<AppWrapper>
Expand Down Expand Up @@ -67,6 +75,10 @@ exports[`App router component component refresh failure snapshot 1`] = `
<title>
Learner Home
</title>
<link
rel="shortcut icon"
type="image/x-icon"
/>
</HelmetWrapper>
<div>
<AppWrapper>
Expand Down
4 changes: 2 additions & 2 deletions src/containers/LearnerDashboardHeader/BrandLogo.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ import React from 'react';
import { useIntl } from '@edx/frontend-platform/i18n';

import { reduxHooks } from 'hooks';
import { configuration } from '../../config';

import { getConfig } from '@edx/frontend-platform';
import messages from './messages';

export const BrandLogo = () => {
Expand All @@ -15,7 +15,7 @@ export const BrandLogo = () => {
<a href={dashboard?.url || '/'} className="mx-auto">
<img
className="logo py-3"
src={configuration.LOGO_URL}
src={getConfig().LOGO_URL}
alt={formatMessage(messages.logoAltText)}
/>
</a>
Expand Down
3 changes: 2 additions & 1 deletion src/widgets/ProductRecommendations/components/ProductCardHeader.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { getAuthenticatedUser } from '@edx/frontend-platform/auth';

import { Icon, Hyperlink } from '@edx/paragon';
import { ChevronRight } from '@edx/paragon/icons';
import { getConfig } from '@edx/frontend-platform';
import { trackProductHeaderClicked } from '../optimizelyExperiment';
import { recommendationsHeaderClicked } from '../track';
import { executiveEducation, bootCamp } from '../constants';
Expand Down Expand Up @@ -44,7 +45,7 @@ const ProductCardHeader = ({ courseType }) => {

const { formatMessage } = useIntl();
const productTypeDetail = getProductTypeDetail(courseType);
const headerUrl = `${process.env.MARKETING_SITE_BASE_URL}${productTypeDetail.url}`;
const headerUrl = `${getConfig().MARKETING_SITE_BASE_URL}${productTypeDetail.url}`;

return (
<div>
Expand Down
4 changes: 3 additions & 1 deletion src/widgets/ProductRecommendations/optimizely.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
import { createInstance, setLogLevel } from '@optimizely/react-sdk';

const OPTIMIZELY_SDK_KEY = process.env.OPTIMIZELY_FULL_STACK_SDK_KEY;
import { getConfig } from '@edx/frontend-platform';

const OPTIMIZELY_SDK_KEY = getConfig().OPTIMIZELY_FULL_STACK_SDK_KEY;

const configureClient = () => {
setLogLevel('error');
Expand Down
4 changes: 4 additions & 0 deletions src/widgets/ProductRecommendations/optimizely.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,10 @@ jest.mock('@optimizely/react-sdk', () => ({
setLogLevel: jest.fn(),
}));

jest.mock('@edx/frontend-platform', () => ({
getConfig: jest.fn(() => ({ OPTIMIZELY_FULL_STACK_SDK_KEY: 'SDK Key' })),
}));

describe('optimizelyClient', () => {
it('should configure an Optimizely client instance with the correct SDK key', () => {
expect(optimizelyClient).toBeDefined();
Expand Down