diff --git a/src/components/rule-builder/rule-header.test.tsx b/src/components/rule-builder/rule-header.test.tsx
index 2d13db75..f00fed27 100644
--- a/src/components/rule-builder/rule-header.test.tsx
+++ b/src/components/rule-builder/rule-header.test.tsx
@@ -7,6 +7,7 @@ import { RuleHeader } from './rule-builder.component';
 const handleRequiredChange = jest.fn();
 const handleAllowFutureDateChange = jest.fn();
 const handleDisallowDecimalValueChange = jest.fn();
+const handleHistoryChange = jest.fn();
 
 const ruleId = 'a0776e98-86d8-460f-a2c4-26dc97e6fc8a';
 
@@ -19,25 +20,31 @@ describe('RuleHeader', () => {
 
   it('should render the allow future date toggle button', () => {
     renderRuleHeader(true);
-    const dateToggleButton = screen.getByLabelText(/Toggle Allow Future Dates/i, { selector: `#toggle-allow-future-date-${ruleId}`});
+    const dateToggleButton = screen.getByLabelText(/Toggle Allow Future Dates/i, {
+      selector: `#toggle-allow-future-date-${ruleId}`,
+    });
     expect(dateToggleButton).toBeInTheDocument();
   });
 
   it('should render the disallow decimal value toggle button', () => {
     renderRuleHeader(false);
-    const disAllowDecimalToggleButton = screen.getByLabelText(/Toggle Disallow Decimal Value/i, { selector: `#toggle-disallow-decimal-value-${ruleId}`})
+    const disAllowDecimalToggleButton = screen.getByLabelText(/Toggle Disallow Decimal Value/i, {
+      selector: `#toggle-disallow-decimal-value-${ruleId}`,
+    });
     expect(disAllowDecimalToggleButton).toBeInTheDocument();
   });
 
   it('should not render the allow future date toggle button', () => {
     renderRuleHeader(false);
-    const dateToggleButton = screen.queryByLabelText(/Toggle Allow Future Dates/i, { selector: `#toggle-allow-future-date-${ruleId}`});
+    const dateToggleButton = screen.queryByLabelText(/Toggle Allow Future Dates/i, {
+      selector: `#toggle-allow-future-date-${ruleId}`,
+    });
     expect(dateToggleButton).not.toBeInTheDocument();
   });
 
   it('should verify that the required toggle button is clicked', async () => {
     renderRuleHeader(false);
-    const requiredToggle = screen.getByLabelText(/Toggle Required/i, { selector: `#toggle-required-${ruleId}`});
+    const requiredToggle = screen.getByLabelText(/Toggle Required/i, { selector: `#toggle-required-${ruleId}` });
     const user = userEvent.setup();
     await user.click(requiredToggle);
     expect(handleRequiredChange).toHaveBeenCalledTimes(1);
@@ -45,7 +52,9 @@ describe('RuleHeader', () => {
 
   it('should verify that the allow future toggle button is clicked', async () => {
     renderRuleHeader(true);
-    const dateToggleButton = screen.getByLabelText(/Toggle Allow Future Dates/i, { selector: `#toggle-allow-future-date-${ruleId}`});
+    const dateToggleButton = screen.getByLabelText(/Toggle Allow Future Dates/i, {
+      selector: `#toggle-allow-future-date-${ruleId}`,
+    });
     const user = userEvent.setup();
     await user.click(dateToggleButton);
     expect(handleAllowFutureDateChange).toHaveBeenCalledTimes(1);
@@ -53,7 +62,9 @@ describe('RuleHeader', () => {
 
   it('should verify that the disallow decimal value toggle button is clicked', async () => {
     renderRuleHeader(false);
-    const disAllowDecimalToggleButton = screen.getByLabelText(/Toggle Disallow Decimal Value/i, { selector: `#toggle-disallow-decimal-value-${ruleId}`})
+    const disAllowDecimalToggleButton = screen.getByLabelText(/Toggle Disallow Decimal Value/i, {
+      selector: `#toggle-disallow-decimal-value-${ruleId}`,
+    });
     expect(disAllowDecimalToggleButton).toBeInTheDocument();
     const user = userEvent.setup();
     await user.click(disAllowDecimalToggleButton);
@@ -65,7 +76,9 @@ describe('RuleHeader', () => {
     [false, 'off'],
   ])('should confirm that the required toggle button is in the %s state', (required, state) => {
     renderRuleHeader(true, required);
-    const isRequiredToggleButton = screen.getByLabelText(/Toggle Required/i, { selector: `#toggle-required-${ruleId}`})
+    const isRequiredToggleButton = screen.getByLabelText(/Toggle Required/i, {
+      selector: `#toggle-required-${ruleId}`,
+    });
     expect(isRequiredToggleButton).toBeInTheDocument();
     if (state === 'on') {
       // eslint-disable-next-line playwright/missing-playwright-await
@@ -75,6 +88,17 @@ describe('RuleHeader', () => {
       expect(isRequiredToggleButton).not.toBeChecked();
     }
   });
+
+  it('should verify that the history toggle is clicked', async () => {
+    renderRuleHeader(false);
+    const user = userEvent.setup();
+    const disAllowDecimalToggleButton = screen.getByLabelText(/Enable History/i, {
+      selector: `#toggle-enable-historical-expression-${ruleId}`,
+    });
+    expect(disAllowDecimalToggleButton).toBeInTheDocument();
+    await user.click(disAllowDecimalToggleButton);
+    expect(handleDisallowDecimalValueChange).toHaveBeenCalledTimes(1);
+  });
 });
 
 function renderRuleHeader(
@@ -82,6 +106,7 @@ function renderRuleHeader(
   isRequired?: boolean,
   isAllowFutureDate?: boolean,
   isDisallowDecimals?: boolean,
+  isHistoryEnable?: boolean,
 ) {
   render(
     <RuleHeader
@@ -90,6 +115,8 @@ function renderRuleHeader(
       isRequired={isRequired ? true : false}
       isAllowFutureDate={isAllowFutureDate ? true : false}
       isDisallowDecimals={isDisallowDecimals ? true : false}
+      isHistoryEnable={isHistoryEnable ? true : false}
+      handleHistoryChange={handleHistoryChange}
       handleRequiredChange={handleRequiredChange}
       handleAllowFutureDateChange={handleAllowFutureDateChange}
       handleDisallowDecimalValueChange={handleDisallowDecimalValueChange}