
ALT strategy: write a unit test If your program already has tests, adding a failing test can be a great way to work on your bug! person (thinking): "this function should return X, but it's returning Y" * it forces you to pinpoint what exactly the bug is * it's easy to tell when you've fixed it (the test passes!) * you can keep the test to make sure the bug doesn't come back

ALT import { Children, ReactNode } from "react"; import flattenNodes from "react-keyed-flatten-children"; interface ChildProps { color: "blue" | "red"; } interface PrivateChildProps extends ChildProps { index: number; } const Child = (_props: ChildProps) => { throw new Error("Child must be in Parent"); }; const PrivateChild = ({ color, index }: PrivateChildProps) => ( <li style={{ color }}>{index === 0 ? "First child" : "Not first child"}</li> ); const Parent = ({ children }: { children: ReactNode }) => ( <ul> {Children.map(flattenNodes(children), (child, index) => { if (typeof child === "object" && child.type === Child) { return <PrivateChild {...(child.props as ChildProps)} index={index} />; } })} </ul> ); export const App = () => ( <Parent> <Child color="red" /> <Child color="blue" /> <Child color="red" /> <Child color="blue" /> </Parent> );



















