(rocketmq-dashboard) branch rocketmq-studio updated: fix: correct LiteTopic session POP progress (#583)

[lizhimin]

This is an automated email from the ASF dual-hosted git repository.

lizhimins pushed a commit to branch rocketmq-studio
in repository https://gitbox.apache.org/repos/asf/rocketmq-dashboard.git


The following commit(s) were added to refs/heads/rocketmq-studio by this push:
     new 5698c464 fix: correct LiteTopic session POP progress (#583)
5698c464 is described below

commit 5698c464da1f4b0d71c75e83717f2e5e07306a05
Author: yx9o <yangx_s...@163.com>
AuthorDate: Tue Jul 28 20:51:00 2026 +0800

    fix: correct LiteTopic session POP progress (#583)
---
 web/src/pages/studio/LiteTopic.tsx                |  2 +-
 web/src/pages/studio/__tests__/LiteTopic.test.tsx | 89 +++++++++++++++++++++++
 2 files changed, 90 insertions(+), 1 deletion(-)

diff --git a/web/src/pages/studio/LiteTopic.tsx 
b/web/src/pages/studio/LiteTopic.tsx
index 57fa5c64..001760de 100644
--- a/web/src/pages/studio/LiteTopic.tsx
+++ b/web/src/pages/studio/LiteTopic.tsx
@@ -562,7 +562,7 @@ const LiteTopicPage: React.FC = () => {
           <div style={{ marginTop: 16 }}>
             <div style={{ marginBottom: 8, fontWeight: 500 
}}>{t('liteTopic.popProgress')}</div>
             <Progress
-              percent={Math.round(sessionData.popProgress * 100)}
+              percent={Math.round(sessionData.popProgress)}
               status="active"
               strokeColor="#722ed1"
             />
diff --git a/web/src/pages/studio/__tests__/LiteTopic.test.tsx 
b/web/src/pages/studio/__tests__/LiteTopic.test.tsx
new file mode 100644
index 00000000..059a29db
--- /dev/null
+++ b/web/src/pages/studio/__tests__/LiteTopic.test.tsx
@@ -0,0 +1,89 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
+import { render, screen, within } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { App } from 'antd';
+import { LangProvider } from '../../../i18n/LangContext';
+import LiteTopic from '../LiteTopic';
+
+const apiMocks = vi.hoisted(() => ({
+  queryLiteTopicCapability: vi.fn(),
+  queryLiteTopicQuota: vi.fn(),
+  queryLiteTopicList: vi.fn(),
+  queryLiteTopicSession: vi.fn(),
+  extendLiteTopicTTL: vi.fn(),
+}));
+
+vi.mock('../../../api/liteTopic', () => apiMocks);
+
+beforeAll(() => {
+  Object.defineProperty(window, 'matchMedia', {
+    writable: true,
+    value: vi.fn().mockImplementation((query: string) => ({
+      matches: false,
+      media: query,
+      onchange: null,
+      addListener: vi.fn(),
+      removeListener: vi.fn(),
+      addEventListener: vi.fn(),
+      removeEventListener: vi.fn(),
+      dispatchEvent: vi.fn(),
+    })),
+  });
+});
+
+const renderPage = () =>
+  render(
+    <App>
+      <LangProvider>
+        <LiteTopic />
+      </LangProvider>
+    </App>,
+  );
+
+describe('LiteTopic Page', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    apiMocks.queryLiteTopicCapability.mockResolvedValue({ supported: true });
+    apiMocks.queryLiteTopicQuota.mockResolvedValue(null);
+    apiMocks.queryLiteTopicList.mockResolvedValue([
+      {
+        topicPattern: 'order-*',
+        sessionIds: ['session-1'],
+      },
+    ]);
+    apiMocks.queryLiteTopicSession.mockResolvedValue({
+      sessionId: 'session-1',
+      totalMessages: 100,
+      consumedMessages: 0,
+      popProgress: 96,
+    });
+  });
+
+  it('displays the session POP progress returned by the API as a percentage', 
async () => {
+    const user = userEvent.setup();
+    renderPage();
+
+    await user.click(await screen.findByText('查看会话'));
+
+    expect(apiMocks.queryLiteTopicSession).toHaveBeenCalledWith('session-1');
+    const popProgressLabel = await screen.findByText('Pop 进度');
+    
expect(within(popProgressLabel.parentElement!).getByText('96%')).toBeInTheDocument();
+  });
+});