diff --git a/e2e/core/card-view/card-view-component.e2e.ts b/e2e/core/card-view/card-view-component.e2e.ts
index 1ee6ddde26..c26ffaaa25 100644
--- a/e2e/core/card-view/card-view-component.e2e.ts
+++ b/e2e/core/card-view/card-view-component.e2e.ts
@@ -81,6 +81,15 @@ describe('CardView Component', () => {
             await expect(await cardViewPageComponent.getOutputText(0))
                 .toBe('[CardView Select Item] - two');
         });
+
+        it('[C312448] Should be able to enable None option', async () => {
+            await cardViewPageComponent.enableNoneOption();
+            await cardViewPageComponent.clickSelectBox();
+            await cardViewPageComponent.selectValueFromComboBox(0);
+
+            await expect(cardViewPageComponent.getOutputText(0))
+                .toBe('[CardView Select Item] - null');
+        });
     });
 
     describe('Text', () => {
@@ -261,6 +270,18 @@ describe('CardView Component', () => {
             await expect(await metadataViewPage.getPropertyText('datetime', 'datetime')).toEqual('Dec 24, 1983, 10:00');
         });
 
+        it('[C312447] Should be able to clear the date field', async () => {
+            await cardViewPageComponent.enableClearDate();
+            await cardViewPageComponent.clearDateField();
+            await expect(await cardViewPageComponent.getDateValue()).toBe('', 'Date field should be cleared');
+            await expect(cardViewPageComponent.getOutputText(0))
+                .toBe('[CardView Date Item] - null');
+            await cardViewPageComponent.clearDateTimeField();
+            await expect(await cardViewPageComponent.getDateTimeValue()).toBe('', 'DateTime field should be cleared');
+            await expect(cardViewPageComponent.getOutputText(1))
+                .toBe('[CardView Datetime Item] - null');
+        });
+
     });
 
     it('[C279936] Should not be possible edit any parameter when editable property is false', async () => {
diff --git a/e2e/pages/adf/cardViewComponentPage.ts b/e2e/pages/adf/cardViewComponentPage.ts
index 0a757f8d0a..8b0f3750da 100644
--- a/e2e/pages/adf/cardViewComponentPage.ts
+++ b/e2e/pages/adf/cardViewComponentPage.ts
@@ -34,6 +34,8 @@ export class CardViewComponentPage {
     resetButton: ElementFinder = element(by.css(`#adf-reset-card-log`));
     listContent: ElementFinder = element(by.css('.mat-select-panel'));
     editableSwitch: ElementFinder = element(by.id('adf-toggle-editable'));
+    clearDateSwitch: ElementFinder = element(by.id('adf-toggle-clear-date'));
+    noneOptionSwitch: ElementFinder = element(by.id('adf-toggle-none-option'));
 
     async clickOnAddButton(): Promise<void> {
         await BrowserActions.click(this.addButton);
@@ -174,4 +176,46 @@ export class CardViewComponentPage {
         }
     }
 
+    async getDateValue(): Promise<string> {
+        const dateValue = element(by.css('span[data-automation-id="card-date-value-date"]'));
+        return dateValue.getText();
+    }
+
+    async getDateTimeValue(): Promise<string> {
+        const dateTimeValue = element(by.css('span[data-automation-id="card-datetime-value-datetime"]'));
+        return dateTimeValue.getText();
+    }
+
+    async clearDateField(): Promise<void> {
+        const clearDateButton = element(by.css('mat-icon[data-automation-id="datepicker-date-clear-date"]'));
+        await BrowserActions.click(clearDateButton);
+    }
+
+    async clearDateTimeField(): Promise<void> {
+        const clearDateButton = element(by.css('mat-icon[data-automation-id="datepicker-date-clear-datetime"]'));
+        await BrowserActions.click(clearDateButton);
+    }
+
+    async enableClearDate(): Promise<void> {
+        await BrowserVisibility.waitUntilElementIsVisible(this.clearDateSwitch);
+
+        const switchClass = await this.clearDateSwitch.getAttribute('class');
+        if (switchClass.indexOf('mat-checked') === -1) {
+            await this.clearDateSwitch.click();
+            const clearDateChecked = element(by.css('mat-slide-toggle[id="adf-toggle-clear-date"][class*="mat-checked"]'));
+            await BrowserVisibility.waitUntilElementIsVisible(clearDateChecked);
+        }
+    }
+
+    async enableNoneOption(): Promise<void> {
+        await BrowserVisibility.waitUntilElementIsVisible(this.noneOptionSwitch);
+
+        const switchClass = await this.noneOptionSwitch.getAttribute('class');
+        if (switchClass.indexOf('mat-checked') === -1) {
+            await this.noneOptionSwitch.click();
+            const noneOptionChecked = element(by.css('mat-slide-toggle[id="adf-toggle-none-option"][class*="mat-checked"]'));
+            await BrowserVisibility.waitUntilElementIsVisible(noneOptionChecked);
+        }
+    }
+
 }