Commit 85843579 authored by René Dudfield's avatar René Dudfield
Browse files

frontend ErrorBoundary: Stop console spam under test, rename TEST_TZ

The environment variable was renamed, because we want to use it for
testing something which isn't the timezone.
parent ac179948
Showing with 46 additions and 32 deletions
+46 -32
......@@ -90,7 +90,7 @@
"start": "react-scripts start",
"prebuild": "npm run make-version",
"build": "if-env PUBLIC_URL react-scripts build || cross-env PUBLIC_URL=./ react-scripts build --max_old_space_size=768 && rimraf build/frontend/index.baseUrl.html",
"test": "cross-env TEST_TZ=true react-scripts test",
"test": "cross-env UNDER_TEST=true react-scripts test",
"eject": "react-scripts eject",
"lint": "eslint -c package.json --ext .js,.ts,.tsx src/ ../app/electron ../plugins/headlamp-plugin --ignore-pattern ../plugins/headlamp-plugin/template",
"format": "prettier --config package.json --write src ../app/electron ../plugins/headlamp-plugin/bin ../plugins/headlamp-plugin/lib ../plugins/headlamp-plugin/config ../plugins/headlamp-plugin/template ../plugins/headlamp-plugin/test*.js",
......
......@@ -19,30 +19,42 @@ const Template: Story<ErrorBoundaryProps> = args => (
<i>This is not failing.</i>
</ErrorBoundary>
);
export const NoProblem = Template.bind({});
const NoProblem = Template.bind({});
NoProblem.args = {};
const BrokenTemplate: Story<ErrorBoundaryProps> = args => (
<ErrorBoundary {...args}>
<BrokenComponent />
</ErrorBoundary>
);
export const BrokenNoFallback = BrokenTemplate.bind({});
BrokenNoFallback.args = {};
// Do not run these under test, because they emit lots of console.error logs.
// It's still useful to run them in the storybook, to see and test them manually.
type StoryOrNull = Story<ErrorBoundaryProps> | (() => void);
let BrokenNoFallback: StoryOrNull = () => 'disabled under test to avoid console spam';
let BrokenFallback: StoryOrNull = () => 'disabled under test to avoid console spam';
let BrokenFallbackElement: StoryOrNull = () => 'disabled under test to avoid console spam';
const BrokenFallbackTemplate: Story<ErrorBoundaryProps> = args => (
<ErrorBoundary {...args}>
<BrokenComponent />
</ErrorBoundary>
);
export const BrokenFallback = BrokenFallbackTemplate.bind({});
BrokenFallback.args = {
fallback: ({ error }: { error: Error }) => {
return <div>This is a fallback. Error msg: "{error}"</div>;
},
};
export const BrokenFallbackElement = BrokenFallbackTemplate.bind({});
BrokenFallback.args = {
fallback: <p>A simple element</p>,
};
if (process.env.UNDER_TEST !== 'true') {
// These are only seen in the storybook, not under test.
const BrokenTemplate: Story<ErrorBoundaryProps> = args => (
<ErrorBoundary {...args}>
<BrokenComponent />
</ErrorBoundary>
);
BrokenNoFallback = BrokenTemplate.bind({});
BrokenNoFallback.args = {};
const BrokenFallbackTemplate: Story<ErrorBoundaryProps> = args => (
<ErrorBoundary {...args}>
<BrokenComponent />
</ErrorBoundary>
);
BrokenFallback = BrokenFallbackTemplate.bind({});
BrokenFallback.args = {
fallback: ({ error }: { error: Error }) => {
return <div>This is a fallback. Error msg: "{error}"</div>;
},
};
BrokenFallbackElement = BrokenFallbackTemplate.bind({});
BrokenFallback.args = {
fallback: <p>A simple element</p>,
};
}
export { NoProblem, BrokenNoFallback, BrokenFallback, BrokenFallbackElement };
......@@ -4,22 +4,24 @@ exports[`Storyshots common/ErrorBoundary Broken Fallback 1`] = `
<div
id="root"
>
<p>
A simple element
</p>
disabled under test to avoid console spam
</div>
`;
exports[`Storyshots common/ErrorBoundary Broken Fallback Element 1`] = `
<div
id="root"
/>
>
disabled under test to avoid console spam
</div>
`;
exports[`Storyshots common/ErrorBoundary Broken No Fallback 1`] = `
<div
id="root"
/>
>
disabled under test to avoid console spam
</div>
`;
exports[`Storyshots common/ErrorBoundary No Problem 1`] = `
......
......@@ -46,7 +46,7 @@ export function timeAgo(date: DateParam, options: TimeAgoOptions = {}) {
const fromDate = new Date(date);
let now = new Date();
if (!!process.env.TEST_TZ) {
if (process.env.UNDER_TEST === 'true') {
// For testing, we consider the current moment to be 3 months from the dates we are testing.
const days = 24 * 3600 * 1000; // in ms
now = new Date(fromDate.getTime() + 90 * days);
......@@ -72,7 +72,7 @@ export function timeAgo(date: DateParam, options: TimeAgoOptions = {}) {
export function localeDate(date: DateParam) {
const options: Intl.DateTimeFormatOptions = { timeZoneName: 'short' };
if (process.env.TEST_TZ) {
if (process.env.UNDER_TEST === 'true') {
options.timeZone = 'UTC';
} else {
options.timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment