fixed tests, added built time to version info, fixed console err

frontend/build.sh

@@ -1,4 +1,10 @@
 #!/bin/sh
 set -e -x
-GIT_COMMIT=`git rev-parse HEAD`
-CI=true REACT_APP_GIT_SHA=${GIT_COMMIT} npm run build
+COMMIT=`git rev-parse HEAD`
+COMMIT_ABBREV=`git rev-parse --short HEAD`
+COMMIT_TIME=`git log -1 --format=%cd`
+CI=true \
+    REACT_APP_GIT_SHA=${COMMIT} \
+    REACT_APP_GIT_SHA_ABBREV=${COMMIT_ABBREV} \
+    REACT_APP_COMMIT_TIME=${COMMIT_TIME} \
+    npm run build

frontend/src/App.test.tsx

@@ -2,20 +2,20 @@ import React from 'react';
 import { render } from '@testing-library/react';
 import App from './App';
 
-test('renders Photos link', () => {
+test('renders home tab', () => {
   const { getByText } = render(<App />);
-  const linkElement = getByText(/Photos/i);
+  const linkElement = getByText(/home/i);
   expect(linkElement).toBeInTheDocument();
 });
 
-test('renders Monitoring link', () => {
+test('renders monitoring tab', () => {
   const { getByText } = render(<App />);
-  const linkElement = getByText(/Monitoring/i);
+  const linkElement = getByText(/monitoring/i);
   expect(linkElement).toBeInTheDocument();
 });
 
-test('renders Settings link', () => {
+test('renders settings link', () => {
   const { getByText } = render(<App />);
-  const linkElement = getByText(/Settings/i);
+  const linkElement = getByText(/settings/i);
   expect(linkElement).toBeInTheDocument();
 });

frontend/src/App.tsx

@@ -33,7 +33,7 @@ function TabPanel(props: TabPanelProps) {
     >
       {value === index && (
         <Box sx={{ p: 3 }}>
-          <Typography>{children}</Typography>
+          <Typography component={'span'}>{children}</Typography>
         </Box>
       )}
     </div>

frontend/src/components/SetupComponent.tsx

@@ -72,33 +72,33 @@ export default function SetupComponent() {
     <React.Fragment>
       <Grid container spacing={2}>
         <Grid item xs={6}>
-          <Typography gutterBottom>Time between captures (minutes):</Typography>
+          <Typography component={'span'} gutterBottom>Time between captures (minutes):</Typography>
         </Grid>
         <Grid item xs={6}>
           <TextField id="tfSecondsBetweenCaptures" type="number" onChange={handleTimeBetweenCapturesChanged} defaultValue={state.SecondsBetweenCaptures/60} inputProps={{ inputMode: 'numeric', pattern: '[0-9]+' }} />
         </Grid>
         <Grid item xs={6}>
-          <Typography gutterBottom>Delay within the hour before the first capture or -1 to disable (minutes):</Typography>
+          <Typography component={'span'} gutterBottom>Delay within the hour before the first capture or -1 to disable (minutes):</Typography>
         </Grid>
         <Grid item xs={6}>
           <TextField id="tfOffset" type="number" defaultValue={state.OffsetWithinHour} onChange={handleOffsetChanged} inputProps={{ inputMode: 'numeric', pattern: '-?[0-9]+' }} />
         </Grid>
         <Grid item xs={6}>
-          <Typography gutterBottom>Photo Resolution (pixels)</Typography>
+          <Typography component={'span'} gutterBottom>Photo Resolution (pixels)</Typography>
         </Grid>
         <Grid item xs={6}>
           <Select defaultValue={0}>
             <MenuItem value={0}>3280x2464</MenuItem>
           </Select>
         </Grid>
         <Grid item xs={6}>
-          <Typography gutterBottom>Rotation (degrees):</Typography>
+          <Typography component={'span'} gutterBottom>Rotation (degrees):</Typography>
         </Grid>
         <Grid item xs={6}>
           <TextField id="tfRotation" type="number" defaultValue={state.RotateBy} onChange={handleRotationChanged} inputProps={{ inputMode: 'numeric', pattern: '[0-9]+' }} />
         </Grid>
         <Grid item xs={6}>
-          <Typography gutterBottom>Photo Quality (0..100%):</Typography>
+          <Typography component={'span'} gutterBottom>Photo Quality (0..100%):</Typography>
         </Grid>
         <Grid item xs={6}>
           <TextField id="tfQuality" type="number" defaultValue={state.Quality} onChange={handleQualityChanged} inputProps={{ inputMode: 'numeric', pattern: '[0-9]+' }} />
@@ -114,7 +114,9 @@ export default function SetupComponent() {
       <Grid container spacing={2}>
         <Grid item xs={6} />
         <Grid item xs={6}>
-          Version: {process.env.REACT_APP_GIT_SHA && (<a href={"https://github.com/ingojaeckel/go-raspberry-pi-timelapse/commit/" + process.env.REACT_APP_GIT_SHA}>{process.env.REACT_APP_GIT_SHA}</a>)}
+          Version: {process.env.REACT_APP_GIT_SHA && (<span>
+              <a href={"https://github.com/ingojaeckel/go-raspberry-pi-timelapse/commit/" + process.env.REACT_APP_GIT_SHA}>{process.env.REACT_APP_GIT_SHA_ABBREV}</a> built {process.env.REACT_APP_COMMIT_TIME}
+            </span>)}
         </Grid>
       </Grid>
     </React.Fragment>