diff --git a/vscode/webviews/components/CollapsiblePanel.tsx b/vscode/webviews/components/CollapsiblePanel.tsx
index 40695074aab7..240398388872 100644
--- a/vscode/webviews/components/CollapsiblePanel.tsx
+++ b/vscode/webviews/components/CollapsiblePanel.tsx
@@ -12,9 +12,11 @@ interface CollapsiblePanelProps {
     className?: string
     contentClassName?: string
     initialOpen?: boolean
+    id?: string
 }
 
 export const CollapsiblePanel: React.FC<CollapsiblePanelProps> = ({
+    id,
     storageKey,
     title,
     children,
@@ -28,6 +30,7 @@ export const CollapsiblePanel: React.FC<CollapsiblePanelProps> = ({
 
     return (
         <Collapsible
+            id={id}
             open={isOpen}
             onOpenChange={setIsOpen}
             className={clsx('tw-w-full tw-flex tw-flex-col tw-gap-3', className)}
@@ -46,6 +49,7 @@ export const CollapsiblePanel: React.FC<CollapsiblePanelProps> = ({
             </div>
             <CollapsibleContent>
                 <div
+                    id={`${id}-content`}
                     className={clsx(
                         'tw-px-2 tw-py-2 tw-flex tw-flex-col tw-bg-popover tw-border tw-border-border tw-rounded-lg',
                         contentClassName
diff --git a/vscode/webviews/tabs/HistoryTab.tsx b/vscode/webviews/tabs/HistoryTab.tsx
index b1c539761579..3cf6e959531d 100644
--- a/vscode/webviews/tabs/HistoryTab.tsx
+++ b/vscode/webviews/tabs/HistoryTab.tsx
@@ -65,6 +65,7 @@ export const HistoryTab: React.FC<HistoryTabProps> = ({
         <div className="tw-px-8 tw-pt-6 tw-pb-12 tw-flex tw-flex-col tw-gap-10">
             {chats.map(([period, chats]) => (
                 <CollapsiblePanel
+                    id={`history-${period}`.replaceAll(' ', '-').toLowerCase()}
                     key={period}
                     storageKey={`history.${period}`}
                     title={period}