diff --git a/public/app/features/logs/components/panel/LogLine.test.tsx b/public/app/features/logs/components/panel/LogLine.test.tsx
index de1d119afae..415163d0aa6 100644
--- a/public/app/features/logs/components/panel/LogLine.test.tsx
+++ b/public/app/features/logs/components/panel/LogLine.test.tsx
@@ -321,6 +321,23 @@ describe.each(fontSizes)('LogLine', (fontSize: LogListFontSize) => {
expect(onOverflow).toHaveBeenCalledTimes(2);
});
+ test('When the collapsed state changes, the log line contents re-render', async () => {
+ log.collapsed = true;
+ log.raw = 'The full contents of the log line';
+
+ render(
+
+
+
+ );
+
+ expect(screen.queryByText(log.raw)).not.toBeInTheDocument();
+
+ await userEvent.click(await screen.findByText('show more'));
+
+ expect(screen.getByText(log.raw)).toBeInTheDocument();
+ });
+
test('Syncs the collapsed state with collapsed status changes in the log', async () => {
log.collapsed = true;
const { rerender } = render();
diff --git a/public/app/features/logs/components/panel/LogLine.tsx b/public/app/features/logs/components/panel/LogLine.tsx
index 0fe2865e6c1..699f77e0709 100644
--- a/public/app/features/logs/components/panel/LogLine.tsx
+++ b/public/app/features/logs/components/panel/LogLine.tsx
@@ -134,8 +134,8 @@ const LogLineComponent = memo(
const handleExpandCollapse = useCallback(() => {
const newState = !collapsed;
- setCollapsed(newState);
log.setCollapsedState(newState);
+ setCollapsed(newState);
onOverflow?.(index, log.uid);
}, [collapsed, index, log, onOverflow]);
@@ -208,6 +208,7 @@ const LogLineComponent = memo(
onClick={handleClick}
>