:camera:jarred/read-tsconfig-jsx

12 files changed, 271 insertions, 10 deletions

diff --git a/integration/snapshots/custom-emotion-jsx/file.debug.jsx b/integration/snapshots/custom-emotion-jsx/file.debug.jsx
new file mode 100644
index 000000000..b6be3371f
--- /dev/null
+++ b/integration/snapshots/custom-emotion-jsx/file.debug.jsx
@@ -0,0 +1,22 @@
+import {
+__require as require
+} from "http://localhost:8080/__runtime.js";
+import * as JSX from "http://localhost:8080/node_modules/@emotion/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js";
+var jsx = require(JSX).jsxDEV;
+
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var ReactDOM = require($5b3cea55);
+export const Foo = () => jsx("div", {
+  css: {content: '"it worked!"' }
+}, undefined, false, undefined, this);
+
+export function test() {
+  const element = document.createElement("div");
+  element.id = "custom-emotion-jsx";
+  document.body.appendChild(element);
+  ReactDOM.render(jsx(Foo, {}, undefined, false, undefined, this), element);
+  const style = window.getComputedStyle(element.firstChild);
+  if (!(style["content"] ?? "").includes("it worked!"))
+    throw new Error('Expected "it worked!" but received: ' + style["content"]);
+  return testDone(import.meta.url);
+}
diff --git a/integration/snapshots/custom-emotion-jsx/file.hmr.debug.jsx b/integration/snapshots/custom-emotion-jsx/file.hmr.debug.jsx
new file mode 100644
index 000000000..c595a5957
--- /dev/null
+++ b/integration/snapshots/custom-emotion-jsx/file.hmr.debug.jsx
@@ -0,0 +1,46 @@
+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/@emotion/react/jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js";
+var jsx = require(JSX).jsxDEV;
+
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var ReactDOM = require($5b3cea55);
+Bun.activate(true);
+
+var hmr = new HMR(2497996991, "custom-emotion-jsx/file.jsx"), exports = hmr.exports;
+(hmr._load = function() {
+  var Foo = () => jsx("div", {
+    css: {content: '"it worked!"' }
+  }, undefined, false, undefined, this);
+  function test() {
+    const element = document.createElement("div");
+    element.id = "custom-emotion-jsx";
+    document.body.appendChild(element);
+    ReactDOM.render(jsx(Foo, {}, undefined, false, undefined, this), element);
+    const style = window.getComputedStyle(element.firstChild);
+    if (!(style["content"] ?? "").includes("it worked!"))
+      throw new Error('Expected "it worked!" but received: ' + style["content"]);
+    return testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    Foo: () => Foo,
+    test: () => test
+  });
+})();
+var $$hmr_Foo = hmr.exports.Foo, $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_Foo = exports.Foo;
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_Foo as Foo,
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/custom-emotion-jsx/file.hmr.jsx b/integration/snapshots/custom-emotion-jsx/file.hmr.jsx
new file mode 100644
index 000000000..447bb6dd7
--- /dev/null
+++ b/integration/snapshots/custom-emotion-jsx/file.hmr.jsx
@@ -0,0 +1,46 @@
+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;
+
+import * as $5b3cea55 from "http://localhost:8080/node_modules/react-dom/index.js";
+var ReactDOM = require($5b3cea55);
+Bun.activate(false);
+
+var hmr = new HMR(2497996991, "custom-emotion-jsx/file.jsx"), exports = hmr.exports;
+(hmr._load = function() {
+  var Foo = () => jsx("div", {
+    css: {content: '"it worked!"' }
+  }, undefined, true, undefined, this);
+  function test() {
+    const element = document.createElement("div");
+    element.id = "custom-emotion-jsx";
+    document.body.appendChild(element);
+    ReactDOM.render(jsx(Foo, {}, undefined, true, undefined, this), element);
+    const style = window.getComputedStyle(element.firstChild);
+    if (!(style["content"] ?? "").includes("it worked!"))
+      throw new Error('Expected "it worked!" but received: ' + style["content"]);
+    return testDone(import.meta.url);
+  }
+  hmr.exportAll({
+    Foo: () => Foo,
+    test: () => test
+  });
+})();
+var $$hmr_Foo = hmr.exports.Foo, $$hmr_test = hmr.exports.test;
+hmr._update = function(exports) {
+  $$hmr_Foo = exports.Foo;
+  $$hmr_test = exports.test;
+};
+
+export {
+  $$hmr_Foo as Foo,
+  $$hmr_test as test
+};
diff --git a/integration/snapshots/multiple-imports.debug.js b/integration/snapshots/multiple-imports.debug.js
index 1bc6eb747..a98366885 100644
--- a/integration/snapshots/multiple-imports.debug.js
+++ b/integration/snapshots/multiple-imports.debug.js
@@ -11,8 +11,8 @@ var { default: React2} = require($bbcd215f);
 const bacon = React;
 
 const bacon2 = jsx(JSXFrag, {
-  children: ["hello"]
-}, undefined, true, undefined, this);
+  children: "hello"
+}, undefined, false, undefined, this);
 export function test() {
   console.assert(bacon === React);
   console.assert(bacon === React2);
diff --git a/integration/snapshots/multiple-imports.hmr.debug.js b/integration/snapshots/multiple-imports.hmr.debug.js
index 4b05677e0..3c40e88a6 100644
--- a/integration/snapshots/multiple-imports.hmr.debug.js
+++ b/integration/snapshots/multiple-imports.hmr.debug.js
@@ -20,8 +20,8 @@ var hmr = new HMR(2165509932, "multiple-imports.js"), exports = hmr.exports;
 (hmr._load = function() {
   const bacon = React;
   const bacon2 = jsx(JSXFrag, {
-    children: ["hello"]
-  }, undefined, true, undefined, this);
+    children: "hello"
+  }, undefined, false, undefined, this);
   function test() {
     console.assert(bacon === React);
     console.assert(bacon === React2);
diff --git a/integration/snapshots/react-context-value-func.debug.tsx b/integration/snapshots/react-context-value-func.debug.tsx
new file mode 100644
index 000000000..5d151afba
--- /dev/null
+++ b/integration/snapshots/react-context-value-func.debug.tsx
@@ -0,0 +1,35 @@
+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;
+
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+const Context = React.createContext({});
+
+const ContextProvider = ({ children }) => {
+  const [cb, setCB] = React.useState(function() {
+  });
+  const foo = true;
+  return jsx(Context.Provider, {
+    value: cb,
+    children: children(foo)
+  }, undefined, false, undefined, this);
+};
+const ContextValue = ({}) => jsx(Context.Consumer, {
+  children: (foo) => {
+    if (foo)
+      return jsx("div", {
+        children: "Worked!"
+      }, undefined, false, undefined, this);
+    throw `Value "${foo}"" should be true`;
+  }
+}, undefined, false, undefined, this);
+const TestComponent = () => jsx(ContextProvider, {
+  children: jsx(ContextValue, {}, undefined, false, undefined, this)
+}, undefined, false, undefined, this);
+export function test() {
+  const foo = jsx(TestComponent, {}, undefined, false, undefined, this);
+  return testDone(import.meta.url);
+}
diff --git a/integration/snapshots/react-context-value-func.hmr.debug.tsx b/integration/snapshots/react-context-value-func.hmr.debug.tsx
new file mode 100644
index 000000000..9280a638d
--- /dev/null
+++ b/integration/snapshots/react-context-value-func.hmr.debug.tsx
@@ -0,0 +1,56 @@
+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;
+
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+Bun.activate(true);
+
+var hmr = new HMR(3514348331, "react-context-value-func.tsx"), exports = hmr.exports;
+(hmr._load = function() {
+  const Context = React.createContext({});
+  const ContextProvider = ({ children }) => {
+    const [cb, setCB] = React.useState(function() {
+    });
+    const foo = true;
+    return jsx(Context.Provider, {
+      value: cb,
+      children: children(foo)
+    }, undefined, false, undefined, this);
+  };
+  const ContextValue = ({}) => jsx(Context.Consumer, {
+    children: (foo) => {
+      if (foo)
+        return jsx("div", {
+          children: "Worked!"
+        }, undefined, false, undefined, this);
+      throw `Value "${foo}"" should be true`;
+    }
+  }, undefined, false, undefined, this);
+  const TestComponent = () => jsx(ContextProvider, {
+    children: jsx(ContextValue, {}, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+  function test() {
+    const foo = jsx(TestComponent, {}, undefined, false, undefined, this);
+    return 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/react-context-value-func.hmr.tsx b/integration/snapshots/react-context-value-func.hmr.tsx
new file mode 100644
index 000000000..090911b33
--- /dev/null
+++ b/integration/snapshots/react-context-value-func.hmr.tsx
@@ -0,0 +1,56 @@
+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;
+
+import * as $bbcd215f from "http://localhost:8080/node_modules/react/index.js";
+var { default: React} = require($bbcd215f);
+Bun.activate(false);
+
+var hmr = new HMR(3514348331, "react-context-value-func.tsx"), exports = hmr.exports;
+(hmr._load = function() {
+  const Context = React.createContext({});
+  const ContextProvider = ({ children }) => {
+    const [cb, setCB] = React.useState(function() {
+    });
+    const foo = true;
+    return jsx(Context.Provider, {
+      value: cb,
+      children: [children(foo)]
+    }, undefined, true, undefined, this);
+  };
+  const ContextValue = ({}) => jsx(Context.Consumer, {
+    children: [(foo) => {
+      if (foo)
+        return jsx("div", {
+          children: ["Worked!"]
+        }, undefined, true, undefined, this);
+      throw `Value "${foo}"" should be true`;
+    }]
+  }, undefined, true, undefined, this);
+  const TestComponent = () => jsx(ContextProvider, {
+    children: [jsx(ContextValue, {}, undefined, true, undefined, this)]
+  }, undefined, true, undefined, this);
+  function test() {
+    const foo = jsx(TestComponent, {}, undefined, true, undefined, this);
+    return 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/spread_with_key.debug.tsx b/integration/snapshots/spread_with_key.debug.tsx
index 052e3f4ba..cb079bb95 100644
--- a/integration/snapshots/spread_with_key.debug.tsx
+++ b/integration/snapshots/spread_with_key.debug.tsx
@@ -23,6 +23,6 @@ export function SpreadWithTheKey({
 export function test() {
   console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
     className: "foo"
-  }, undefined, true, undefined, this)));
+  }, undefined, false, undefined, 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
index dd66edcc3..7f5076f1a 100644
--- a/integration/snapshots/spread_with_key.hmr.debug.tsx
+++ b/integration/snapshots/spread_with_key.hmr.debug.tsx
@@ -31,7 +31,7 @@ var hmr = new HMR(2717584935, "spread_with_key.tsx"), exports = hmr.exports;
   function test() {
     console.assert(React.isValidElement(jsx(SpreadWithTheKey, {
       className: "foo"
-    }, undefined, true, undefined, this)));
+    }, undefined, false, undefined, this)));
     return testDone(import.meta.url);
   }
   hmr.exportAll({
diff --git a/integration/snapshots/styledcomponents-output.debug.js b/integration/snapshots/styledcomponents-output.debug.js
index df45ce11e..0f81a0ba7 100644
--- a/integration/snapshots/styledcomponents-output.debug.js
+++ b/integration/snapshots/styledcomponents-output.debug.js
@@ -44,8 +44,8 @@ export function test() {
   document.body.appendChild(reactEl);
   ReactDOM.render(jsx(ErrorScreenRoot, {
     id: "error-el",
-    children: ["The react child should have this text"]
-  }, undefined, true, undefined, this), reactEl);
+    children: "The react child should have this text"
+  }, undefined, false, undefined, 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");
diff --git a/integration/snapshots/styledcomponents-output.hmr.debug.js b/integration/snapshots/styledcomponents-output.hmr.debug.js
index 25b291547..c10d1c492 100644
--- a/integration/snapshots/styledcomponents-output.hmr.debug.js
+++ b/integration/snapshots/styledcomponents-output.hmr.debug.js
@@ -53,8 +53,8 @@ var hmr = new HMR(1290604342, "styledcomponents-output.js"), exports = hmr.expor
     document.body.appendChild(reactEl);
     ReactDOM.render(jsx(ErrorScreenRoot, {
       id: "error-el",
-      children: ["The react child should have this text"]
-    }, undefined, true, undefined, this), reactEl);
+      children: "The react child should have this text"
+    }, undefined, false, undefined, 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");