mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[AAE-2107] Move e2e to Unit test (#5535)
* [AAE-2107] Move e2e to Unit test * * fixed namings * * more unit test added * * minor changes
This commit is contained in:
@@ -23,17 +23,26 @@ import { CardViewDateItemModel } from '../../models/card-view-dateitem.model';
|
||||
import { CardViewUpdateService } from '../../services/card-view-update.service';
|
||||
import { CardViewDateItemComponent } from './card-view-dateitem.component';
|
||||
import { CoreTestingModule } from '../../../testing/core.testing.module';
|
||||
import { AppConfigService } from '@alfresco/adf-core';
|
||||
|
||||
describe('CardViewDateItemComponent', () => {
|
||||
|
||||
let fixture: ComponentFixture<CardViewDateItemComponent>;
|
||||
let component: CardViewDateItemComponent;
|
||||
let appConfigService: AppConfigService;
|
||||
|
||||
setupTestBed({
|
||||
imports: [CoreTestingModule]
|
||||
});
|
||||
|
||||
beforeEach(() => {
|
||||
appConfigService = TestBed.get(AppConfigService);
|
||||
appConfigService.config.dateValues = {
|
||||
defaultDateFormat: 'shortDate',
|
||||
defaultDateTimeFormat: 'M/d/yy, h:mm a',
|
||||
defaultLocale: 'uk'
|
||||
};
|
||||
|
||||
fixture = TestBed.createComponent(CardViewDateItemComponent);
|
||||
component = fixture.componentInstance;
|
||||
component.property = new CardViewDateItemModel({
|
||||
@@ -46,8 +55,10 @@ describe('CardViewDateItemComponent', () => {
|
||||
});
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
fixture.destroy();
|
||||
afterEach(() => fixture.destroy());
|
||||
|
||||
it('should pick date format from appConfigService', () => {
|
||||
expect(component.dateFormat).toEqual('shortDate');
|
||||
});
|
||||
|
||||
it('should render the label and value', () => {
|
||||
@@ -153,6 +164,7 @@ describe('CardViewDateItemComponent', () => {
|
||||
component.property.editable = true;
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(component.isEditable()).toBe(false);
|
||||
const datePicker = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-${component.property.key}"]`));
|
||||
const datePickerToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepickertoggle-${component.property.key}"]`));
|
||||
expect(datePicker).toBeNull('Datepicker should NOT be in DOM');
|
||||
@@ -206,101 +218,111 @@ describe('CardViewDateItemComponent', () => {
|
||||
);
|
||||
}));
|
||||
|
||||
it('should render the clear icon in case of displayClearAction:true', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear-${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).not.toBeNull('Clean Icon should be in DOM');
|
||||
});
|
||||
|
||||
it('should not render the clear icon in case of property value empty', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = null;
|
||||
fixture.detectChanges();
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear--${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM');
|
||||
});
|
||||
|
||||
it('should not render the clear icon in case of displayClearAction:false', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.displayClearAction = false;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear--${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM');
|
||||
});
|
||||
|
||||
it('should remove the property value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(
|
||||
() => {
|
||||
expect(component.property.value).toBeNull();
|
||||
}
|
||||
);
|
||||
}));
|
||||
|
||||
it('should remove the property default value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(
|
||||
() => {
|
||||
expect(component.property.default).toBeNull();
|
||||
}
|
||||
);
|
||||
}));
|
||||
|
||||
it('should remove actual and default value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017';
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(
|
||||
() => {
|
||||
expect(component.property.value).toBeNull();
|
||||
expect(component.property.default).toBeNull();
|
||||
}
|
||||
);
|
||||
}));
|
||||
|
||||
it('should be possible update a date/date-time', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017';
|
||||
component.property.key = 'fake-key';
|
||||
component.property.value = 'Jul 10 2017';
|
||||
const expectedDate = moment('Jul 10 2018', 'MMM DD YY');
|
||||
fixture.detectChanges();
|
||||
|
||||
fixture.whenStable().then(() => {
|
||||
describe('clear icon', () => {
|
||||
it('should render the clear icon in case of displayClearAction:true', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
const element = fixture.debugElement.nativeElement.querySelector('span[data-automation-id="card-date-value-fake-key"]');
|
||||
expect(element).toBeDefined();
|
||||
expect(element.innerText).toEqual('Jul 10, 2017');
|
||||
component.onDateChanged({ value: expectedDate });
|
||||
fixture.detectChanges();
|
||||
fixture.whenStable().then(() => expect(component.property.value).toEqual(expectedDate.toDate()));
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear-${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).not.toBeNull('Clean Icon should be in DOM');
|
||||
});
|
||||
}));
|
||||
|
||||
it('should not render the clear icon in case of property value empty', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = null;
|
||||
fixture.detectChanges();
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear--${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM');
|
||||
});
|
||||
|
||||
it('should not render the clear icon in case of displayClearAction:false', () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.displayClearAction = false;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
const datePickerClearToggle = fixture.debugElement.query(By.css(`[data-automation-id="datepicker-date-clear--${component.property.key}"]`));
|
||||
expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM');
|
||||
});
|
||||
|
||||
it('should remove the property value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(
|
||||
() => {
|
||||
expect(component.property.value).toBeNull();
|
||||
}
|
||||
);
|
||||
}));
|
||||
|
||||
it('should remove the property default value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(
|
||||
() => {
|
||||
expect(component.property.default).toBeNull();
|
||||
}
|
||||
);
|
||||
}));
|
||||
|
||||
it('should remove actual and default value after a successful clear attempt', async(() => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017';
|
||||
component.property.value = 'Jul 10 2017';
|
||||
fixture.detectChanges();
|
||||
const cardViewUpdateService = TestBed.get(CardViewUpdateService);
|
||||
|
||||
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe(
|
||||
(updateNotification) => {
|
||||
expect(updateNotification.target).toBe(component.property);
|
||||
expect(updateNotification.changed).toEqual({ dateKey: null });
|
||||
disposableUpdate.unsubscribe();
|
||||
}
|
||||
);
|
||||
|
||||
component.onDateClear();
|
||||
|
||||
fixture.whenStable().then(() => {
|
||||
expect(component.property.value).toBeNull();
|
||||
expect(component.property.default).toBeNull();
|
||||
});
|
||||
}));
|
||||
});
|
||||
|
||||
it('should be possible update a date-time', async () => {
|
||||
component.editable = true;
|
||||
component.property.editable = true;
|
||||
component.property.default = 'Jul 10 2017 00:01:00';
|
||||
component.property.key = 'fake-key';
|
||||
component.dateFormat = 'M/d/yy, h:mm a';
|
||||
component.property.value = 'Jul 10 2017 00:01:00';
|
||||
const expectedDate = moment('Jul 10 2018', 'MMM DD YY h:m:s');
|
||||
fixture.detectChanges();
|
||||
|
||||
await fixture.whenStable();
|
||||
fixture.detectChanges();
|
||||
const element = fixture.debugElement.nativeElement.querySelector('span[data-automation-id="card-date-value-fake-key"]');
|
||||
expect(element).toBeDefined();
|
||||
expect(element.innerText).toEqual('Jul 10, 2017');
|
||||
component.onDateChanged({ value: expectedDate });
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(component.property.value).toEqual(expectedDate.toDate());
|
||||
});
|
||||
});
|
||||
|
Reference in New Issue
Block a user