last issue

docs/data/material/getting-started/templates/sign-in-side/SignInCard.js

@@ -124,7 +124,6 @@ export default function SignInCard() {
         <FormControl>
           <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>
             <FormLabel htmlFor="password">Password</FormLabel>
-            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
             <Link
               component="button"
               type="button"

docs/data/material/getting-started/templates/sign-in-side/SignInCard.tsx

@@ -124,7 +124,6 @@ export default function SignInCard() {
         <FormControl>
           <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>
             <FormLabel htmlFor="password">Password</FormLabel>
-            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
             <Link
               component="button"
               type="button"

docs/data/material/getting-started/templates/sign-in/SignIn.js

@@ -186,7 +186,6 @@ export default function SignIn(props) {
             >
               Sign in
             </Button>
-            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
             <Link
               component="button"
               type="button"

docs/data/material/getting-started/templates/sign-in/SignIn.tsx

@@ -186,7 +186,6 @@ export default function SignIn(props: { disableCustomTheme?: boolean }) {
             >
               Sign in
             </Button>
-            {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
             <Link
               component="button"
               type="button"

docs/scripts/generateTemplateScreenshots.ts

@@ -24,6 +24,14 @@ import { chromium } from 'playwright';
  * - Set `chromium.launch({ headless: false })` in line:50 to see the browser
  */
 
+function sleep(duration: number): Promise<void> {
+  return new Promise<void>((resolve) => {
+    setTimeout(() => {
+      resolve();
+    }, duration);
+  });
+}
+
 const host = process.env.DEPLOY_PREVIEW || 'http://localhost:3000';
 
 /**
@@ -78,10 +86,9 @@ const names = new Set(process.argv.slice(2));
               await page.click('[data-screenshot="toggle-mode"]');
               await page.getByRole('menuitem').filter({ hasText: /dark/i }).click();
               await page.waitForLoadState('networkidle'); // changing to dark mode might trigger image loading
-              await page.screenshot({
-                path: outputPath,
-                animations: 'disabled',
-              });
+              await sleep(100); // give time for image decoding, resizing, rendering
+
+              await page.screenshot({ path: outputPath, animations: 'disabled' });
 
               await page.click('[data-screenshot="toggle-mode"]');
               await page
@@ -92,10 +99,9 @@ const names = new Set(process.argv.slice(2));
               await page.click('[data-screenshot="toggle-mode"]');
               await page.getByRole('option').filter({ hasText: /dark/i }).click();
               await page.waitForLoadState('networkidle'); // changing to dark mode might trigger image loading
-              await page.screenshot({
-                path: outputPath,
-                animations: 'disabled',
-              });
+              await sleep(100); // give time for image decoding, resizing, rendering
+
+              await page.screenshot({ path: outputPath, animations: 'disabled' });
 
               await page.click('[data-screenshot="toggle-mode"]');
               await page
@@ -105,10 +111,9 @@ const names = new Set(process.argv.slice(2));
             } else {
               await page.click('[data-screenshot="toggle-mode"]');
               await page.waitForLoadState('networkidle'); // changing to dark mode might trigger image loading
-              await page.screenshot({
-                path: outputPath,
-                animations: 'disabled',
-              });
+              await sleep(100); // give time for image decoding, resizing, rendering
+
+              await page.screenshot({ path: outputPath, animations: 'disabled' });
 
               await page.click('[data-screenshot="toggle-mode"]'); // switch back to light
             }