为了解决在使用自动文档页面上的mount-in-play功能的故事中出现不一致行为的问题，请按照以下步骤操作：

• 更新 StoryRender.ts:

  • 修改 render 方法以确保带有mount-in-play功能的故事不会被过滤掉。
  • 确保为这些故事设置了 autoplay 选项为 true。

// In StoryRender.ts
async render({
  initial = false,
  forceRemount = false,
}: {
  initial?: boolean;
  forceRemount?: boolean;
} = {}) {
  // Existing code...

  // Ensure autoplay is true for stories with mount-in-play functions
  if (this.story?.usesMount) {
    this.renderOptions.autoplay = true;
  }

  // Existing code...
}

• 更新 StoryRender.test.ts:

  • 为自动文档页面上带有mount-in-play功能的故事添加测试，以确保它们能够正确渲染。

// In StoryRender.test.ts
it('renders stories with mount-in-play functions correctly', async () => {
  const story = buildStory({
    usesMount: true,
    playFunction: async ({ mount }) => {
      await mount();
    },
  });
  const render = new StoryRender(
    new Channel({}),
    buildStore(),
    vi.fn() as any,
    {} as any,
    entry.id,
    'story',
    { autoplay: true },
    story
  );

  await render.renderToElement({} as any);
  expect(mountSpy).toHaveBeenCalledOnce();
});

这些更改确保了带有mount-in-play功能的故事不会被过滤掉，并且在自动文档页面上能够正确渲染。

参考文献

/code/e2e-tests/addon-docs.spec.ts
/code/core/src/preview-api/modules/preview-web/render/StoryRender.test.ts
/code/core/src/preview-api/modules/preview-web/render/StoryRender.ts

关于Greptile

此响应为您提供了一个研究起点，而不是精确的解决方案。
帮助我们改进！如果这有帮助，请留下一个👍，如果它无关紧要，请留下一个👎。