Skip to content

Commit

Permalink
[MM-58456] Make react library be loaded at DOMContentLoaded instead o…
Browse files Browse the repository at this point in the history
…f onload (mattermost#27192)
  • Loading branch information
M-ZubairAhmed authored Jun 13, 2024
1 parent a88f283 commit 0d5e30d
Showing 1 changed file with 15 additions and 16 deletions.
31 changes: 15 additions & 16 deletions webapp/channels/src/entry.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ declare global {

// This is for anything that needs to be done for ALL react components.
// This runs before we start to render anything.
function preRenderSetup(callwhendone: () => void) {
function preRenderSetup(onPreRenderSetupReady: () => void) {
window.onerror = (msg, url, line, column, error) => {
if (msg === 'ResizeObserver loop limit exceeded') {
return;
Expand All @@ -47,34 +47,33 @@ function preRenderSetup(callwhendone: () => void) {
),
);
};

setCSRFFromCookie();
callwhendone();

onPreRenderSetupReady();
}

function renderRootComponent() {
function renderReactRootComponent() {
ReactDOM.render((
<App/>
),
document.getElementById('root'));
}

/**
* Adds a function to be invoked onload appended to any existing onload
* event handlers.
* Adds a function to be invoked when the DOM content is loaded.
*/
function appendOnLoadEvent(fn: (evt: Event) => void) {
if (window.onload) {
const curronload = window.onload;
window.onload = (evt) => {
(curronload as any)(evt);
fn(evt);
};
function appendOnDOMContentLoadedEvent(onDomContentReady: () => void) {
if (document.readyState === 'loading') {
// If the DOM hasn't finished loading, add an event listener and call the function when it does
document.addEventListener('DOMContentLoaded', onDomContentReady);
} else {
window.onload = fn;
// If the DOM is already loaded, call the function immediately
onDomContentReady();
}
}

appendOnLoadEvent(() => {
// Do the pre-render setup and call renderRootComponent when done
preRenderSetup(renderRootComponent);
appendOnDOMContentLoadedEvent(() => {
// Do the pre-render setup and call renderReactRootComponent when done
preRenderSetup(renderReactRootComponent);
});

0 comments on commit 0d5e30d

Please sign in to comment.