diff --git a/src/services/__tests__/panelService.test.ts b/src/services/__tests__/panelService.test.ts
index 5d38d06ce..c642933e1 100644
--- a/src/services/__tests__/panelService.test.ts
+++ b/src/services/__tests__/panelService.test.ts
@@ -165,10 +165,13 @@ describe('The PanelService test', () => {
 
     test("Should support to open a panel that doesn't exist", () => {
         const state = panelService.getState();
+        const newPanel = Object.assign({}, paneOutput, { id: 'test' });
         expect(state.current).toBeNull();
+        expect(panelService.getPanel(newPanel.id)).toBeUndefined();
 
-        panelService.open(paneOutput);
-        expect(state.current).toEqual(paneOutput);
+        panelService.open(newPanel);
+        expect(state.current).toEqual(newPanel);
+        expect(panelService.getPanel(newPanel.id)).not.toBeUndefined();
     });
 
     test('Should support to toggle maximize status', () => {
diff --git a/src/services/workbench/panelService.ts b/src/services/workbench/panelService.ts
index 99dee8605..bfdbb7b6c 100644
--- a/src/services/workbench/panelService.ts
+++ b/src/services/workbench/panelService.ts
@@ -163,9 +163,14 @@ export class PanelService extends Component<IPanel> implements IPanelService {
 
     public open(data: IPanelItem<any>): void {
         const { data: stateData = [] } = this.state;
-        const cloneData = cloneDeep(data);
-        const index = stateData.findIndex(searchById(cloneData.id));
-        const current = index === -1 ? cloneData : stateData[index];
+        let current = cloneDeep(data);
+        const index = stateData.findIndex(searchById(current.id));
+        if (index > -1) {
+            current = stateData[index];
+        } else {
+            // Add the new panel item
+            this.add(current);
+        }
 
         this.setState({
             current,