openclaw - ✅(Solved) Fix Control-UI: heartbeat poll wipes user input mid-composition [1 pull requests, 2 comments, 2 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
openclaw/openclaw#54379Fetched 2026-04-08 01:28:22
View on GitHub
Comments
2
Participants
2
Timeline
4
Reactions
0
Timeline (top)
commented ×2cross-referenced ×1referenced ×1

PR fix notes

PR #54592: fix(control-ui): chat bubbles should size to content, not full width

Description (problem / solution / changelog)

Problem

Chat bubbles in the control UI render at full width (width: 100%) regardless of message length. Short messages like "ok" or "yes" produce unnecessarily wide bubbles, creating visual inconsistency — especially compared to tool output bubbles which are also full-width.

Reported in #54379.

Changes

.chat-bubble

  • width: 100%width: fit-content — bubbles now size to their content
  • Removed redundant properties already handled by global/parent styles:
    • display: block — div default
    • box-shadow: none — div default
    • box-sizing: border-box — set globally on *
    • word-wrap: break-word — handled by .chat-text
  • Kept position: relative — required by .chat-bubble-actions (absolute positioned copy/expand buttons)

.chat-group.user .chat-group-messages

  • align-items: stretchalign-items: flex-end — user message bubbles align right within their container

Before / After

Before: All bubbles fill the full available width After: Bubbles dynamically size to content length, capped at max-width: 100%

Testing

  • Tested locally on Safari (macOS, control-UI)
  • Verified user messages, assistant messages, tool output, and multi-line content
  • Verified copy/expand button positioning still works (absolute positioning relative to bubble)
  • No DOM structure changes, no unrelated CSS modified

Changed files

  • ui/src/styles/chat/grouped.css (modified, +2/-6)
RAW_BUFFERClick to expand / collapse

Problem

When a heartbeat poll fires while the user is composing a message in control-UI, the incoming heartbeat message triggers a UI refresh that clears the users input field. The partially-composed message is lost with no recovery.

Steps to Reproduce

  1. Open control-UI webchat
  2. Start typing a message (do not send it)
  3. Wait for a heartbeat poll to fire (e.g., every 90 minutes)
  4. The input field is wiped

Impact

  • User loses work mid-composition
  • Happens unpredictably during automated polling
  • Particularly frustrating during longer conversations or when drafting detailed messages

Expected Behavior

The input field should be preserved across incoming messages, heartbeats, and UI refreshes. User input should never be silently discarded by background events.

Related

  • Similar class of issue to batch-work UI glitches — control-UI does not handle mid-input session updates gracefully.

extent analysis

Fix Plan

To prevent the input field from being cleared during a heartbeat poll, we need to implement a mechanism to preserve the user's input.

  • Debounce the UI refresh: Debounce the UI refresh to prevent it from triggering when the user is typing.
  • Use a temporary storage: Store the user's input in a temporary storage, such as localStorage or a variable, before the UI refreshes.
  • Restore the input: Restore the user's input after the UI refreshes.

Example Code

// Debounce function
function debounce(func, wait) {
  let timeout;
  return function() {
    const context = this;
    const args = arguments;
    clearTimeout(timeout);
    timeout = setTimeout(() => {
      func.apply(context, args);
    }, wait);
  };
}

// Store input in localStorage before UI refresh
const inputField = document.getElementById('input-field');
inputField.addEventListener('input', () => {
  localStorage.setItem('userInput', inputField.value);
});

// Restore input after UI refresh
window.addEventListener('load', () => {
  const storedInput = localStorage.getItem('userInput');
  if (storedInput) {
    inputField.value = storedInput;
    localStorage.removeItem('userInput');
  }
});

// Debounce UI refresh
const refreshUI = debounce(() => {
  // UI refresh code here
}, 500); // adjust the wait time as needed

Verification

To verify that the fix worked, follow these steps:

  • Open the control-UI webchat and start typing a message.
  • Wait for a heartbeat poll to fire.
  • Check if the input field still contains the user's input.

Extra Tips

  • Make sure to adjust the debounce wait time according to your application's needs.
  • Consider using a more robust storage solution, such as a state management library, for more complex applications.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING

openclaw - ✅(Solved) Fix Control-UI: heartbeat poll wipes user input mid-composition [1 pull requests, 2 comments, 2 participants]