[core] Remove Suspense and clock mocking from regressions and e2e tes…

…ts (mui#44935)
DiegoAndai · Jan 8, 2025 · 0332535 · 0332535
1 parent 5e1aa33
commit 0332535
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 32 deletions.
diff --git a/test/e2e/TestViewer.js b/test/e2e/TestViewer.js
@@ -13,11 +13,9 @@ function TestViewer(props) {
   }, []);
 
   return (
-    <React.Suspense fallback={<div aria-busy />}>
-      <div aria-busy={!ready} data-testid="testcase">
-        {children}
-      </div>
-    </React.Suspense>
+    <div aria-busy={!ready} data-testid="testcase">
+      {children}
+    </div>
   );
 }
 

diff --git a/test/regressions/TestViewer.js b/test/regressions/TestViewer.js
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { useFakeTimers } from 'sinon';
 import Box from '@mui/material/Box';
 import GlobalStyles from '@mui/material/GlobalStyles';
 import JoyBox from '@mui/joy/Box';
@@ -29,13 +28,6 @@ function TestViewer(props) {
     document.fonts.addEventListener('loading', handleFontsEvent);
     document.fonts.addEventListener('loadingdone', handleFontsEvent);
 
-    // Use a "real timestamp" so that we see a useful date instead of "00:00"
-    // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler -- useFakeTimers is not a React hook
-    // eslint-disable-next-line react-hooks/rules-of-hooks -- not a React hook
-    const clock = useFakeTimers({
-      now: new Date('Mon Aug 18 14:11:54 2014 -0500'),
-      toFake: ['Date'],
-    });
     // In case the child triggered font fetching we're not ready yet.
     // The fonts event handler will mark the test as ready on `loadingdone`
     if (document.fonts.status === 'loaded') {
@@ -45,7 +37,6 @@ function TestViewer(props) {
     return () => {
       document.fonts.removeEventListener('loading', handleFontsEvent);
       document.fonts.removeEventListener('loadingdone', handleFontsEvent);
-      clock.restore();
     };
   }, []);
 
@@ -76,29 +67,27 @@ function TestViewer(props) {
           },
         }}
       />
-      <React.Suspense fallback={<div aria-busy />}>
-        {window.location.pathname.startsWith('/docs-joy') ? (
-          <CssVarsProvider>
-            <JoyBox
-              aria-busy={!ready}
-              data-testid="testcase"
-              data-testpath={path}
-              sx={{ bgcolor: 'background.body', ...viewerBoxSx }}
-            >
-              {children}
-            </JoyBox>
-          </CssVarsProvider>
-        ) : (
-          <Box
+      {window.location.pathname.startsWith('/docs-joy') ? (
+        <CssVarsProvider>
+          <JoyBox
             aria-busy={!ready}
             data-testid="testcase"
             data-testpath={path}
-            sx={{ bgcolor: 'background.default', ...viewerBoxSx }}
+            sx={{ bgcolor: 'background.body', ...viewerBoxSx }}
           >
             {children}
-          </Box>
-        )}
-      </React.Suspense>
+          </JoyBox>
+        </CssVarsProvider>
+      ) : (
+        <Box
+          aria-busy={!ready}
+          data-testid="testcase"
+          data-testpath={path}
+          sx={{ bgcolor: 'background.default', ...viewerBoxSx }}
+        >
+          {children}
+        </Box>
+      )}
     </React.Fragment>
   );
 }