diff --git a/examples/12_async/src/app.tsx b/examples/12_async/src/app.tsx
index 305afd67..40e044b5 100644
--- a/examples/12_async/src/app.tsx
+++ b/examples/12_async/src/app.tsx
@@ -1,9 +1,9 @@
 import { Provider } from './store';
-import Main from './main';
+import Root from './root';
 
 const App = () => (
   <Provider>
-    <Main />
+    <Root />
   </Provider>
 );
 
diff --git a/examples/12_async/src/main.tsx b/examples/12_async/src/main.tsx
index 7f5eb621..1a72c017 100644
--- a/examples/12_async/src/main.tsx
+++ b/examples/12_async/src/main.tsx
@@ -1,27 +1,10 @@
-import { useState } from 'react';
+import { StrictMode } from 'react';
+import { createRoot } from 'react-dom/client';
 
-import { useTrackedState } from './store';
-import Person from './person';
-import Counter from './counter';
+import App from './app';
 
-const Main = () => {
-  const state = useTrackedState();
-  const [id, setId] = useState('3');
-  return (
-    <div>
-      <h1>Person</h1>
-      <div>
-        User ID:
-        <input value={id} onChange={(e) => setId(e.target.value)} />
-      </div>
-      {state.loadingState !== 'idle' ? (
-        <span>{state.loadingState}...</span>
-      ) : (
-        <Person id={id} />
-      )}
-      <Counter />
-    </div>
-  );
-};
-
-export default Main;
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+);
diff --git a/examples/12_async/src/root.tsx b/examples/12_async/src/root.tsx
new file mode 100644
index 00000000..608064ab
--- /dev/null
+++ b/examples/12_async/src/root.tsx
@@ -0,0 +1,27 @@
+import { useState } from 'react';
+
+import { useTrackedState } from './store';
+import Person from './person';
+import Counter from './counter';
+
+const Root = () => {
+  const state = useTrackedState();
+  const [id, setId] = useState('3');
+  return (
+    <div>
+      <h1>Person</h1>
+      <div>
+        User ID:
+        <input value={id} onChange={(e) => setId(e.target.value)} />
+      </div>
+      {state.loadingState !== 'idle' ? (
+        <span>{state.loadingState}...</span>
+      ) : (
+        <Person id={id} />
+      )}
+      <Counter />
+    </div>
+  );
+};
+
+export default Root;
diff --git a/tests/e2e/01_counter.ts b/tests/e2e/01_counter.ts
index e00abc94..a0ec5a85 100644
--- a/tests/e2e/01_counter.ts
+++ b/tests/e2e/01_counter.ts
@@ -11,142 +11,142 @@ describe('01_minimal', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(5) > div > input');
-    await page.click('body > #app > div:nth-child(5) > div > input');
+    await page.waitForSelector('body > #root > div:nth-child(5) > div > input');
+    await page.click('body > #root > div:nth-child(5) > div > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(5) > div > input', '1');
+    await page.type('body > #root > div:nth-child(5) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(5) > div > input', '2');
+    await page.type('body > #root > div:nth-child(5) > div > input', '2');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(5) > div > input', '3');
+    await page.type('body > #root > div:nth-child(5) > div > input', '3');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/02_person.ts b/tests/e2e/02_person.ts
index cb193406..6576b4ea 100644
--- a/tests/e2e/02_person.ts
+++ b/tests/e2e/02_person.ts
@@ -11,97 +11,97 @@ describe('02_typescript', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      '#app > div:nth-child(5) > div > div > button:nth-child(2)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(2)',
     );
     await page.click(
-      '#app > div:nth-child(5) > div > div > button:nth-child(2)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      '#app > div:nth-child(5) > div > div > button:nth-child(2)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(2)',
     );
     await page.click(
-      '#app > div:nth-child(5) > div > div > button:nth-child(2)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      '#app > div:nth-child(5) > div > div > button:nth-child(3)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(3)',
     );
     await page.click(
-      '#app > div:nth-child(5) > div > div > button:nth-child(3)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      '#app > div:nth-child(5) > div > div > button:nth-child(3)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(3)',
     );
     await page.click(
-      '#app > div:nth-child(5) > div > div > button:nth-child(3)',
+      '#root > div:nth-child(5) > div > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'a',
     );
     expect(
@@ -109,7 +109,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -117,7 +117,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'c',
     );
     expect(
@@ -125,7 +125,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       'd',
     );
     expect(
@@ -133,7 +133,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       'e',
     );
     expect(
@@ -141,7 +141,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       'f',
     );
     expect(
@@ -149,7 +149,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(4) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(4) > input',
       '1',
     );
     expect(
@@ -157,7 +157,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(4) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(4) > input',
       '2',
     );
     expect(
@@ -165,7 +165,7 @@ describe('02_typescript', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(4) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(4) > input',
       '3',
     );
     expect(
diff --git a/tests/e2e/03_usestate.ts b/tests/e2e/03_usestate.ts
index 45f18f86..7f951135 100644
--- a/tests/e2e/03_usestate.ts
+++ b/tests/e2e/03_usestate.ts
@@ -10,48 +10,58 @@ describe('03_usestate', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > div:nth-child(2) > div > button');
-    await page.click('body > #app > div:nth-child(2) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(2) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(2) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(2) > div > button');
-    await page.click('body > #app > div:nth-child(2) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(2) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(2) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(3) > div > button');
-    await page.click('body > #app > div:nth-child(3) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(3) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(3) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(3) > div > button');
-    await page.click('body > #app > div:nth-child(3) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(3) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(3) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(3) > div > button');
-    await page.click('body > #app > div:nth-child(3) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(3) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(3) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -59,7 +69,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -67,7 +77,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -75,7 +85,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -83,7 +93,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -91,7 +101,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -99,7 +109,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
@@ -107,7 +117,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
@@ -115,7 +125,7 @@ describe('03_usestate', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
diff --git a/tests/e2e/04_selector.ts b/tests/e2e/04_selector.ts
index f9f9a940..3f7a27f0 100644
--- a/tests/e2e/04_selector.ts
+++ b/tests/e2e/04_selector.ts
@@ -11,57 +11,57 @@ describe('04_selector', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -69,7 +69,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -77,7 +77,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
@@ -85,7 +85,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -93,7 +93,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -101,7 +101,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(2) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(2) > input',
       'b',
     );
     expect(
@@ -109,7 +109,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
@@ -117,7 +117,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
@@ -125,7 +125,7 @@ describe('04_selector', () => {
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(3) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(3) > input',
       '1',
     );
     expect(
diff --git a/tests/e2e/05_container.ts b/tests/e2e/05_container.ts
index d944b06b..ffb7909c 100644
--- a/tests/e2e/05_container.ts
+++ b/tests/e2e/05_container.ts
@@ -11,200 +11,200 @@ describe('05_container', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(3) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(3) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(5) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(6) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(6) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
diff --git a/tests/e2e/06_customhook.ts b/tests/e2e/06_customhook.ts
index d96d0ea7..02e704c8 100644
--- a/tests/e2e/06_customhook.ts
+++ b/tests/e2e/06_customhook.ts
@@ -11,65 +11,65 @@ describe('06_customhook', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(1) > button:nth-child(2)',
+      'body > #root > div:nth-child(1) > button:nth-child(2)',
     );
-    await page.click('body > #app > div:nth-child(1) > button:nth-child(2)');
+    await page.click('body > #root > div:nth-child(1) > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(1) > button:nth-child(2)',
+      'body > #root > div:nth-child(1) > button:nth-child(2)',
     );
-    await page.click('body > #app > div:nth-child(1) > button:nth-child(2)');
+    await page.click('body > #root > div:nth-child(1) > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(1) > button:nth-child(3)',
+      'body > #root > div:nth-child(1) > button:nth-child(3)',
     );
-    await page.click('body > #app > div:nth-child(1) > button:nth-child(3)');
+    await page.click('body > #root > div:nth-child(1) > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(1) > button:nth-child(3)',
+      'body > #root > div:nth-child(1) > button:nth-child(3)',
     );
-    await page.click('body > #app > div:nth-child(1) > button:nth-child(3)');
+    await page.click('body > #root > div:nth-child(1) > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > button:nth-child(2)',
     );
-    await page.click('body > #app > div:nth-child(2) > button:nth-child(2)');
+    await page.click('body > #root > div:nth-child(2) > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > button:nth-child(2)',
     );
-    await page.click('body > #app > div:nth-child(2) > button:nth-child(2)');
+    await page.click('body > #root > div:nth-child(2) > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > button:nth-child(3)',
     );
-    await page.click('body > #app > div:nth-child(2) > button:nth-child(3)');
+    await page.click('body > #root > div:nth-child(2) > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > button:nth-child(3)',
     );
-    await page.click('body > #app > div:nth-child(2) > button:nth-child(3)');
+    await page.click('body > #root > div:nth-child(2) > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/07_todolist.ts b/tests/e2e/07_todolist.ts
index 21b2adcb..e6712b9e 100644
--- a/tests/e2e/07_todolist.ts
+++ b/tests/e2e/07_todolist.ts
@@ -10,161 +10,181 @@ describe('07_todolist', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('#app > div > div > form > input');
-    await page.click('#app > div > div > form > input');
+    await page.waitForSelector('#root > div > div > form > input');
+    await page.click('#root > div > div > form > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'a');
+    await page.type('#root > div > div > form > input', 'a');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'a');
+    await page.type('#root > div > div > form > input', 'a');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'a');
+    await page.type('#root > div > div > form > input', 'a');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > div > div > form > button');
-    await page.click('#app > div > div > form > button');
+    await page.waitForSelector('#root > div > div > form > button');
+    await page.click('#root > div > div > form > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > div > div > form > input');
-    await page.click('#app > div > div > form > input');
+    await page.waitForSelector('#root > div > div > form > input');
+    await page.click('#root > div > div > form > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'b');
+    await page.type('#root > div > div > form > input', 'b');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'b');
+    await page.type('#root > div > div > form > input', 'b');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'b');
+    await page.type('#root > div > div > form > input', 'b');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > div > div > form > button');
-    await page.click('#app > div > div > form > button');
+    await page.waitForSelector('#root > div > div > form > button');
+    await page.click('#root > div > div > form > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > div > div > form > input');
-    await page.click('#app > div > div > form > input');
+    await page.waitForSelector('#root > div > div > form > input');
+    await page.click('#root > div > div > form > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'c');
+    await page.type('#root > div > div > form > input', 'c');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'c');
+    await page.type('#root > div > div > form > input', 'c');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > div > div > form > input', 'c');
+    await page.type('#root > div > div > form > input', 'c');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > div > div > form > button');
-    await page.click('#app > div > div > form > button');
+    await page.waitForSelector('#root > div > div > form > button');
+    await page.click('#root > div > div > form > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(4)');
-    await page.click('body > #app > div > div > button:nth-child(4)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(4)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(4)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(2)');
-    await page.click('body > #app > div > div > button:nth-child(2)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(2)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > ul > li:nth-child(2)');
-    await page.click('body > #app > div > ul > li:nth-child(2)');
+    await page.waitForSelector('body > #root > div > ul > li:nth-child(2)');
+    await page.click('body > #root > div > ul > li:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(4)');
-    await page.click('body > #app > div > div > button:nth-child(4)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(4)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(4)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(2)');
-    await page.click('body > #app > div > div > button:nth-child(2)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(2)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > ul > li:nth-child(3)');
-    await page.click('body > #app > div > ul > li:nth-child(3)');
+    await page.waitForSelector('body > #root > div > ul > li:nth-child(3)');
+    await page.click('body > #root > div > ul > li:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(4)');
-    await page.click('body > #app > div > div > button:nth-child(4)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(4)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(4)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > ul > li:nth-child(1)');
-    await page.click('body > #app > div > ul > li:nth-child(1)');
+    await page.waitForSelector('body > #root > div > ul > li:nth-child(1)');
+    await page.click('body > #root > div > ul > li:nth-child(1)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(2)');
-    await page.click('body > #app > div > div > button:nth-child(2)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(2)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/08_comparison.ts b/tests/e2e/08_comparison.ts
index 6614b690..c4d81cce 100644
--- a/tests/e2e/08_comparison.ts
+++ b/tests/e2e/08_comparison.ts
@@ -10,58 +10,58 @@ describe('08_comparison', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > div:nth-child(2) > input');
-    await page.click('body > #app > div:nth-child(2) > input');
+    await page.waitForSelector('body > #root > div:nth-child(2) > input');
+    await page.click('body > #root > div:nth-child(2) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(2) > input', '1');
+    await page.type('body > #root > div:nth-child(2) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(3) > input', '1');
+    await page.type('body > #root > div:nth-child(3) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(5) > input', '1');
+    await page.type('body > #root > div:nth-child(5) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(6) > input', '1');
+    await page.type('body > #root > div:nth-child(6) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(8) > input', '1');
+    await page.type('body > #root > div:nth-child(8) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(9) > input', '1');
+    await page.type('body > #root > div:nth-child(9) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(11) > input', '1');
+    await page.type('body > #root > div:nth-child(11) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(12) > input', '1');
+    await page.type('body > #root > div:nth-child(12) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(14) > input', '1');
+    await page.type('body > #root > div:nth-child(14) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(15) > input', '1');
+    await page.type('body > #root > div:nth-child(15) > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/09_reactmemo.ts b/tests/e2e/09_reactmemo.ts
index ab26d5ed..f6a43d05 100644
--- a/tests/e2e/09_reactmemo.ts
+++ b/tests/e2e/09_reactmemo.ts
@@ -10,38 +10,38 @@ describe('09_reactmemo', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(1) > input');
-    await page.click('body > #app > ul > li:nth-child(1) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(1) > input');
+    await page.click('body > #root > ul > li:nth-child(1) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(2) > input');
-    await page.click('body > #app > ul > li:nth-child(2) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(2) > input');
+    await page.click('body > #root > ul > li:nth-child(2) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(3) > input');
-    await page.click('body > #app > ul > li:nth-child(3) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(3) > input');
+    await page.click('body > #root > ul > li:nth-child(3) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(1) > input');
-    await page.click('body > #app > ul > li:nth-child(1) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(1) > input');
+    await page.click('body > #root > ul > li:nth-child(1) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(2) > input');
-    await page.click('body > #app > ul > li:nth-child(2) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(2) > input');
+    await page.click('body > #root > ul > li:nth-child(2) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(3) > input');
-    await page.click('body > #app > ul > li:nth-child(3) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(3) > input');
+    await page.click('body > #root > ul > li:nth-child(3) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/10_untracked.ts b/tests/e2e/10_untracked.ts
index 982f5a0c..a697e21e 100644
--- a/tests/e2e/10_untracked.ts
+++ b/tests/e2e/10_untracked.ts
@@ -11,15 +11,17 @@ describe('10_untracked', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(2) > input:nth-child(2)',
+      'body > #root > ul > li:nth-child(2) > input:nth-child(2)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(2) > input:nth-child(2)',
     );
-    await page.click('body > #app > ul > li:nth-child(2) > input:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > ul > li:nth-child(2) > input:nth-child(2)',
+      'body > #root > ul > li:nth-child(2) > input:nth-child(2)',
       '2',
     );
     expect(
@@ -27,15 +29,17 @@ describe('10_untracked', () => {
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(3) > input:nth-child(2)',
+      'body > #root > ul > li:nth-child(3) > input:nth-child(2)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(3) > input:nth-child(2)',
     );
-    await page.click('body > #app > ul > li:nth-child(3) > input:nth-child(2)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > ul > li:nth-child(3) > input:nth-child(2)',
+      'body > #root > ul > li:nth-child(3) > input:nth-child(2)',
       '3',
     );
     expect(
@@ -43,62 +47,70 @@ describe('10_untracked', () => {
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(2) > input:nth-child(1)',
+      'body > #root > ul > li:nth-child(2) > input:nth-child(1)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(2) > input:nth-child(1)',
     );
-    await page.click('body > #app > ul > li:nth-child(2) > input:nth-child(1)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(3) > input:nth-child(1)',
+      'body > #root > ul > li:nth-child(3) > input:nth-child(1)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(3) > input:nth-child(1)',
     );
-    await page.click('body > #app > ul > li:nth-child(3) > input:nth-child(1)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(1) > input:nth-child(1)',
+      'body > #root > ul > li:nth-child(1) > input:nth-child(1)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(1) > input:nth-child(1)',
     );
-    await page.click('body > #app > ul > li:nth-child(1) > input:nth-child(1)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(2) > button:nth-child(4)',
+      'body > #root > ul > li:nth-child(2) > button:nth-child(4)',
     );
     await page.click(
-      'body > #app > ul > li:nth-child(2) > button:nth-child(4)',
+      'body > #root > ul > li:nth-child(2) > button:nth-child(4)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(3) > button:nth-child(3)',
+      'body > #root > ul > li:nth-child(3) > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > ul > li:nth-child(3) > button:nth-child(3)',
+      'body > #root > ul > li:nth-child(3) > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(3) > input:nth-child(1)',
+      'body > #root > ul > li:nth-child(3) > input:nth-child(1)',
+    );
+    await page.click(
+      'body > #root > ul > li:nth-child(3) > input:nth-child(1)',
     );
-    await page.click('body > #app > ul > li:nth-child(3) > input:nth-child(1)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > ul > li:nth-child(2) > button:nth-child(3)',
+      'body > #root > ul > li:nth-child(2) > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > ul > li:nth-child(2) > button:nth-child(3)',
+      'body > #root > ul > li:nth-child(2) > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
diff --git a/tests/e2e/11_form.ts b/tests/e2e/11_form.ts
index 134e0de6..54e211e8 100644
--- a/tests/e2e/11_form.ts
+++ b/tests/e2e/11_form.ts
@@ -10,61 +10,61 @@ describe('11_form', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('#app > form > div:nth-child(3) > div > input');
-    await page.click('#app > form > div:nth-child(3) > div > input');
+    await page.waitForSelector('#root > form > div:nth-child(3) > div > input');
+    await page.click('#root > form > div:nth-child(3) > div > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(3) > div > input', '1');
+    await page.type('#root > form > div:nth-child(3) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(3) > div > input', '1');
+    await page.type('#root > form > div:nth-child(3) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(3) > div > input', '1');
+    await page.type('#root > form > div:nth-child(3) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(5) > div > input', '2');
+    await page.type('#root > form > div:nth-child(5) > div > input', '2');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(5) > div > input', '2');
+    await page.type('#root > form > div:nth-child(5) > div > input', '2');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('#app > form > div:nth-child(5) > div > input', '2');
+    await page.type('#root > form > div:nth-child(5) > div > input', '2');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > form > div > div > select');
-    await page.click('#app > form > div > div > select');
+    await page.waitForSelector('#root > form > div > div > select');
+    await page.click('#root > form > div > div > select');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.select('#app > form > div > div > select', 'male');
+    await page.select('#root > form > div > div > select', 'male');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('#app > form > div:nth-child(9) > div > input');
-    await page.click('#app > form > div:nth-child(9) > div > input');
+    await page.waitForSelector('#root > form > div:nth-child(9) > div > input');
+    await page.click('#root > form > div:nth-child(9) > div > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > form > button');
-    await page.click('body > #app > form > button');
+    await page.waitForSelector('body > #root > form > button');
+    await page.click('body > #root > form > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/12_async.ts b/tests/e2e/12_async.ts
index baae0358..ce3d08e4 100644
--- a/tests/e2e/12_async.ts
+++ b/tests/e2e/12_async.ts
@@ -15,8 +15,10 @@ describe('12_async', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > div > div:nth-child(3) > button');
-    await page.click('body > #app > div > div:nth-child(3) > button');
+    await page.waitForSelector(
+      'body > #root > div > div:nth-child(3) > button',
+    );
+    await page.click('body > #root > div > div:nth-child(3) > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
@@ -27,17 +29,19 @@ describe('12_async', () => {
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div > div:nth-child(4) > button:nth-child(2)',
+      'body > #root > div > div:nth-child(4) > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div > div:nth-child(4) > button:nth-child(2)',
+      'body > #root > div > div:nth-child(4) > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/13_saga.ts b/tests/e2e/13_saga.ts
index 5536265a..ea549b5f 100644
--- a/tests/e2e/13_saga.ts
+++ b/tests/e2e/13_saga.ts
@@ -15,8 +15,10 @@ describe('13_saga', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > div > div:nth-child(3) > button');
-    await page.click('body > #app > div > div:nth-child(3) > button');
+    await page.waitForSelector(
+      'body > #root > div > div:nth-child(3) > button',
+    );
+    await page.click('body > #root > div > div:nth-child(3) > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
@@ -27,17 +29,19 @@ describe('13_saga', () => {
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div > div:nth-child(4) > button:nth-child(2)',
+      'body > #root > div > div:nth-child(4) > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div > div:nth-child(4) > button:nth-child(2)',
+      'body > #root > div > div:nth-child(4) > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div > div > button:nth-child(3)');
-    await page.click('body > #app > div > div > button:nth-child(3)');
+    await page.waitForSelector(
+      'body > #root > div > div > button:nth-child(3)',
+    );
+    await page.click('body > #root > div > div > button:nth-child(3)');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/14_dynamic.ts b/tests/e2e/14_dynamic.ts
index 07cac6cc..ea8b1334 100644
--- a/tests/e2e/14_dynamic.ts
+++ b/tests/e2e/14_dynamic.ts
@@ -11,91 +11,95 @@ describe('14_dynamic', () => {
     await page.goto(`http://localhost:${port}/`);
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(2)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(2)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(2) > div > input');
-    await page.click('body > #app > div:nth-child(2) > div > input');
+    await page.waitForSelector('body > #root > div:nth-child(2) > div > input');
+    await page.click('body > #root > div:nth-child(2) > div > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(2) > div > input', '1');
+    await page.type('body > #root > div:nth-child(2) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     await page.click(
-      'body > #app > div:nth-child(2) > div > button:nth-child(3)',
+      'body > #root > div:nth-child(2) > div > button:nth-child(3)',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(3) > div > input');
-    await page.click('body > #app > div:nth-child(3) > div > input');
+    await page.waitForSelector('body > #root > div:nth-child(3) > div > input');
+    await page.click('body > #root > div:nth-child(3) > div > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.type('body > #app > div:nth-child(3) > div > input', '1');
+    await page.type('body > #root > div:nth-child(3) > div > input', '1');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'a',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(5) > div > button');
-    await page.click('body > #app > div:nth-child(5) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(5) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(5) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.waitForSelector(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     await page.click(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
     await page.type(
-      'body > #app > div:nth-child(5) > div:nth-child(1) > input',
+      'body > #root > div:nth-child(5) > div:nth-child(1) > input',
       'b',
     );
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > div:nth-child(6) > div > button');
-    await page.click('body > #app > div:nth-child(6) > div > button');
+    await page.waitForSelector(
+      'body > #root > div:nth-child(6) > div > button',
+    );
+    await page.click('body > #root > div:nth-child(6) > div > button');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/15_reactmemoref.ts b/tests/e2e/15_reactmemoref.ts
index 68850b69..a2781156 100644
--- a/tests/e2e/15_reactmemoref.ts
+++ b/tests/e2e/15_reactmemoref.ts
@@ -10,38 +10,38 @@ describe('15_reactmemoref', () => {
     const page = await browser.newPage();
     await page.goto(`http://localhost:${port}/`);
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(1) > input');
-    await page.click('body > #app > ul > li:nth-child(1) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(1) > input');
+    await page.click('body > #root > ul > li:nth-child(1) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(2) > input');
-    await page.click('body > #app > ul > li:nth-child(2) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(2) > input');
+    await page.click('body > #root > ul > li:nth-child(2) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(3) > input');
-    await page.click('body > #app > ul > li:nth-child(3) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(3) > input');
+    await page.click('body > #root > ul > li:nth-child(3) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(1) > input');
-    await page.click('body > #app > ul > li:nth-child(1) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(1) > input');
+    await page.click('body > #root > ul > li:nth-child(1) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(2) > input');
-    await page.click('body > #app > ul > li:nth-child(2) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(2) > input');
+    await page.click('body > #root > ul > li:nth-child(2) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
 
-    await page.waitForSelector('body > #app > ul > li:nth-child(3) > input');
-    await page.click('body > #app > ul > li:nth-child(3) > input');
+    await page.waitForSelector('body > #root > ul > li:nth-child(3) > input');
+    await page.click('body > #root > ul > li:nth-child(3) > input');
     expect(
       await page.evaluate(() => document.body.innerHTML),
     ).toMatchSnapshot();
diff --git a/tests/e2e/__snapshots__/01_counter.ts.snap b/tests/e2e/__snapshots__/01_counter.ts.snap
index ae585683..7ffa112a 100644
--- a/tests/e2e/__snapshots__/01_counter.ts.snap
+++ b/tests/e2e/__snapshots__/01_counter.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`01_minimal > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 28<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 28<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`01_minimal > should work with recorded events 1`] = `
 
 exports[`01_minimal > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 36<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 36<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`01_minimal > should work with recorded events 2`] = `
 
 exports[`01_minimal > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 3</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 44<div><span>Count: 3</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 3</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 44<div><span>Count: 3</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`01_minimal > should work with recorded events 3`] = `
 
 exports[`01_minimal > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 52<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 52<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`01_minimal > should work with recorded events 4`] = `
 
 exports[`01_minimal > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 58<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 60<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 58<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 60<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`01_minimal > should work with recorded events 5`] = `
 
 exports[`01_minimal > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 66<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 68<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 66<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 68<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`01_minimal > should work with recorded events 6`] = `
 
 exports[`01_minimal > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`01_minimal > should work with recorded events 7`] = `
 
 exports[`01_minimal > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 82<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 84<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 82<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 84<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`01_minimal > should work with recorded events 8`] = `
 
 exports[`01_minimal > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 90<div><span>Count: -3</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 92<div><span>Count: -3</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 90<div><span>Count: -3</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 92<div><span>Count: -3</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`01_minimal > should work with recorded events 9`] = `
 
 exports[`01_minimal > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 98<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 100<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 98<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 100<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`01_minimal > should work with recorded events 10`] = `
 
 exports[`01_minimal > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 106<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 108<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 106<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 108<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`01_minimal > should work with recorded events 11`] = `
 
 exports[`01_minimal > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`01_minimal > should work with recorded events 12`] = `
 
 exports[`01_minimal > should work with recorded events 13`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 6<div><span>Text: hello</span><input value="hello"></div></div><div>numRendered: 8<div><span>Text: hello</span><input value="hello"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`01_minimal > should work with recorded events 13`] = `
 
 exports[`01_minimal > should work with recorded events 14`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 126<div><span>Text: hello1</span><input value="hello1"></div></div><div>numRendered: 128<div><span>Text: hello1</span><input value="hello1"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 126<div><span>Text: hello1</span><input value="hello1"></div></div><div>numRendered: 128<div><span>Text: hello1</span><input value="hello1"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -114,7 +128,8 @@ exports[`01_minimal > should work with recorded events 14`] = `
 
 exports[`01_minimal > should work with recorded events 15`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 134<div><span>Text: hello12</span><input value="hello12"></div></div><div>numRendered: 136<div><span>Text: hello12</span><input value="hello12"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 134<div><span>Text: hello12</span><input value="hello12"></div></div><div>numRendered: 136<div><span>Text: hello12</span><input value="hello12"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -122,7 +137,8 @@ exports[`01_minimal > should work with recorded events 15`] = `
 
 exports[`01_minimal > should work with recorded events 16`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 142<div><span>Text: hello123</span><input value="hello123"></div></div><div>numRendered: 144<div><span>Text: hello123</span><input value="hello123"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 114<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 116<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>TextBox</h1><div>numRendered: 142<div><span>Text: hello123</span><input value="hello123"></div></div><div>numRendered: 144<div><span>Text: hello123</span><input value="hello123"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/02_person.ts.snap b/tests/e2e/__snapshots__/02_person.ts.snap
index e11f07a1..8debbd10 100644
--- a/tests/e2e/__snapshots__/02_person.ts.snap
+++ b/tests/e2e/__snapshots__/02_person.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`02_typescript > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 36<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 40<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 36<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 40<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`02_typescript > should work with recorded events 1`] = `
 
 exports[`02_typescript > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 28<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 52<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 56<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 28<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 52<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 56<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`02_typescript > should work with recorded events 2`] = `
 
 exports[`02_typescript > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 36<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 68<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 72<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 36<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 68<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 72<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`02_typescript > should work with recorded events 3`] = `
 
 exports[`02_typescript > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 44<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 84<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 88<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 44<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 84<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 88<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`02_typescript > should work with recorded events 4`] = `
 
 exports[`02_typescript > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 52<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 100<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 104<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 52<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 100<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 104<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`02_typescript > should work with recorded events 5`] = `
 
 exports[`02_typescript > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 58<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 60<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 116<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 120<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 58<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 60<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 116<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 120<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`02_typescript > should work with recorded events 6`] = `
 
 exports[`02_typescript > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 66<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 68<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 132<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 136<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 66<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 68<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 132<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 136<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`02_typescript > should work with recorded events 7`] = `
 
 exports[`02_typescript > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 148<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 152<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 148<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 152<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`02_typescript > should work with recorded events 8`] = `
 
 exports[`02_typescript > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 148<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 152<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>numRendered: 148<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 6<div>numRendered: 152<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`02_typescript > should work with recorded events 9`] = `
 
 exports[`02_typescript > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 162<div>numRendered: 164a<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 166<div>numRendered: 168a<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 162<div>numRendered: 164a<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 166<div>numRendered: 168a<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`02_typescript > should work with recorded events 10`] = `
 
 exports[`02_typescript > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 178<div>numRendered: 180ab<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="ab"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 182<div>numRendered: 184ab<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="ab"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 178<div>numRendered: 180ab<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="ab"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 182<div>numRendered: 184ab<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="ab"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`02_typescript > should work with recorded events 11`] = `
 
 exports[`02_typescript > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 194<div>numRendered: 196abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 198<div>numRendered: 200abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 194<div>numRendered: 196abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 198<div>numRendered: 200abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`02_typescript > should work with recorded events 12`] = `
 
 exports[`02_typescript > should work with recorded events 13`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 210<div>numRendered: 212abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="d"></div><div>Age:<input value="0"></div></div><div>numRendered: 214<div>numRendered: 216abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="d"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 210<div>numRendered: 212abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="d"></div><div>Age:<input value="0"></div></div><div>numRendered: 214<div>numRendered: 216abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="d"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`02_typescript > should work with recorded events 13`] = `
 
 exports[`02_typescript > should work with recorded events 14`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 226<div>numRendered: 228abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="de"></div><div>Age:<input value="0"></div></div><div>numRendered: 230<div>numRendered: 232abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="de"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 226<div>numRendered: 228abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="de"></div><div>Age:<input value="0"></div></div><div>numRendered: 230<div>numRendered: 232abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="de"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -114,7 +128,8 @@ exports[`02_typescript > should work with recorded events 14`] = `
 
 exports[`02_typescript > should work with recorded events 15`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 242<div>numRendered: 244abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="0"></div></div><div>numRendered: 246<div>numRendered: 248abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 242<div>numRendered: 244abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="0"></div></div><div>numRendered: 246<div>numRendered: 248abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -122,7 +137,8 @@ exports[`02_typescript > should work with recorded events 15`] = `
 
 exports[`02_typescript > should work with recorded events 16`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 258<div>numRendered: 260abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="1"></div></div><div>numRendered: 262<div>numRendered: 264abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="1"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 258<div>numRendered: 260abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="1"></div></div><div>numRendered: 262<div>numRendered: 264abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="1"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -130,7 +146,8 @@ exports[`02_typescript > should work with recorded events 16`] = `
 
 exports[`02_typescript > should work with recorded events 17`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 274<div>numRendered: 276abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="12"></div></div><div>numRendered: 278<div>numRendered: 280abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="12"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 274<div>numRendered: 276abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="12"></div></div><div>numRendered: 278<div>numRendered: 280abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="12"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -138,7 +155,8 @@ exports[`02_typescript > should work with recorded events 17`] = `
 
 exports[`02_typescript > should work with recorded events 18`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 290<div>numRendered: 292abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="123"></div></div><div>numRendered: 294<div>numRendered: 296abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="123"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 74<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 76<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 290<div>numRendered: 292abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="123"></div></div><div>numRendered: 294<div>numRendered: 296abc<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>First Name:<input value="abc"></div><div>Last Name:<input value="def"></div><div>Age:<input value="123"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/03_usestate.ts.snap b/tests/e2e/__snapshots__/03_usestate.ts.snap
index 26fe44bb..259da77f 100644
--- a/tests/e2e/__snapshots__/03_usestate.ts.snap
+++ b/tests/e2e/__snapshots__/03_usestate.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`03_usestate > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`03_usestate > should work with recorded events 1`] = `
 
 exports[`03_usestate > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 2</span><button type="button">+1</button></div></div><div>numRendered: 28<div><span>Count: 2</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 26<div><span>Count: 2</span><button type="button">+1</button></div></div><div>numRendered: 28<div><span>Count: 2</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`03_usestate > should work with recorded events 2`] = `
 
 exports[`03_usestate > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 3</span><button type="button">+1</button></div></div><div>numRendered: 36<div><span>Count: 3</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 34<div><span>Count: 3</span><button type="button">+1</button></div></div><div>numRendered: 36<div><span>Count: 3</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`03_usestate > should work with recorded events 3`] = `
 
 exports[`03_usestate > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 4</span><button type="button">+1</button></div></div><div>numRendered: 44<div><span>Count: 4</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 42<div><span>Count: 4</span><button type="button">+1</button></div></div><div>numRendered: 44<div><span>Count: 4</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`03_usestate > should work with recorded events 4`] = `
 
 exports[`03_usestate > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`03_usestate > should work with recorded events 5`] = `
 
 exports[`03_usestate > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`03_usestate > should work with recorded events 6`] = `
 
 exports[`03_usestate > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 58<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 60<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 58<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 60<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`03_usestate > should work with recorded events 7`] = `
 
 exports[`03_usestate > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 66<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 68<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 66<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 68<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`03_usestate > should work with recorded events 8`] = `
 
 exports[`03_usestate > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 74<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 76<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 74<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 76<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`03_usestate > should work with recorded events 9`] = `
 
 exports[`03_usestate > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 82<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div><div>numRendered: 84<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 82<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div><div>numRendered: 84<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`03_usestate > should work with recorded events 10`] = `
 
 exports[`03_usestate > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 90<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div><div>numRendered: 92<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 90<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div><div>numRendered: 92<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`03_usestate > should work with recorded events 11`] = `
 
 exports[`03_usestate > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 98<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div><div>numRendered: 100<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 98<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div><div>numRendered: 100<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`03_usestate > should work with recorded events 12`] = `
 
 exports[`03_usestate > should work with recorded events 13`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 106<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div><div>numRendered: 108<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 106<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div><div>numRendered: 108<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`03_usestate > should work with recorded events 13`] = `
 
 exports[`03_usestate > should work with recorded events 14`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 114<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div><div>numRendered: 116<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 114<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div><div>numRendered: 116<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -114,7 +128,8 @@ exports[`03_usestate > should work with recorded events 14`] = `
 
 exports[`03_usestate > should work with recorded events 15`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 122<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div><div>numRendered: 124<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 50<div><span>Count: 5</span><button type="button">+1</button></div></div><div>numRendered: 52<div><span>Count: 5</span><button type="button">+1</button></div></div><h1>Person</h1><div>numRendered: 122<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div><div>numRendered: 124<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/04_selector.ts.snap b/tests/e2e/__snapshots__/04_selector.ts.snap
index e49ec5d9..8e2c4fc4 100644
--- a/tests/e2e/__snapshots__/04_selector.ts.snap
+++ b/tests/e2e/__snapshots__/04_selector.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`04_selector > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 14<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 16<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 14<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 16<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`04_selector > should work with recorded events 1`] = `
 
 exports[`04_selector > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 22<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 24<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 22<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 24<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`04_selector > should work with recorded events 2`] = `
 
 exports[`04_selector > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 30<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 32<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 30<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 32<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`04_selector > should work with recorded events 3`] = `
 
 exports[`04_selector > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`04_selector > should work with recorded events 4`] = `
 
 exports[`04_selector > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`04_selector > should work with recorded events 5`] = `
 
 exports[`04_selector > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 46<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 48<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 46<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 48<div>First Name:<input value="a"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`04_selector > should work with recorded events 6`] = `
 
 exports[`04_selector > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 54<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 56<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 54<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 56<div>First Name:<input value="aa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`04_selector > should work with recorded events 7`] = `
 
 exports[`04_selector > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 62<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 64<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 62<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div><div>numRendered: 64<div>First Name:<input value="aaa"></div><div>Last Name:<input value=""></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`04_selector > should work with recorded events 8`] = `
 
 exports[`04_selector > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 70<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div><div>numRendered: 72<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 70<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div><div>numRendered: 72<div>First Name:<input value="aaa"></div><div>Last Name:<input value="b"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`04_selector > should work with recorded events 9`] = `
 
 exports[`04_selector > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 78<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div><div>numRendered: 80<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 78<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div><div>numRendered: 80<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bb"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`04_selector > should work with recorded events 10`] = `
 
 exports[`04_selector > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 86<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div><div>numRendered: 88<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 86<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div><div>numRendered: 88<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`04_selector > should work with recorded events 11`] = `
 
 exports[`04_selector > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 94<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div><div>numRendered: 96<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 94<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div><div>numRendered: 96<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="1"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`04_selector > should work with recorded events 12`] = `
 
 exports[`04_selector > should work with recorded events 13`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 102<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div><div>numRendered: 104<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 102<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div><div>numRendered: 104<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="11"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`04_selector > should work with recorded events 13`] = `
 
 exports[`04_selector > should work with recorded events 14`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 110<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div><div>numRendered: 112<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Person</h1><div>numRendered: 110<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div><div>numRendered: 112<div>First Name:<input value="aaa"></div><div>Last Name:<input value="bbb"></div><div>Age:<input value="111"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/05_container.ts.snap b/tests/e2e/__snapshots__/05_container.ts.snap
index 0b378b78..1e629e7c 100644
--- a/tests/e2e/__snapshots__/05_container.ts.snap
+++ b/tests/e2e/__snapshots__/05_container.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`05_container > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 30<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 32<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 30<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 32<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`05_container > should work with recorded events 1`] = `
 
 exports[`05_container > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 38<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 40<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`05_container > should work with recorded events 2`] = `
 
 exports[`05_container > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 46<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 48<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 46<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 48<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`05_container > should work with recorded events 3`] = `
 
 exports[`05_container > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 54<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 56<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 54<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 56<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`05_container > should work with recorded events 4`] = `
 
 exports[`05_container > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 62<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 64<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 62<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 64<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`05_container > should work with recorded events 5`] = `
 
 exports[`05_container > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 70<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 72<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 70<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 72<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`05_container > should work with recorded events 6`] = `
 
 exports[`05_container > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 78<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 80<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 78<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 80<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`05_container > should work with recorded events 7`] = `
 
 exports[`05_container > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 86<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 88<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 86<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 88<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`05_container > should work with recorded events 8`] = `
 
 exports[`05_container > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 94<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 96<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 94<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 96<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`05_container > should work with recorded events 9`] = `
 
 exports[`05_container > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 6<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 8<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`05_container > should work with recorded events 10`] = `
 
 exports[`05_container > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 110<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 112<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 110<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 112<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`05_container > should work with recorded events 11`] = `
 
 exports[`05_container > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 118<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 120<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 118<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 120<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`05_container > should work with recorded events 12`] = `
 
 exports[`05_container > should work with recorded events 13`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 126<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 128<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 126<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 128<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`05_container > should work with recorded events 13`] = `
 
 exports[`05_container > should work with recorded events 14`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 134<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 136<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 134<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 136<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -114,7 +128,8 @@ exports[`05_container > should work with recorded events 14`] = `
 
 exports[`05_container > should work with recorded events 15`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 142<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 144<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 142<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 144<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -122,7 +137,8 @@ exports[`05_container > should work with recorded events 15`] = `
 
 exports[`05_container > should work with recorded events 16`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 150<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 152<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 150<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 152<div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -130,7 +146,8 @@ exports[`05_container > should work with recorded events 16`] = `
 
 exports[`05_container > should work with recorded events 17`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 158<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 160<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 158<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 160<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -138,7 +155,8 @@ exports[`05_container > should work with recorded events 17`] = `
 
 exports[`05_container > should work with recorded events 18`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 166<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 168<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 166<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 168<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -146,7 +164,8 @@ exports[`05_container > should work with recorded events 18`] = `
 
 exports[`05_container > should work with recorded events 19`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 174<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 176<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 174<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 176<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -154,7 +173,8 @@ exports[`05_container > should work with recorded events 19`] = `
 
 exports[`05_container > should work with recorded events 20`] = `
 "
-    <div id="app"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 182<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 184<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <div id="root"><h1>First container</h1><div>numRendered: 102<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 104<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><h1>Second container</h1><div>numRendered: 182<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div><div>numRendered: 184<div><span>Count: -2</span><button type="button">+1</button><button type="button">-1</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/06_customhook.ts.snap b/tests/e2e/__snapshots__/06_customhook.ts.snap
index cf2a213f..3d5ec5b5 100644
--- a/tests/e2e/__snapshots__/06_customhook.ts.snap
+++ b/tests/e2e/__snapshots__/06_customhook.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`06_customhook > should work with recorded events 1`] = `
 "
-    <div id="app"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`06_customhook > should work with recorded events 1`] = `
 
 exports[`06_customhook > should work with recorded events 2`] = `
 "
-    <div id="app"><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`06_customhook > should work with recorded events 2`] = `
 
 exports[`06_customhook > should work with recorded events 3`] = `
 "
-    <div id="app"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`06_customhook > should work with recorded events 3`] = `
 
 exports[`06_customhook > should work with recorded events 4`] = `
 "
-    <div id="app"><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`06_customhook > should work with recorded events 4`] = `
 
 exports[`06_customhook > should work with recorded events 5`] = `
 "
-    <div id="app"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`06_customhook > should work with recorded events 5`] = `
 
 exports[`06_customhook > should work with recorded events 6`] = `
 "
-    <div id="app"><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 2</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`06_customhook > should work with recorded events 6`] = `
 
 exports[`06_customhook > should work with recorded events 7`] = `
 "
-    <div id="app"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`06_customhook > should work with recorded events 7`] = `
 
 exports[`06_customhook > should work with recorded events 8`] = `
 "
-    <div id="app"><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <div id="root"><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div><div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/07_todolist.ts.snap b/tests/e2e/__snapshots__/07_todolist.ts.snap
index 2f3f81fa..a24a3354 100644
--- a/tests/e2e/__snapshots__/07_todolist.ts.snap
+++ b/tests/e2e/__snapshots__/07_todolist.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`07_todolist > should work with recorded events 1`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`07_todolist > should work with recorded events 1`] = `
 
 exports[`07_todolist > should work with recorded events 2`] = `
 "
-    <div id="app"><div><div><form><input value="a"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="a"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`07_todolist > should work with recorded events 2`] = `
 
 exports[`07_todolist > should work with recorded events 3`] = `
 "
-    <div id="app"><div><div><form><input value="aa"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="aa"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`07_todolist > should work with recorded events 3`] = `
 
 exports[`07_todolist > should work with recorded events 4`] = `
 "
-    <div id="app"><div><div><form><input value="aaa"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="aaa"><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`07_todolist > should work with recorded events 4`] = `
 
 exports[`07_todolist > should work with recorded events 5`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`07_todolist > should work with recorded events 5`] = `
 
 exports[`07_todolist > should work with recorded events 6`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`07_todolist > should work with recorded events 6`] = `
 
 exports[`07_todolist > should work with recorded events 7`] = `
 "
-    <div id="app"><div><div><form><input value="b"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="b"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`07_todolist > should work with recorded events 7`] = `
 
 exports[`07_todolist > should work with recorded events 8`] = `
 "
-    <div id="app"><div><div><form><input value="bb"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="bb"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`07_todolist > should work with recorded events 8`] = `
 
 exports[`07_todolist > should work with recorded events 9`] = `
 "
-    <div id="app"><div><div><form><input value="bbb"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="bbb"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`07_todolist > should work with recorded events 9`] = `
 
 exports[`07_todolist > should work with recorded events 10`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`07_todolist > should work with recorded events 10`] = `
 
 exports[`07_todolist > should work with recorded events 11`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`07_todolist > should work with recorded events 11`] = `
 
 exports[`07_todolist > should work with recorded events 12`] = `
 "
-    <div id="app"><div><div><form><input value="c"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="c"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -98,7 +110,8 @@ exports[`07_todolist > should work with recorded events 12`] = `
 
 exports[`07_todolist > should work with recorded events 13`] = `
 "
-    <div id="app"><div><div><form><input value="cc"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="cc"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -106,7 +119,8 @@ exports[`07_todolist > should work with recorded events 13`] = `
 
 exports[`07_todolist > should work with recorded events 14`] = `
 "
-    <div id="app"><div><div><form><input value="ccc"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value="ccc"><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -114,7 +128,8 @@ exports[`07_todolist > should work with recorded events 14`] = `
 
 exports[`07_todolist > should work with recorded events 15`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" disabled="" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -122,7 +137,8 @@ exports[`07_todolist > should work with recorded events 15`] = `
 
 exports[`07_todolist > should work with recorded events 16`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -130,7 +146,8 @@ exports[`07_todolist > should work with recorded events 16`] = `
 
 exports[`07_todolist > should work with recorded events 17`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -138,7 +155,8 @@ exports[`07_todolist > should work with recorded events 17`] = `
 
 exports[`07_todolist > should work with recorded events 18`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -146,7 +164,8 @@ exports[`07_todolist > should work with recorded events 18`] = `
 
 exports[`07_todolist > should work with recorded events 19`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -154,7 +173,8 @@ exports[`07_todolist > should work with recorded events 19`] = `
 
 exports[`07_todolist > should work with recorded events 20`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -162,7 +182,8 @@ exports[`07_todolist > should work with recorded events 20`] = `
 
 exports[`07_todolist > should work with recorded events 21`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -170,7 +191,8 @@ exports[`07_todolist > should work with recorded events 21`] = `
 
 exports[`07_todolist > should work with recorded events 22`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: none; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -178,7 +200,8 @@ exports[`07_todolist > should work with recorded events 22`] = `
 
 exports[`07_todolist > should work with recorded events 23`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -186,7 +209,8 @@ exports[`07_todolist > should work with recorded events 23`] = `
 
 exports[`07_todolist > should work with recorded events 24`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -194,7 +218,8 @@ exports[`07_todolist > should work with recorded events 24`] = `
 
 exports[`07_todolist > should work with recorded events 25`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -202,7 +227,8 @@ exports[`07_todolist > should work with recorded events 25`] = `
 
 exports[`07_todolist > should work with recorded events 26`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;" disabled="">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -210,7 +236,8 @@ exports[`07_todolist > should work with recorded events 26`] = `
 
 exports[`07_todolist > should work with recorded events 27`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li><li role="presentation" style="text-decoration: line-through; cursor: pointer;">ccc</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;" disabled="">All</button><button type="button" style="margin-left: 4px;">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -218,7 +245,8 @@ exports[`07_todolist > should work with recorded events 27`] = `
 
 exports[`07_todolist > should work with recorded events 28`] = `
 "
-    <div id="app"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <div id="root"><div><div><form><input value=""><button type="submit">Add Todo</button></form></div><ul><li role="presentation" style="text-decoration: none; cursor: pointer;">aaa</li><li role="presentation" style="text-decoration: none; cursor: pointer;">bbb</li></ul><div><span>Show: </span><button type="button" style="margin-left: 4px;">All</button><button type="button" style="margin-left: 4px;" disabled="">Active</button><button type="button" style="margin-left: 4px;">Completed</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/08_comparison.ts.snap b/tests/e2e/__snapshots__/08_comparison.ts.snap
index ccb3f1c4..4c3df0f6 100644
--- a/tests/e2e/__snapshots__/08_comparison.ts.snap
+++ b/tests/e2e/__snapshots__/08_comparison.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`08_comparison > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`08_comparison > should work with recorded events 1`] = `
 
 exports[`08_comparison > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:3)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:3)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`08_comparison > should work with recorded events 2`] = `
 
 exports[`08_comparison > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`08_comparison > should work with recorded events 3`] = `
 
 exports[`08_comparison > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`08_comparison > should work with recorded events 4`] = `
 
 exports[`08_comparison > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`08_comparison > should work with recorded events 5`] = `
 
 exports[`08_comparison > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`08_comparison > should work with recorded events 6`] = `
 
 exports[`08_comparison > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry">(renders:2)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`08_comparison > should work with recorded events 7`] = `
 
 exports[`08_comparison > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter">(renders:2)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`08_comparison > should work with recorded events 8`] = `
 
 exports[`08_comparison > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry">(renders:1)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`08_comparison > should work with recorded events 9`] = `
 
 exports[`08_comparison > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter">(renders:1)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`08_comparison > should work with recorded events 10`] = `
 
 exports[`08_comparison > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div></div>
+    <div id="root"><h1>Naive Context</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>Split Context</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with React.memo</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div><h1>Context with useMemo</h1><div>First Name:<input value="Harry1">(renders:4)</div><div>Family Name:<input value="Potter1">(renders:4)</div><h1>react-tracked</h1><div>First Name:<input value="Harry1">(renders:3)</div><div>Family Name:<input value="Potter1">(renders:3)</div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/09_reactmemo.ts.snap b/tests/e2e/__snapshots__/09_reactmemo.ts.snap
index ceeb9bbd..d98808bb 100644
--- a/tests/e2e/__snapshots__/09_reactmemo.ts.snap
+++ b/tests/e2e/__snapshots__/09_reactmemo.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`09_reactmemo > should work with recorded events 1`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 4<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 4<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`09_reactmemo > should work with recorded events 1`] = `
 
 exports[`09_reactmemo > should work with recorded events 2`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`09_reactmemo > should work with recorded events 2`] = `
 
 exports[`09_reactmemo > should work with recorded events 3`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`09_reactmemo > should work with recorded events 3`] = `
 
 exports[`09_reactmemo > should work with recorded events 4`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`09_reactmemo > should work with recorded events 4`] = `
 
 exports[`09_reactmemo > should work with recorded events 5`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`09_reactmemo > should work with recorded events 5`] = `
 
 exports[`09_reactmemo > should work with recorded events 6`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 18<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 18<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/10_untracked.ts.snap b/tests/e2e/__snapshots__/10_untracked.ts.snap
index 0e5073aa..62383f20 100644
--- a/tests/e2e/__snapshots__/10_untracked.ts.snap
+++ b/tests/e2e/__snapshots__/10_untracked.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`10_untracked > should work with recorded events 1`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`10_untracked > should work with recorded events 1`] = `
 
 exports[`10_untracked > should work with recorded events 2`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`10_untracked > should work with recorded events 2`] = `
 
 exports[`10_untracked > should work with recorded events 3`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`10_untracked > should work with recorded events 3`] = `
 
 exports[`10_untracked > should work with recorded events 4`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`10_untracked > should work with recorded events 4`] = `
 
 exports[`10_untracked > should work with recorded events 5`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`10_untracked > should work with recorded events 5`] = `
 
 exports[`10_untracked > should work with recorded events 6`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`10_untracked > should work with recorded events 6`] = `
 
 exports[`10_untracked > should work with recorded events 7`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`10_untracked > should work with recorded events 7`] = `
 
 exports[`10_untracked > should work with recorded events 8`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Buy ticket3"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`10_untracked > should work with recorded events 8`] = `
 
 exports[`10_untracked > should work with recorded events 9`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`10_untracked > should work with recorded events 9`] = `
 
 exports[`10_untracked > should work with recorded events 10`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox"><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`10_untracked > should work with recorded events 10`] = `
 
 exports[`10_untracked > should work with recorded events 11`] = `
 "
-    <div id="app"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <div id="root"><ul><li><input type="checkbox" checked=""><input value="Wash dishes"><button type="button">Delete</button><button type="button">Duplicate</button></li><li><input type="checkbox" checked=""><input value="Study JS2"><button type="button">Delete</button><button type="button">Duplicate</button></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/11_form.ts.snap b/tests/e2e/__snapshots__/11_form.ts.snap
index aabe61b9..dc342aee 100644
--- a/tests/e2e/__snapshots__/11_form.ts.snap
+++ b/tests/e2e/__snapshots__/11_form.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`11_form > should work with recorded events 1`] = `
 "
-    <div id="app"><form>numRendered: 42<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 44<div>First Name:<input value="">name is required</div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 42<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 44<div>First Name:<input value="">name is required</div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`11_form > should work with recorded events 1`] = `
 
 exports[`11_form > should work with recorded events 2`] = `
 "
-    <div id="app"><form>numRendered: 62<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 64<div>First Name:<input value="1"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 62<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 64<div>First Name:<input value="1"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`11_form > should work with recorded events 2`] = `
 
 exports[`11_form > should work with recorded events 3`] = `
 "
-    <div id="app"><form>numRendered: 82<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 84<div>First Name:<input value="11"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 82<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 84<div>First Name:<input value="11"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`11_form > should work with recorded events 3`] = `
 
 exports[`11_form > should work with recorded events 4`] = `
 "
-    <div id="app"><form>numRendered: 102<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 102<button type="submit" disabled="">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 46<div>Family Name:<input value="">name is required</div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`11_form > should work with recorded events 4`] = `
 
 exports[`11_form > should work with recorded events 5`] = `
 "
-    <div id="app"><form>numRendered: 122<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 126<div>Family Name:<input value="2"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 122<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 126<div>Family Name:<input value="2"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`11_form > should work with recorded events 5`] = `
 
 exports[`11_form > should work with recorded events 6`] = `
 "
-    <div id="app"><form>numRendered: 142<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 146<div>Family Name:<input value="22"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 142<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 146<div>Family Name:<input value="22"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`11_form > should work with recorded events 6`] = `
 
 exports[`11_form > should work with recorded events 7`] = `
 "
-    <div id="app"><form>numRendered: 162<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 162<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`11_form > should work with recorded events 7`] = `
 
 exports[`11_form > should work with recorded events 8`] = `
 "
-    <div id="app"><form>numRendered: 162<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 162<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 38<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`11_form > should work with recorded events 8`] = `
 
 exports[`11_form > should work with recorded events 9`] = `
 "
-    <div id="app"><form>numRendered: 182<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 182<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 40<div>Teenager:<input type="checkbox" value="false"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`11_form > should work with recorded events 9`] = `
 
 exports[`11_form > should work with recorded events 10`] = `
 "
-    <div id="app"><form>numRendered: 202<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 210<div>Teenager:<input type="checkbox" value="true"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 202<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 210<div>Teenager:<input type="checkbox" value="true"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`11_form > should work with recorded events 10`] = `
 
 exports[`11_form > should work with recorded events 11`] = `
 "
-    <div id="app"><form>numRendered: 202<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 210<div>Teenager:<input type="checkbox" value="true"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <div id="root"><form>numRendered: 202<button type="submit">Submit</button><h3>First Name</h3><div>numRendered: 104<div>First Name:<input value="111"></div></div><h3>Family Name</h3><div>numRendered: 166<div>Family Name:<input value="222"></div></div><h3>Gender</h3><div>numRendered: 188<div>Gender:<select><option value="na">N/A</option><option value="male">Male</option><option value="female">Female</option></select></div></div><h3>Teenager</h3><div>numRendered: 210<div>Teenager:<input type="checkbox" value="true"></div></div></form><div><a href="https://codesandbox.io/s/react-form-library-stress-test-4luf3">Stress Test</a></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/12_async.ts.snap b/tests/e2e/__snapshots__/12_async.ts.snap
index 12b47e1a..4a8c4712 100644
--- a/tests/e2e/__snapshots__/12_async.ts.snap
+++ b/tests/e2e/__snapshots__/12_async.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`12_async > should work with recorded events 1`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><span>connecting...</span><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><span>connecting...</span><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`12_async > should work with recorded events 1`] = `
 
 exports[`12_async > should work with recorded events 2`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`12_async > should work with recorded events 2`] = `
 
 exports[`12_async > should work with recorded events 3`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`12_async > should work with recorded events 3`] = `
 
 exports[`12_async > should work with recorded events 4`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`12_async > should work with recorded events 4`] = `
 
 exports[`12_async > should work with recorded events 5`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/13_saga.ts.snap b/tests/e2e/__snapshots__/13_saga.ts.snap
index 50f62cc9..ddee78b0 100644
--- a/tests/e2e/__snapshots__/13_saga.ts.snap
+++ b/tests/e2e/__snapshots__/13_saga.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`13_saga > should work with recorded events 1`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><span>connecting...</span><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><span>connecting...</span><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`13_saga > should work with recorded events 1`] = `
 
 exports[`13_saga > should work with recorded events 2`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`13_saga > should work with recorded events 2`] = `
 
 exports[`13_saga > should work with recorded events 3`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`13_saga > should work with recorded events 3`] = `
 
 exports[`13_saga > should work with recorded events 4`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 1<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`13_saga > should work with recorded events 4`] = `
 
 exports[`13_saga > should work with recorded events 5`] = `
 "
-    <div id="app"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <div id="root"><div><h1>Person</h1><div>User ID:<input value="3"></div><div>First Name: Emma<button type="button">Fetch User</button><button type="button">Clear</button></div><div><h1>Counter</h1>Count: 0<button type="button">+1</button><button type="button">-1 (Delayed)</button></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/14_dynamic.ts.snap b/tests/e2e/__snapshots__/14_dynamic.ts.snap
index 8473ae3e..2f4c3751 100644
--- a/tests/e2e/__snapshots__/14_dynamic.ts.snap
+++ b/tests/e2e/__snapshots__/14_dynamic.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`14_dynamic > should work with recorded events 1`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`14_dynamic > should work with recorded events 1`] = `
 
 exports[`14_dynamic > should work with recorded events 2`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 18<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`14_dynamic > should work with recorded events 2`] = `
 
 exports[`14_dynamic > should work with recorded events 3`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 22<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 22<div><span>Count: 0</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`14_dynamic > should work with recorded events 3`] = `
 
 exports[`14_dynamic > should work with recorded events 4`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`14_dynamic > should work with recorded events 4`] = `
 
 exports[`14_dynamic > should work with recorded events 5`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 20<div><span>Count: 1</span><button type="button">+1</button><button type="button">-1</button><input value="0"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`14_dynamic > should work with recorded events 5`] = `
 
 exports[`14_dynamic > should work with recorded events 6`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -50,7 +56,8 @@ exports[`14_dynamic > should work with recorded events 6`] = `
 
 exports[`14_dynamic > should work with recorded events 7`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 2<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 4<div>First Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -58,7 +65,8 @@ exports[`14_dynamic > should work with recorded events 7`] = `
 
 exports[`14_dynamic > should work with recorded events 8`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 34<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 34<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -66,7 +74,8 @@ exports[`14_dynamic > should work with recorded events 8`] = `
 
 exports[`14_dynamic > should work with recorded events 9`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 38<div>Last Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 38<div>Last Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -74,7 +83,8 @@ exports[`14_dynamic > should work with recorded events 9`] = `
 
 exports[`14_dynamic > should work with recorded events 10`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 38<div>Last Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 38<div>Last Name:<input value=""><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -82,7 +92,8 @@ exports[`14_dynamic > should work with recorded events 10`] = `
 
 exports[`14_dynamic > should work with recorded events 11`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 44<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 44<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 36<div>First Name:<input value="a"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -90,7 +101,8 @@ exports[`14_dynamic > should work with recorded events 11`] = `
 
 exports[`14_dynamic > should work with recorded events 12`] = `
 "
-    <div id="app"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 44<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 49<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <div id="root"><h1>Counter</h1><div>numRendered: 28<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><div>numRendered: 33<div><span>Count: -1</span><button type="button">+1</button><button type="button">-1</button><input value="1"></div></div><h1>Person</h1><div>numRendered: 44<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div><div>numRendered: 49<div>Last Name:<input value="b"><button type="button">toggle</button></div><div>Age:<input value="0"></div></div></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
diff --git a/tests/e2e/__snapshots__/15_reactmemoref.ts.snap b/tests/e2e/__snapshots__/15_reactmemoref.ts.snap
index 698f9458..01ff2233 100644
--- a/tests/e2e/__snapshots__/15_reactmemoref.ts.snap
+++ b/tests/e2e/__snapshots__/15_reactmemoref.ts.snap
@@ -2,7 +2,8 @@
 
 exports[`15_reactmemoref > should work with recorded events 1`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 4<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 4<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -10,7 +11,8 @@ exports[`15_reactmemoref > should work with recorded events 1`] = `
 
 exports[`15_reactmemoref > should work with recorded events 2`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 6<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -18,7 +20,8 @@ exports[`15_reactmemoref > should work with recorded events 2`] = `
 
 exports[`15_reactmemoref > should work with recorded events 3`] = `
 "
-    <div id="app"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 8<input type="checkbox"><span style="text-decoration: line-through;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -26,7 +29,8 @@ exports[`15_reactmemoref > should work with recorded events 3`] = `
 
 exports[`15_reactmemoref > should work with recorded events 4`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 10<input type="checkbox"><span style="text-decoration: line-through;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -34,7 +38,8 @@ exports[`15_reactmemoref > should work with recorded events 4`] = `
 
 exports[`15_reactmemoref > should work with recorded events 5`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 12<input type="checkbox"><span style="text-decoration: line-through;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "
@@ -42,7 +47,8 @@ exports[`15_reactmemoref > should work with recorded events 5`] = `
 
 exports[`15_reactmemoref > should work with recorded events 6`] = `
 "
-    <div id="app"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 18<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <div id="root"><ul><li>numRendered: 14<input type="checkbox"><span style="text-decoration: none;">Wash dishes</span></li><li>numRendered: 16<input type="checkbox"><span style="text-decoration: none;">Study JS</span></li><li>numRendered: 18<input type="checkbox"><span style="text-decoration: none;">Buy ticket</span></li></ul></div>
+    <script type="module" src="/src/main.tsx"></script>
   
 
 "