问题标签 [storybook]

使用 MockedProvider 呈现最终状态的推荐方法是使用 'waait' 等待事件循环的下一个滴答声。

但是，当使用 storybook storyshots 插件时，您无法访问测试主体以在创建树的那一刻和您对其进行快照的那一刻之间注入等待。

因此，当拍摄快照时，加载状态就是您在那里看到的。

那么，如何让“等待”发生以便看到最终状态呢？

我正在尝试使用门户呈现模式，它在我的应用程序以及 Storybook 中都可以正常工作，但是一旦将其添加到 Storyshots 中，我就会遇到问题。

第一个问题是模拟 ReactDOM 的 createPortal API。我是这样做的：

ReactDOM.createPortal = element => element;

如果不添加，我会收到以下错误：

错误：未捕获 [TypeError：parentInstance.children.indexOf 不是函数]

我找到了这个解决方案React Portal Error。

这解决了这个问题，但是当组件使用门户时，它会在尝试附加子项时失败。它没有找到“modal-root”组件，因此无法附加元素。我不知道如何克服这一点。

我的门户看起来与 React 网站上的示例几乎相同：

它现在失败并出现此错误：

错误：未捕获 [TypeError：无法读取属性 'appendChild' of null]

上面代码片段中指示的位置。

我有一个故事Button.jsx

当我运行我的故事书时，addon-info我得到了这个而不是我的真正代码

有没有办法自己设置Story Source？

尝试storybook使用Webpack@4.17.2and启动时出现此错误mini-css-extract-plugin。我正在使用mini-css-extract-plugin而不是extract-text-webpack-plugin因为它不支持Webpack > 4.x.x

任何想法如何在不降级到 webpack < 4.xx 错误的情况下解决此问题：

包json内容：

Storybook webpack.config 内容：

Storybook文档提到了测试，但只记录了 React。如何为 Vue 项目设置集成（特别是交互）测试？

我正在使用 Storybook 并尝试使用 typescript 加载它，我已经按照本教程进行操作，并从create-react-app开始并在项目中运行getstorybook。我很困惑为什么故事书不知道我在创建反应应用程序中的 webpack 设置。

当我尝试在我的 Angular 6 应用程序上运行Storybook时，我收到以下错误消息...

错误

包.json

回购链接： https ://bitbucket.org/ross2711/storybook-ng-app/src

我目前正在关注这个：https ://storybook.js.org/basics/writing-stories/

我创建了一个示例组件按钮：

但是，我不确定 Storybook 的幕后情况是什么，最终会在左侧导航区域中创建故事，但在我的构建中呈现的故事示例实际上是我的默认 Hello 按钮。

我已经用 Gatsby.js（使用 React 的静态网站生成器）建立了一个网站，并正在尝试向其中添加故事书。

我在故事书中添加了一个自定义 webpack 配置（按照https://storybook.js.org/configurations/custom-webpack-config/中的说明）来加载 sass 和 sass-resources，但无法使其工作。

以下是配置。除了最初的那些之外，我已经为“storybook/react”安装了所有的“style-loader”、“css-loader”、“sass-loader”、“sass-resources-loader”以及“node-sass”添加到“gatsby”和“gatsby-plugin-sass”作为依赖项。

如果有人好心建议，那就太好了。非常感谢您提前提供的帮助。

结构体

webpack.config.js (root/.storybook/webpack.config.js)

component_1.stories.js

错误消息（显示在故事书应用程序上）

在这种情况下，sass 变量“$color-primary”在“src/styles/_variables.scss”中定义。我想用它来设置故事书应用程序中显示的 Component_1 的样式。

我尝试将“_variables.scss”明确导入“Component_1.stories.js”并再次失败（跳过“sass-resources-loader”，只使用“sass-loader”）。

谢谢你的建议。

[编辑]

除了上面，我的故事书配置文件如下。

config.js (根/.storybook/config.js)

我一直在尝试让 Storybook 3.4.4 与 react 0.57 一起工作。我最近从 0.55.4 升级，一切似乎都很好。

我还使用 babel-upgrade 工具升级到了 babel 7。

现在，当我尝试运行我的故事书时...

storybook start -p 7007

react-native run-android

我收到以下错误...

谁能帮帮我？