Looking at the blessed source, it appears that react-blessed isn't triggering the set content event when updating a log element reactively.
Failing example:
In this version, the log won't keep scroll pinned to the bottom, because the set content event is never fired.
export const Debugger: React.FC<Debugger> = ({ debugEntries, isFocused }) => {
return (
<log
label="Debugger"
top="75%"
width="100%"
height="25%"
scrollOnInput={true}
focusable={true}
keys={true}
class={styles}>
{debugEntries.join("\n")}
</log>
);
};Working example:
In this version, the log will keep scroll pinned to the bottom, because we are explicitly calling setContent when the underlying content changes.
export const Debugger: React.FC<DebuggerProps> = ({ debugEntries, isFocused }) => {
const ref = useRef<blessed.Widgets.Log>(null)
useEffect(() => {
if (ref.current) {
ref.current.setContent(debugEntries.join("\n"))
}
}, [debugEntries])
return (
<log
label="Debugger"
ref={ref}
top="75%"
width="100%"
height="25%"
scrollOnInput={true}
focusable={true}
keys={true}
class={styles} />
);
};
Looking at the blessed source, it appears that react-blessed isn't triggering the
set contentevent when updating a log element reactively.Failing example:
In this version, the log won't keep scroll pinned to the bottom, because the set content event is never fired.
Working example:
In this version, the log will keep scroll pinned to the bottom, because we are explicitly calling
setContentwhen the underlying content changes.