Snapshots & package.json

14 files changed, 522 insertions, 6 deletions

diff --git a/integration/snapshots/multiple-imports.debug.js b/integration/snapshots/multiple-imports.debug.js
index 7826c8765..b96b270cf 100644
--- a/integration/snapshots/multiple-imports.debug.js
+++ b/integration/snapshots/multiple-imports.debug.js
@@ -4,7 +4,7 @@ __require as require
 import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
 import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
 var JSXClassic = require($bbcd215f);
-var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSX, JSXClassic).Fragment;
+var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSXClassic).Fragment;
 
 var { default: React} = require($bbcd215f);
 var { default: React2} = require($bbcd215f);
diff --git a/integration/snapshots/multiple-imports.hmr.debug.js b/integration/snapshots/multiple-imports.hmr.debug.js
index 048988d09..f2a331498 100644
--- a/integration/snapshots/multiple-imports.hmr.debug.js
+++ b/integration/snapshots/multiple-imports.hmr.debug.js
@@ -10,7 +10,7 @@ __HMRModule as HMR
 import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
 import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
 var JSXClassic = require($bbcd215f);
-var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSX, JSXClassic).Fragment;
+var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSXClassic).Fragment;
 
 var { default: React} = require($bbcd215f);
 var { default: React2} = require($bbcd215f);
diff --git a/integration/snapshots/multiple-imports.hmr.js b/integration/snapshots/multiple-imports.hmr.js
index 727907e62..dc222cf25 100644
--- a/integration/snapshots/multiple-imports.hmr.js
+++ b/integration/snapshots/multiple-imports.hmr.js
@@ -10,7 +10,7 @@ __HMRModule as HMR
 import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
 import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
 var JSXClassic = require($bbcd215f);
-var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSX, JSXClassic).Fragment;
+var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSXClassic).Fragment;
 
 var { default: React} = require($bbcd215f);
 var { default: React2} = require($bbcd215f);
diff --git a/integration/snapshots/multiple-imports.js b/integration/snapshots/multiple-imports.js
index 7826c8765..b96b270cf 100644
--- a/integration/snapshots/multiple-imports.js
+++ b/integration/snapshots/multiple-imports.js
@@ -4,7 +4,7 @@ __require as require
 import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
 import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
 var JSXClassic = require($bbcd215f);
-var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSX, JSXClassic).Fragment;
+var jsx = require(JSX).jsxDEV, fileName = "multiple-imports.js", JSXFrag = require(JSXClassic).Fragment;
 
 var { default: React} = require($bbcd215f);
 var { default: React2} = require($bbcd215f);
diff --git a/integration/snapshots/spread_with_key.debug.tsx b/integration/snapshots/spread_with_key.debug.tsx
new file mode 100644
index 000000000..1490c9b1a
--- /dev/null
+++ b/integration/snapshots/spread_with_key.debug.tsx
@@ -0,0 +1,31 @@
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var JSXClassic = require($bbcd215f);
+var jsx = require(JSX).jsxDEV, fileName = "spread_with_key.tsx", jsxEl = require(JSXClassic).createElement;
+
+var { default: React} = require($bbcd215f);
+export function SpreadWithTheKey({
+  className
+}) {
+  const rest = {};
+
+  return jsxEl("div", {
+    className,
+    ...rest,
+    onClick: () => console.log("click"),
+    key: "spread-with-the-key"
+  }, "Rendered component containing warning");
+}
+
+export function test() {
+  console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
+    className: "foo"
+  }, undefined, true, {
+    fileName,
+    lineNumber: 375
+  }, this)));
+  return testDone(import.meta.url);
+}
diff --git a/integration/snapshots/spread_with_key.hmr.debug.tsx b/integration/snapshots/spread_with_key.hmr.debug.tsx
new file mode 100644
index 000000000..d9029c380
--- /dev/null
+++ b/integration/snapshots/spread_with_key.hmr.debug.tsx
@@ -0,0 +1,54 @@
+import {
+__HMRClient as Bun
+} from "http://localhost:8080/__runtime.js";
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import {
+__HMRModule as HMR
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var JSXClassic = require($bbcd215f);
+var jsx = require(JSX).jsxDEV, fileName = "spread_with_key.tsx", jsxEl = require(JSXClassic).createElement;
+
+var { default: React} = require($bbcd215f);
+Bun.activate(true);
+
+var hmr = new HMR(2717584935, "spread_with_key.tsx"), exports = hmr.exports;
+(hmr._load = function() {
+  function SpreadWithTheKey({
+    className
+  }) {
+    const rest = {};
+    return jsxEl("div", {
+      className,
+      ...rest,
+      onClick: () => console.log("click"),
+      key: "spread-with-the-key"
+    }, "Rendered component containing warning");
+  }
+  function test() {
+    console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
+      className: "foo"
+    }, undefined, true, {
+      fileName,
+      lineNumber: 375
+    }, this)));
+    return testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    SpreadWithTheKey: () => SpreadWithTheKey,
+    test: () => test
+  });
+})();
+var $$hmr_SpreadWithTheKey = hmr.exports.SpreadWithTheKey, $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_SpreadWithTheKey = exports.SpreadWithTheKey;
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_SpreadWithTheKey as SpreadWithTheKey,
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/spread_with_key.hmr.tsx b/integration/snapshots/spread_with_key.hmr.tsx
new file mode 100644
index 000000000..093d061da
--- /dev/null
+++ b/integration/snapshots/spread_with_key.hmr.tsx
@@ -0,0 +1,54 @@
+import {
+__HMRClient as Bun
+} from "http://localhost:8080/__runtime.js";
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import {
+__HMRModule as HMR
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var JSXClassic = require($bbcd215f);
+var jsx = require(JSX).jsxDEV, fileName = "spread_with_key.tsx", jsxEl = require(JSXClassic).createElement;
+
+var { default: React} = require($bbcd215f);
+Bun.activate(false);
+
+var hmr = new HMR(2717584935, "spread_with_key.tsx"), exports = hmr.exports;
+(hmr._load = function() {
+  function SpreadWithTheKey({
+    className
+  }) {
+    const rest = {};
+    return jsxEl("div", {
+      className,
+      ...rest,
+      onClick: () => console.log("click"),
+      key: "spread-with-the-key"
+    }, "Rendered component containing warning");
+  }
+  function test() {
+    console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
+      className: "foo"
+    }, undefined, true, {
+      fileName,
+      lineNumber: 375
+    }, this)));
+    return testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    SpreadWithTheKey: () => SpreadWithTheKey,
+    test: () => test
+  });
+})();
+var $$hmr_SpreadWithTheKey = hmr.exports.SpreadWithTheKey, $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_SpreadWithTheKey = exports.SpreadWithTheKey;
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_SpreadWithTheKey as SpreadWithTheKey,
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/spread_with_key.tsx b/integration/snapshots/spread_with_key.tsx
new file mode 100644
index 000000000..1490c9b1a
--- /dev/null
+++ b/integration/snapshots/spread_with_key.tsx
@@ -0,0 +1,31 @@
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var JSXClassic = require($bbcd215f);
+var jsx = require(JSX).jsxDEV, fileName = "spread_with_key.tsx", jsxEl = require(JSXClassic).createElement;
+
+var { default: React} = require($bbcd215f);
+export function SpreadWithTheKey({
+  className
+}) {
+  const rest = {};
+
+  return jsxEl("div", {
+    className,
+    ...rest,
+    onClick: () => console.log("click"),
+    key: "spread-with-the-key"
+  }, "Rendered component containing warning");
+}
+
+export function test() {
+  console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
+    className: "foo"
+  }, undefined, true, {
+    fileName,
+    lineNumber: 375
+  }, this)));
+  return testDone(import.meta.url);
+}
diff --git a/integration/snapshots/styled-components-output.hmr.js b/integration/snapshots/styled-components-output.hmr.js
new file mode 100644
index 000000000..1bf09ed2d
--- /dev/null
+++ b/integration/snapshots/styled-components-output.hmr.js
@@ -0,0 +1,67 @@
+import {
+__HMRClient as Bun
+} from "http://localhost:8080/__runtime.js";
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import {
+__HMRModule as HMR
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+var jsx = require(JSX).jsxDEV, fileName = "styled-components-output.js";
+
+import * as $3b6c9f54 from "http://localhost:8080/node_modules/styled-components/dist/styled-components.esm.js";
+var { default: styled} = require($3b6c9f54);
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+Bun.activate(false);
+
+var hmr = new HMR(2972367994, "styled-components-output.js"), exports = hmr.exports;
+(hmr._load = function() {
+  const ErrorScreenRoot = styled.div`
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #fff;
+  text-align: center;
+  background-color: #0b2988;
+  color: #fff;
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  line-height: 1.5em;
+
+  & > p {
+    margin-top: 10px;
+  }
+
+  & a {
+    color: inherit;
+  }
+`;
+  function test() {
+    console.assert(React.isValidElement(jsx(ErrorScreenRoot, {}, undefined, true, {
+      fileName,
+      lineNumber: 698
+    }, this)));
+    testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    test: () => test
+  });
+})();
+var $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/styledcomponents-output.debug.js b/integration/snapshots/styledcomponents-output.debug.js
new file mode 100644
index 000000000..913a52d16
--- /dev/null
+++ b/integration/snapshots/styledcomponents-output.debug.js
@@ -0,0 +1,59 @@
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+var jsx = require(JSX).jsxDEV, fileName = "styledcomponents-output.js";
+
+import * as $d4051a2e from "http://localhost:8080/node_modules/styled-components/dist/styled-components.browser.esm.js";
+var { default: styled} = require($d4051a2e);
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var { default: ReactDOM} = require($5b3cea55);
+const ErrorScreenRoot = styled.div`
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #fff;
+  text-align: center;
+  background-color: #0b2988;
+  color: #fff;
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  line-height: 1.5em;
+
+  & > p {
+    margin-top: 10px;
+  }
+
+  & a {
+    color: inherit;
+  }
+`;
+
+export function test() {
+  const reactEl = document.createElement("div");
+  document.body.appendChild(reactEl);
+  ReactDOM.render(jsx(ErrorScreenRoot, {
+    id: "error-el",
+    children: ["This is an error! Look for the string"]
+  }, undefined, true, {
+    fileName,
+    lineNumber: 805
+  }, this), reactEl);
+  const style = document.querySelector("style[data-styled]");
+  console.assert(style, "style tag should exist");
+  console.assert(!style.textContent.includes("晜"), "style tag should not contain invalid unicode codepoints");
+  console.assert(document.querySelector("#error-el").textContent === "This is an error! Look for the string");
+  ReactDOM.unmountComponentAtNode(reactEl);
+  reactEl.remove();
+  testDone(import.meta.url);
+}
diff --git a/integration/snapshots/styledcomponents-output.hmr.debug.js b/integration/snapshots/styledcomponents-output.hmr.debug.js
new file mode 100644
index 000000000..cddc9e5f6
--- /dev/null
+++ b/integration/snapshots/styledcomponents-output.hmr.debug.js
@@ -0,0 +1,80 @@
+import {
+__HMRClient as Bun
+} from "http://localhost:8080/__runtime.js";
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import {
+__HMRModule as HMR
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+var jsx = require(JSX).jsxDEV, fileName = "styledcomponents-output.js";
+
+import * as $d4051a2e from "http://localhost:8080/node_modules/styled-components/dist/styled-components.browser.esm.js";
+var { default: styled} = require($d4051a2e);
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var { default: ReactDOM} = require($5b3cea55);
+Bun.activate(true);
+
+var hmr = new HMR(1290604342, "styledcomponents-output.js"), exports = hmr.exports;
+(hmr._load = function() {
+  const ErrorScreenRoot = styled.div`
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #fff;
+  text-align: center;
+  background-color: #0b2988;
+  color: #fff;
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  line-height: 1.5em;
+
+  & > p {
+    margin-top: 10px;
+  }
+
+  & a {
+    color: inherit;
+  }
+`;
+  function test() {
+    const reactEl = document.createElement("div");
+    document.body.appendChild(reactEl);
+    ReactDOM.render(jsx(ErrorScreenRoot, {
+      id: "error-el",
+      children: ["This is an error! Look for the string"]
+    }, undefined, true, {
+      fileName,
+      lineNumber: 805
+    }, this), reactEl);
+    const style = document.querySelector("style[data-styled]");
+    console.assert(style, "style tag should exist");
+    console.assert(!style.textContent.includes("晜"), "style tag should not contain invalid unicode codepoints");
+    console.assert(document.querySelector("#error-el").textContent === "This is an error! Look for the string");
+    ReactDOM.unmountComponentAtNode(reactEl);
+    reactEl.remove();
+    testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    test: () => test
+  });
+})();
+var $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/styledcomponents-output.hmr.js b/integration/snapshots/styledcomponents-output.hmr.js
new file mode 100644
index 000000000..20066f16f
--- /dev/null
+++ b/integration/snapshots/styledcomponents-output.hmr.js
@@ -0,0 +1,80 @@
+import {
+__HMRClient as Bun
+} from "http://localhost:8080/__runtime.js";
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import {
+__HMRModule as HMR
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+var jsx = require(JSX).jsxDEV, fileName = "styledcomponents-output.js";
+
+import * as $d4051a2e from "http://localhost:8080/node_modules/styled-components/dist/styled-components.browser.esm.js";
+var { default: styled} = require($d4051a2e);
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var { default: ReactDOM} = require($5b3cea55);
+Bun.activate(false);
+
+var hmr = new HMR(1290604342, "styledcomponents-output.js"), exports = hmr.exports;
+(hmr._load = function() {
+  const ErrorScreenRoot = styled.div`
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #fff;
+  text-align: center;
+  background-color: #0b2988;
+  color: #fff;
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  line-height: 1.5em;
+
+  & > p {
+    margin-top: 10px;
+  }
+
+  & a {
+    color: inherit;
+  }
+`;
+  function test() {
+    const reactEl = document.createElement("div");
+    document.body.appendChild(reactEl);
+    ReactDOM.render(jsx(ErrorScreenRoot, {
+      id: "error-el",
+      children: ["The react child should have this text"]
+    }, undefined, true, {
+      fileName,
+      lineNumber: 805
+    }, this), reactEl);
+    const style = document.querySelector("style[data-styled]");
+    console.assert(style, "style tag should exist");
+    console.assert(style.textContent.split("").every((a) => a.codePointAt(0) < 128), "style tag should not contain invalid unicode codepoints");
+    console.assert(document.querySelector("#error-el").textContent === "The react child should have this text");
+    ReactDOM.unmountComponentAtNode(reactEl);
+    reactEl.remove();
+    testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    test: () => test
+  });
+})();
+var $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/styledcomponents-output.js b/integration/snapshots/styledcomponents-output.js
new file mode 100644
index 000000000..38da378e6
--- /dev/null
+++ b/integration/snapshots/styledcomponents-output.js
@@ -0,0 +1,59 @@
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/react/jsx-dev-runtime.js";
+var jsx = require(JSX).jsxDEV, fileName = "styledcomponents-output.js";
+
+import * as $d4051a2e from "http://localhost:8080/node_modules/styled-components/dist/styled-components.browser.esm.js";
+var { default: styled} = require($d4051a2e);
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var { default: ReactDOM} = require($5b3cea55);
+const ErrorScreenRoot = styled.div`
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background: #fff;
+  text-align: center;
+  background-color: #0b2988;
+  color: #fff;
+  font-family: "Muli", -apple-system, BlinkMacSystemFont, Helvetica, Arial,
+    sans-serif;
+  line-height: 1.5em;
+
+  & > p {
+    margin-top: 10px;
+  }
+
+  & a {
+    color: inherit;
+  }
+`;
+
+export function test() {
+  const reactEl = document.createElement("div");
+  document.body.appendChild(reactEl);
+  ReactDOM.render(jsx(ErrorScreenRoot, {
+    id: "error-el",
+    children: ["The react child should have this text"]
+  }, undefined, true, {
+    fileName,
+    lineNumber: 805
+  }, this), reactEl);
+  const style = document.querySelector("style[data-styled]");
+  console.assert(style, "style tag should exist");
+  console.assert(style.textContent.split("").every((a) => a.codePointAt(0) < 128), "style tag should not contain invalid unicode codepoints");
+  console.assert(document.querySelector("#error-el").textContent === "The react child should have this text");
+  ReactDOM.unmountComponentAtNode(reactEl);
+  reactEl.remove();
+  testDone(import.meta.url);
+}
diff --git a/integration/snippets/styledcomponents-output.js b/integration/snippets/styledcomponents-output.js
index 898223c3e..16ac1ed6b 100644
--- a/integration/snippets/styledcomponents-output.js
+++ b/integration/snippets/styledcomponents-output.js
@@ -36,7 +36,7 @@ export function test() {
   document.body.appendChild(reactEl);
   ReactDOM.render(
     <ErrorScreenRoot id="error-el">
-      This is an error! Look for the string
+      The react child should have this text
     </ErrorScreenRoot>,
     reactEl
   );
@@ -49,10 +49,11 @@ export function test() {
   );
   console.assert(
     document.querySelector("#error-el").textContent ===
-      "This is an error! Look for the string"
+      "The react child should have this text"
   );
 
   ReactDOM.unmountComponentAtNode(reactEl);
   reactEl.remove();
+  style.remove();
   testDone(import.meta.url);
 }