Log in collapsible sections cause content to not render
还没有人认领这个 Issue。
评估
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 新手友好度
- 35/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 停滞
- 技术栈
- react, typescript
- 领域
- frontend
调研方向
Start with the LogViewer and ExpandableSection interaction, then reproduce the failure using the linked CodeSandbox, especially with a ref and with the section initially hidden. Investigate why content does not render on the first hidden render; done means LogViewer content renders correctly when the section is opened, with and without a ref.
由索引模型根据 Issue 内容生成。
描述
When using the LogViewer within an ExpandableSection component it might not render correctly. Assigning a ref to the LogViewer makes it happen even more often.
Here is a sandbox setup with a ref that showcases that issue
https://codesandbox.io/s/focused-hooks-m95046?file=/index.tsx
Here is a video of it happening for me in Storybook using ref
Here is a picture of it happening with two nested Cards and one ExpandableSection, without ref
Comment from Juntao Wang from PatternFly Slack
Hi, this is definitely a bug in the react-log-viewer, could you please create an issue in https://github.com/patternfly/react-log-viewer/issues? it’s a little bit tricky because the styles are setting everywhere and seems there are some render problems when using the log viewer with the expandable sections. it will not render correctly when the section is hidden for the first time.
The current workaround is creating a custom component that wraps the LogViewer and setting the ref there, and use React.memo on the whole component. Finally, set that component as the child in the ExpandableSection . However, in this situation, you may need to set the initial state of the isExpanded to true to make the initial render correctly.
I will be on PTO starting tomorrow for ~10 days so I might not have time to do a deeper investigation into this issue but I will check it again after I am back to see if I could find anything. Could you also take a look on this issue when you are available
Jira Issue: PF-2011
- 主要语言
- TypeScript
- 星标
- 34
- 派生
- 19
- PR 合并指标
- 30 天内没有已合并 PR
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 没有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
patternfly/react-log-viewer 的其他 Issue
-
Search within Log viewer can cause the parent container to shift and break the layout, when embedded in a scrollable parent可能已有人在做 @fao89 于 132 天前认领。 未关闭
难度 3/5 1-2 天 新手友好度 67/100
patternfly/react-log-viewer#106 ·
-
难度 3/5 1-2 天 新手友好度 45/100
patternfly/react-log-viewer#101 ·
-
难度 3/5 1-2 天 新手友好度 25/100
patternfly/react-log-viewer#98 · 1 条评论 ·
-
难度 3/5 1-2 天 新手友好度 25/100
patternfly/react-log-viewer#95 · 2 条评论 ·
-
难度 3/5 1-2 天 新手友好度 35/100
patternfly/react-log-viewer#91 · 1 条评论 ·
查看 patternfly/react-log-viewer 的全部 Issue
相似的 Issue
-
DB-plane provider_chat_options.* is accepted by config set but never merged into the loaded config未关闭
难度 2/5 1-3 小时 新手友好度 78/100
维护者通常 1 天内回复
-
Bump Firebase JS SDK (12.19.0 → 13.0.0)可能已有人在做 @SelaseKay 今天认领。 未关闭Needs Attention type: enhancement
难度 2/5 1-3 小时 新手友好度 75/100
invertase/react-native-firebase#9364 · 1 条评论 ·
维护者通常 1 天内回复
-
enhancement
难度 1/5 1 小时以内 新手友好度 85/100
cloudflare/mcp#271 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 82/100
维护者通常 4 天内回复
-
e2e-failure ready-to-code
难度 2/5 1-3 小时 新手友好度 78/100
redhat-developer/rhdh-plugin-export-overlays#4261 · 1 条评论 ·
维护者通常 1 天内回复