chore: fix the e2e

Author: SoonIter

e2e/fixtures/plugin-preview-custom-entry/rspress.config.ts

@@ -18,10 +18,11 @@ createApp(App).mount('#root');
 `;
           }
           return `
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import ${JSON.stringify(entryCssPath)};
 import Demo from ${JSON.stringify(demoPath)};
-render(<Demo />, document.getElementById('root'));
+const container = document.getElementById('root');
+createRoot(container).render(<Demo />);
 `;
         },
         builderConfig: {

e2e/tests/api-docgen.test.ts

@@ -23,7 +23,7 @@ test.describe('api-docgen test', async () => {
 
   test('Index page', async ({ page }) => {
     await page.goto(`http://localhost:${appPort}`);
-    const table = await page.$('table');
+    const table = page.locator('table');
     const tableContent = await page.evaluate(table => table?.innerHTML, table);
 
     // Property

packages/plugin-preview/src/generate-entry.ts

@@ -25,10 +25,11 @@ export function generateEntry(
         `;
 
         const reactEntry = `
-        import { render } from 'react-dom';
+        import { createRoot } from 'react-dom/client';
         import ${JSON.stringify(entryCssPath)};
         import Demo from ${JSON.stringify(demoPath)};
-        render(<Demo />, document.getElementById('root'));
+        const container = document.getElementById('root');
+        createRoot(container).render(<Demo />);
         `;
         const entryContent = customEntry
           ? customEntry({
@@ -48,7 +49,7 @@ export function generateEntry(
         return;
       }
       const reactContent = `
-        import { render } from 'react-dom';
+        import { createRoot } from 'react-dom/client';
         import ${JSON.stringify(entryCssPath)};
         ${routes
           .map((demo, index) => {
@@ -67,7 +68,8 @@ export function generateEntry(
             </div>
           )
         }
-        render(<App /> , document.getElementById('root'));
+        const container = document.getElementById('root');
+        createRoot(container).render(<App />);
       `;
       const solidContent = `
         import { render } from 'solid-js/web';