From fe238414ca9a620c91642fe09b594f0dee2f9e04 Mon Sep 17 00:00:00 2001
From: Jovi De Croock <decroockjovi@gmail.com>
Date: Sun, 31 Dec 2023 07:31:27 +0100
Subject: [PATCH] retain masks across useId invocations

---
 hooks/src/index.js               |  9 +++++++++
 hooks/test/browser/useId.test.js | 23 +++++++++++++++++++++++
 2 files changed, 32 insertions(+)

diff --git a/hooks/src/index.js b/hooks/src/index.js
index eadbd86c20..92eb1e113b 100644
--- a/hooks/src/index.js
+++ b/hooks/src/index.js
@@ -25,6 +25,7 @@ let oldBeforeRender = options._render;
 let oldAfterDiff = options.diffed;
 let oldCommit = options._commit;
 let oldBeforeUnmount = options.unmount;
+let oldRoot = options._root;
 
 const RAF_TIMEOUT = 100;
 let prevRaf;
@@ -35,6 +36,14 @@ options._diff = vnode => {
 	if (oldBeforeDiff) oldBeforeDiff(vnode);
 };
 
+options._root = (vnode, parentDom) => {
+	if (parentDom._children && parentDom._children._mask) {
+		vnode._mask = parentDom._children._mask;
+	}
+
+	if (oldRoot) oldRoot(vnode, parentDom);
+};
+
 /** @type {(vnode: import('./internal').VNode) => void} */
 options._render = vnode => {
 	if (oldBeforeRender) oldBeforeRender(vnode);
diff --git a/hooks/test/browser/useId.test.js b/hooks/test/browser/useId.test.js
index e7fc7f947b..fe2546fd1a 100644
--- a/hooks/test/browser/useId.test.js
+++ b/hooks/test/browser/useId.test.js
@@ -433,4 +433,27 @@ describe('useId', () => {
 		rerender();
 		expect(first).not.to.equal(scratch.innerHTML);
 	});
+
+	it('should return a unique id across invocations of render', () => {
+		const Id = () => {
+			const id = useId();
+			return <div>My id is {id}</div>;
+		};
+
+		const App = props => {
+			return (
+				<div>
+					<Id />
+					{props.secondId ? <Id /> : null}
+				</div>
+			);
+		};
+
+		render(createElement(App, { secondId: false }), scratch);
+		expect(scratch.innerHTML).to.equal('<div><div>My id is P0-0</div></div>');
+		render(createElement(App, { secondId: true }), scratch);
+		expect(scratch.innerHTML).to.equal(
+			'<div><div>My id is P0-0</div><div>My id is P0-1</div></div>'
+		);
+	});
 });