load event doesn't wait till react containers are rendered (difference in Firefox and Chromium)

Question

I have a script that needs access to elements that are being rendered by react. But in the onload event on firefox the last element rendered by React is not available, on Chromium it is. When the webpack mode is set to production there is no problem.

Here is a simplified example

HTML:

<textarea></textarea>
<div class="textAreaContainer"></div>
<textarea></textarea>

<!--This one is not available on firefox-->
<div class="textAreaContainer"></div>

<textarea></textarea>

<!--React script that renders the textareas-->
<script src="react/textAreas.js"></script>
<script>
    window.addEventListener("load", () => {
        const textAreas = document.getElementsByTagName("textarea");
        // The last textarea rendered by React is not available in Firefox
        console.log([...textAreas]);
    });
</script>

React (index.js):

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';

const containers = document.getElementsByClassName("textAreaContainer");

for (const container of containers) {
    const root = ReactDOM.createRoot(container);

    root.render(
        <React.StrictMode>
            <App />
        </React.StrictMode>
    );
}

React (App.js):

import React from "react";
function App() {
  return (
      <textarea name="from-react" cols="30" rows="10"></textarea>
  );
}

export default App;

webpack.config.js:

const path = require('path');

module.exports = {
    mode: "development",
    entry: {
        textAreas: './react/index.js',
    },
    output: {
        filename: "[name].js",
        path: path.join(__dirname, "public/react")
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader",
                }
            }
        ]
    }
};

.babelrc:

{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": ["@babel/plugin-transform-runtime"]
}

package.json:

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "keywords": [],
  "author": "Laurent Dhont (LDIT BV)",
  "license": "ISC",
  "dependencies": {
    "@babel/core": "^7.22.6",
    "@babel/plugin-proposal-export-default-from": "^7.22.5",
    "@babel/plugin-transform-runtime": "^7.22.6",
    "@babel/preset-env": "^7.22.6",
    "@babel/preset-react": "^7.22.5",
    "babel-loader": "^9.1.2",
    "babel-preset-react-app": "^10.0.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "webpack": "^5.88.1",
    "webpack-cli": "^5.1.4"
  }
}