diff --git a/web/src/routes/Camera.jsx b/web/src/routes/Camera.jsx
index df09ffc7d..7f5527df4 100644
--- a/web/src/routes/Camera.jsx
+++ b/web/src/routes/Camera.jsx
@@ -83,26 +83,30 @@ export default function Camera({ camera }) {
let player;
if (viewMode === 'live') {
- player = <>
-
-
-
- >;
+ player = (
+
+
+
+
+
+ );
}
else if (viewMode === 'debug') {
- player = <>
-
+ player = (
+
+
-
- {showSettings ? : null}
- >;
+
+ {showSettings ? : null}
+
+ );
}
return (
diff --git a/web/src/routes/__tests__/Camera.test.jsx b/web/src/routes/__tests__/Camera.test.jsx
index c95a9a1d5..445b45302 100644
--- a/web/src/routes/__tests__/Camera.test.jsx
+++ b/web/src/routes/__tests__/Camera.test.jsx
@@ -32,7 +32,10 @@ describe('Camera Route', () => {
},
mockSetOptions,
]);
+
render();
+
+ fireEvent.click(screen.queryByText('Debug'));
fireEvent.click(screen.queryByText('Show Options'));
expect(screen.queryByTestId('mock-image')).toHaveTextContent(
'bbox=1×tamp=0&zones=1&mask=0&motion=1®ions=0'
@@ -47,6 +50,7 @@ describe('Camera Route', () => {
render();
+ fireEvent.click(screen.queryByText('Debug'));
fireEvent.click(screen.queryByText('Show Options'));
fireEvent.change(screen.queryByTestId('bbox-input'), { target: { checked: true } });
fireEvent.change(screen.queryByTestId('timestamp-input'), { target: { checked: true } });