Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

chore(ui): update to react 18

Browse source
This commit is contained in:
Simon Knott 2024-08-08 14:46:34 +02:00
parent 05732b50c8
commit 28c37e060e
No known key found for this signature in database
GPG key ID: 8CEDC00028084AEC
5 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/html-reporter/src/index.tsx
View file

@ -19,7 +19,7 @@ import type zip from '@zip.js/zip.js';
// @ts-ignore // @ts-ignore
import * as zipImport from '@zip.js/zip.js/lib/zip-no-worker-inflate.js'; import * as zipImport from '@zip.js/zip.js/lib/zip-no-worker-inflate.js';
import * as React from 'react'; import * as React from 'react';
import * as ReactDOM from 'react-dom'; import * as ReactDOM from 'react-dom/client';
import './colors.css'; import './colors.css';
import type { LoadedReport } from './loadedReport'; import type { LoadedReport } from './loadedReport';
import { ReportView } from './reportView'; import { ReportView } from './reportView';
@ -44,7 +44,7 @@ const ReportLoader: React.FC = () => {
}; };
window.onload = () => { window.onload = () => {
ReactDOM.render(<ReportLoader />, document.querySelector('#root')); ReactDOM.createRoot(document.querySelector('#root')!).render(<ReportLoader />);
}; };
class ZipReport implements LoadedReport { class ZipReport implements LoadedReport {

2
packages/recorder/src/index.tsx
View file

@ -17,11 +17,11 @@
import '@web/common.css'; import '@web/common.css';
import { applyTheme } from '@web/theme'; import { applyTheme } from '@web/theme';
import '@web/third_party/vscode/codicon.css'; import '@web/third_party/vscode/codicon.css';
import * as React from 'react';
import * as ReactDOM from 'react-dom'; import * as ReactDOM from 'react-dom';
import { Main } from './main'; import { Main } from './main';
(async () => { (async () => {
applyTheme(); applyTheme();
// we'd like to migrate this to React 18, but concurrent mode seems to break some of our tests.
ReactDOM.render(<Main/>, document.querySelector('#root')); ReactDOM.render(<Main/>, document.querySelector('#root'));
})(); })();

4
packages/trace-viewer/src/embedded.tsx
View file

@ -17,7 +17,7 @@
import '@web/common.css'; import '@web/common.css';
import { applyTheme } from '@web/theme'; import { applyTheme } from '@web/theme';
import '@web/third_party/vscode/codicon.css'; import '@web/third_party/vscode/codicon.css';
import * as ReactDOM from 'react-dom'; import * as ReactDOM from 'react-dom/client';
import { EmbeddedWorkbenchLoader } from './ui/embeddedWorkbenchLoader'; import { EmbeddedWorkbenchLoader } from './ui/embeddedWorkbenchLoader';
(async () => { (async () => {
@ -56,5 +56,5 @@ import { EmbeddedWorkbenchLoader } from './ui/embeddedWorkbenchLoader';
setInterval(function() { fetch('ping'); }, 10000); setInterval(function() { fetch('ping'); }, 10000);
} }
ReactDOM.render(<EmbeddedWorkbenchLoader />, document.querySelector('#root')); ReactDOM.createRoot(document.querySelector('#root')!).render(<EmbeddedWorkbenchLoader />);
})(); })();

4
packages/trace-viewer/src/index.tsx
View file

@ -17,7 +17,7 @@
import '@web/common.css'; import '@web/common.css';
import { applyTheme } from '@web/theme'; import { applyTheme } from '@web/theme';
import '@web/third_party/vscode/codicon.css'; import '@web/third_party/vscode/codicon.css';
import * as ReactDOM from 'react-dom'; import * as ReactDOM from 'react-dom/client';
import { WorkbenchLoader } from './ui/workbenchLoader'; import { WorkbenchLoader } from './ui/workbenchLoader';
(async () => { (async () => {
@ -38,5 +38,5 @@ import { WorkbenchLoader } from './ui/workbenchLoader';
setInterval(function() { fetch('ping'); }, 10000); setInterval(function() { fetch('ping'); }, 10000);
} }
ReactDOM.render(<WorkbenchLoader/>, document.querySelector('#root')); ReactDOM.createRoot(document.querySelector('#root')!).render(<WorkbenchLoader/>);
})(); })();

4
packages/trace-viewer/src/uiMode.tsx
View file

@ -17,7 +17,7 @@
import '@web/common.css'; import '@web/common.css';
import { applyTheme } from '@web/theme'; import { applyTheme } from '@web/theme';
import '@web/third_party/vscode/codicon.css'; import '@web/third_party/vscode/codicon.css';
import * as ReactDOM from 'react-dom'; import * as ReactDOM from 'react-dom/client';
import { UIModeView } from './ui/uiModeView'; import { UIModeView } from './ui/uiModeView';
(async () => { (async () => {
@ -38,5 +38,5 @@ import { UIModeView } from './ui/uiModeView';
setInterval(function() { fetch('ping'); }, 10000); setInterval(function() { fetch('ping'); }, 10000);
} }
ReactDOM.render(<UIModeView></UIModeView>, document.querySelector('#root')); ReactDOM.createRoot(document.querySelector('#root')!).render(<UIModeView/>);
})(); })();