Function Component

hooks/test/browser/useId.test.jsx:163–198

({ showStateful = false })

		};

		const Component = ({ showStateful = false }) => {
			const rootId = useId();
			const paragraphId = useId();

			return (
				<main>
					ID: {rootId}
					<p>Hello world id: {paragraphId}</p>
					{showStateful ? (
						<Stateful />
					) : (
						<ChildReturn>
							<SomeMessage msg="child-return" />
							<ChildReturn>
								<SomeMessage msg="child-return" />
								<ChildReturn>
									<SomeMessage msg="child-return" />
								</ChildReturn>
							</ChildReturn>
						</ChildReturn>
					)}
					<ChildFragmentReturn>
						<SomeMessage msg="child-fragment-return" />
						<SomeMessage msg="child-fragment-return-2" />
						<SomeMessage msg="child-fragment-return-3" />
						<SomeMessage msg="child-fragment-return-4" />
						<ChildReturn>
							<SomeMessage msg="child-return" />
							<ChildFragmentReturn>
								<SomeMessage msg="child-fragment-return" />
							</ChildFragmentReturn>
						</ChildReturn>
					</ChildFragmentReturn>
				</main>
			);
		};

		const rtsOutput = rts(<Component />);
		render(<Component />, scratch);