Hacktoberfest 2026：维护者为十月标记出来的 issue，仍然开放、适合新手。 浏览 Hacktoberfest issue

Intial props not working when rendering a hook (or I've done something wrong.)

未关闭
  • 哪里不对？
#1,277 5 条评论 2 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
3/5
预计耗时
1-2 天
新手友好度
45/100
Issue 类型
缺陷
描述清晰度
基本清楚
活跃度
停滞
技术栈
react, typescript
领域
testing

调研方向

先从所提供复现中的 renderHook 调用和 wrapper 开始，然后检查 initialProps 是如何传递给 wrapper 的。重新运行 custom-step 测试，并确认 wrapper 初始接收到 step 2，在 rerender 后接收到 step 8，且 count 断言通过。

由索引模型根据 Issue 内容生成。

描述

BREAKING CHANGE enhancement 
    "@testing-library/dom": "^8.13.0",
    "@testing-library/jest-dom": "^6.1.3",
    "@testing-library/react": "13.3.0",
    "@testing-library/react-hooks": "^8.0.1",
    "@testing-library/user-event": "^14.4.3",
     "react": "^18.2.0",
    "react-dom": "^18.2.0",   
    "react-test-renderer: 18.1.0)"
    "`node` version: 18"
    "`pnpm` (or `yarn`) version: 7"
Relevant code or config:

In the Reproduction details.
Taking the example from the docs, logged the initial props;

const CounterStepContext = createContext(1);

export const CounterStepProvider = ({
  step,
  children,
}: {
  step: number;
  children: React.ReactNode;
}) => {
  console.log({ step });
  return (
    <CounterStepContext.Provider value={step}>
      {children}
    </CounterStepContext.Provider>
  );
};

export function useCounter(initialValue = 0) {
  const [count, setCount] = useState(initialValue);
  const step = useContext(CounterStepContext);
  const increment = useCallback(() => setCount((x) => x + step), [step]);
  const reset = useCallback(() => setCount(initialValue), [initialValue]);
  return { count, increment, reset };
}

test("should use custom step when incrementing", () => {
  const wrapper = ({
    children,
    step,
  }: {
    step: number;
    children: React.ReactNode;
  }) => <CounterStepProvider step={step}>{children}</CounterStepProvider>;
  const { result, rerender } = renderHook(() => useCounter(), {
    wrapper,
    initialProps: {
      step: 2,
    },
  });

  act(() => {
    result.current.increment();
  });

  expect(result.current.count).toBe(2);

  /**
   * Change the step value
   */
  rerender({ step: 8 });

  act(() => {
    result.current.increment();
  });

  expect(result.current.count).toBe(10);
});

  console.log
    { step: undefined }
What you did:

Trying to use initialProps with the renderHook

What happened:

Initial props are not being passed.
No obvious error message, component just isn't receiving the props.

Reproduction:
Problem description:
Suggested solution:
主要语言
JavaScript
星标
19.7k
派生
1.2k
30 天内没有已合并 PR

环境准备

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

testing-library/react-testing-library 的其他 Issue

查看 testing-library/react-testing-library 的全部 Issue

相似的 Issue

更多 JavaScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。