[AAE-3296] Add unit tests for Tooltips in Form Widgets (#6094)

This commit is contained in:
davidcanonieto
2020-09-10 09:39:26 +02:00
committed by GitHub
parent 327fab225a
commit f4ebaec501
10 changed files with 193 additions and 23 deletions

View File

@@ -15,7 +15,7 @@
* limitations under the License.
*/
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { FormFieldModel } from './../core/form-field.model';
import { AmountWidgetComponent, ADF_AMOUNT_SETTINGS } from './amount.widget';
import { setupTestBed } from '../../../../testing/setup-test-bed';
@@ -146,6 +146,33 @@ describe('AmountWidgetComponent - rendering', () => {
const errorWidget = fixture.nativeElement.querySelector('error-widget .adf-error-text');
expect(errorWidget.textContent).toBe('FORM.FIELD.VALIDATOR.INVALID_NUMBER');
});
it('should display tooltip when tooltip is set', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
id: 'TestAmount1',
name: 'Test Amount',
type: 'amount',
required: true,
colspan: 2,
placeholder: 'Check Placeholder Text',
minValue: null,
maxValue: null,
visibilityCondition: null,
params: {
existingColspan: 1,
maxColspan: 2
},
enableFractions: false,
currency: '$',
tooltip: 'ammount widget'
});
fixture.detectChanges();
const ammountElement: any = fixture.nativeElement.querySelector('#TestAmount1');
const tooltip = ammountElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
describe('AmountWidgetComponent settings', () => {

View File

@@ -26,6 +26,7 @@ import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateLoaderService } from 'core/services';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { CoreTestingModule } from '../../../../testing';
import { MatTooltipModule } from '@angular/material/tooltip';
describe('CheckboxWidgetComponent', () => {
@@ -38,7 +39,8 @@ describe('CheckboxWidgetComponent', () => {
TranslateModule.forRoot(),
CoreTestingModule,
FormBaseModule,
MatCheckboxModule
MatCheckboxModule,
MatTooltipModule
],
providers: [
{ provide: TranslateLoader, useClass: TranslateLoaderService }
@@ -55,7 +57,7 @@ describe('CheckboxWidgetComponent', () => {
describe('when template is ready', () => {
beforeEach(() => {
widget.field = new FormFieldModel(new FormModel({taskId: 'fake-task-id'}), {
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
id: 'check-id',
name: 'check-name',
value: '',
@@ -91,5 +93,17 @@ describe('CheckboxWidgetComponent', () => {
expect(checkbox.getAttribute('aria-checked')).toBe('false');
});
}));
});
it('should display tooltip when tooltip is set', async(() => {
widget.field.tooltip = 'checkbox widget';
fixture.detectChanges();
fixture.whenStable().then(() => {
const checkbox = fixture.debugElement.nativeElement.querySelector('#check-id');
const tooltip = checkbox.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
});
}));
});
});

View File

@@ -23,6 +23,7 @@ import { DateTimeWidgetComponent } from './date-time.widget';
import { setupTestBed } from '../../../../testing/setup-test-bed';
import { CoreTestingModule } from '../../../../testing/core.testing.module';
import { TranslateModule } from '@ngx-translate/core';
import { MatTooltipModule } from '@angular/material/tooltip';
describe('DateTimeWidgetComponent', () => {
@@ -33,7 +34,8 @@ describe('DateTimeWidgetComponent', () => {
setupTestBed({
imports: [
TranslateModule.forRoot(),
CoreTestingModule
CoreTestingModule,
MatTooltipModule
]
});
@@ -116,12 +118,12 @@ describe('DateTimeWidgetComponent', () => {
});
fixture.detectChanges();
fixture.whenStable()
.then(() => {
expect(element.querySelector('#date-field-id')).toBeDefined();
expect(element.querySelector('#date-field-id')).not.toBeNull();
const dateElement: any = element.querySelector('#date-field-id');
expect(dateElement.value).toBe('30-11-9999 10:30 AM');
});
.then(() => {
expect(element.querySelector('#date-field-id')).toBeDefined();
expect(element.querySelector('#date-field-id')).not.toBeNull();
const dateElement: any = element.querySelector('#date-field-id');
expect(dateElement.value).toBe('30-11-9999 10:30 AM');
});
}));
it('should show the correct format type', async(() => {
@@ -164,5 +166,23 @@ describe('DateTimeWidgetComponent', () => {
dateButton = <HTMLButtonElement> element.querySelector('button');
expect(dateButton.disabled).toBeTruthy();
}));
it('should display tooltip when tooltip is set', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
id: 'date-field-id',
name: 'date-name',
value: '12-30-9999 10:30 AM',
dateDisplayFormat: 'MM-DD-YYYY HH:mm A',
type: 'datetime',
readOnly: 'false',
tooltip: 'datetime widget'
});
fixture.detectChanges();
const dateElement: any = element.querySelector('#date-field-id');
const tooltip = dateElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
});

View File

@@ -22,6 +22,7 @@ import { HyperlinkWidgetComponent } from './hyperlink.widget';
import { setupTestBed } from '../../../../testing/setup-test-bed';
import { CoreTestingModule } from '../../../../testing';
import { TranslateModule } from '@ngx-translate/core';
import { MatTooltipModule } from '@angular/material/tooltip';
describe('HyperlinkWidgetComponent', () => {
@@ -32,7 +33,8 @@ describe('HyperlinkWidgetComponent', () => {
setupTestBed({
imports: [
TranslateModule.forRoot(),
CoreTestingModule
CoreTestingModule,
MatTooltipModule
]
});
@@ -192,4 +194,22 @@ describe('HyperlinkWidgetComponent', () => {
expect(hyperlinkWidgetLink.href).toBe(url);
expect(hyperlinkWidgetLink.innerText).toBe(displayText);
});
it('should display tooltip when tooltip is set', () => {
const displayText = 'displayText';
const url = 'https://www.alfresco.com/';
widget.field = new FormFieldModel(new FormModel(), {
id: 'hyperlink',
hyperlinkUrl: url,
displayText: displayText,
type: FormFieldTypes.HYPERLINK,
tooltip: 'hyperlink widget'
});
fixture.detectChanges();
const checkbox = fixture.debugElement.nativeElement.querySelector('.adf-hyperlink-widget div');
const tooltip = checkbox.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
});
});

View File

@@ -268,5 +268,15 @@ describe('PeopleWidgetComponent', () => {
expect(selectEmitSpy).toHaveBeenCalledWith(1001);
});
});
it('should display tooltip when tooltip is set', async(() => {
widget.field.tooltip = 'people widget';
fixture.detectChanges();
const radioButtonsElement: any = element.querySelector('#people-id');
const tooltip = radioButtonsElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
});

View File

@@ -230,6 +230,26 @@ describe('RadioButtonsWidgetComponent', () => {
expect(radioButtonWidget.field.isValid).toBe(true);
});
it('should display tooltip when tooltip is set', async(() => {
radioButtonWidget.field = new FormFieldModel(new FormModel(), {
id: 'radio-id',
name: 'radio-name-label',
type: FormFieldTypes.RADIO_BUTTONS,
readOnly: false,
required: true,
optionType: 'manual',
options: restOption,
value: 'opt-name-2',
tooltip: 'radio widget'
});
fixture.detectChanges();
const radioButtonsElement: any = element.querySelector('#radio-id-opt-1');
const tooltip = radioButtonsElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(radioButtonWidget.field.tooltip);
}));
describe('and radioButton is populated via taskId', () => {
beforeEach(async(() => {

View File

@@ -203,6 +203,21 @@ describe('TextWidgetComponent', () => {
expect(widget.field.isValid).toBe(false);
});
it('should display tooltip when tooltip is set', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
id: 'text-id',
name: 'text-name',
value: '',
type: FormFieldTypes.TEXT,
tooltip: 'text widget'
});
fixture.detectChanges();
const textElement: any = element.querySelector('#text-id');
const tooltip = textElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
describe('and no mask is configured on text element', () => {

View File

@@ -210,7 +210,7 @@ describe('AttachFileCloudWidgetComponent', () => {
});
}));
it('should be able to attach files coming from content selector', async() => {
it('should be able to attach files coming from content selector', async () => {
spyOn(
contentCloudNodeSelectorService,
'openUploadFileDialog'
@@ -237,7 +237,7 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(fileIcon).not.toBeNull();
});
it('should be able to attach files coming from all files source', async() => {
it('should be able to attach files coming from all files source', async () => {
spyOn(contentCloudNodeSelectorService, 'fetchNodeIdFromRelativePath').and.returnValue(mockNodeId);
spyOn(
contentCloudNodeSelectorService,
@@ -299,7 +299,7 @@ describe('AttachFileCloudWidgetComponent', () => {
openUploadFileDialogSpy = spyOn(contentCloudNodeSelectorService, 'openUploadFileDialog').and.returnValue(of([fakeMinimalNode]));
}));
it('should be able to fetch nodeId if destinationFolderPath is defined', async() => {
it('should be able to fetch nodeId if destinationFolderPath is defined', async () => {
const fetchNodeIdFromRelativePathSpy = spyOn(contentCloudNodeSelectorService, 'fetchNodeIdFromRelativePath').and.returnValue(mockNodeId);
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
@@ -324,7 +324,7 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(widget.rootNodeId).toEqual('mock-node-id');
});
it('Should be able to set given alias as rootNodeId if the nodeId of the alias is not fetched from the api', async() => {
it('Should be able to set given alias as rootNodeId if the nodeId of the alias is not fetched from the api', async () => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
value: []
@@ -345,7 +345,7 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(openUploadFileDialogSpy).toHaveBeenCalledWith('-root-', 'single', true);
});
it('Should be able to set default alias as rootNodeId if destinationFolderPath contains wrong alias', async() => {
it('Should be able to set default alias as rootNodeId if destinationFolderPath contains wrong alias', async () => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
value: []
@@ -367,7 +367,7 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(openUploadFileDialogSpy).toHaveBeenCalledWith('-root-', 'multiple', true);
});
it('Should be able to set default alias as rootNodeId if destinationFolderPath does not have alias', async() => {
it('Should be able to set default alias as rootNodeId if destinationFolderPath does not have alias', async () => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
value: []
@@ -391,7 +391,7 @@ describe('AttachFileCloudWidgetComponent', () => {
describe('FilesSource', () => {
it('should be able to set myFiles folderId as rootNodeId if fileSource set only to content', async() => {
it('should be able to set myFiles folderId as rootNodeId if fileSource set only to content', async () => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
value: []
@@ -412,7 +412,7 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(openUploadFileDialogSpy).toHaveBeenCalledWith('-my-', 'single', false);
});
it('should be able to set root folderId as rootNodeId if fileSource set to content and local', async() => {
it('should be able to set root folderId as rootNodeId if fileSource set to content and local', async () => {
widget.field = new FormFieldModel(new FormModel(), {
type: FormFieldTypes.UPLOAD,
value: []
@@ -433,6 +433,21 @@ describe('AttachFileCloudWidgetComponent', () => {
expect(widget.rootNodeId).toEqual('-root-');
expect(openUploadFileDialogSpy).toHaveBeenCalledWith('-root-', 'single', true);
});
it('should display tooltip when tooltip is set', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
id: 'attach-file-attach',
type: FormFieldTypes.UPLOAD,
value: [],
tooltip: 'attach file widget'
});
fixture.detectChanges();
const attachElement: any = element.querySelector('#attach-file-attach');
const tooltip = attachElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
});
@@ -487,7 +502,7 @@ describe('AttachFileCloudWidgetComponent', () => {
});
describe('when a file is uploaded', () => {
beforeEach(async() => {
beforeEach(async () => {
spyOn(
contentCloudNodeSelectorService,
'openUploadFileDialog'
@@ -585,7 +600,7 @@ describe('AttachFileCloudWidgetComponent', () => {
it('should request form to be updated with metadata when retrieve is clicked', (done) => {
const updateFormSpy = spyOn(formService.updateFormValuesRequested, 'next');
const expectedValues = { pfx_property_one: 'testValue', pfx_property_two: true};
const expectedValues = { pfx_property_one: 'testValue', pfx_property_two: true };
const menuButton: HTMLButtonElement = <HTMLButtonElement> (
fixture.debugElement.query(By.css('#file-fake-option-menu'))

View File

@@ -178,5 +178,22 @@ describe('DateWidgetComponent', () => {
expect(widget.field.isValid).toBeFalsy();
}));
it('should display tooltip when tooltip is set', async(() => {
widget.field = new FormFieldModel(new FormModel(), {
id: 'date-field-id',
name: 'date-name',
value: 'aa',
type: 'date',
readOnly: 'false',
tooltip: 'date widget'
});
fixture.detectChanges();
const dateElement: any = element.querySelector('#date-field-id');
const tooltip = dateElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
}));
});
});

View File

@@ -133,6 +133,19 @@ describe('DropdownCloudWidgetComponent', () => {
});
}));
it('should display tooltip when tooltip is set', async(() => {
widget.field.tooltip = 'dropdown widget';
widget.ngOnInit();
fixture.detectChanges();
fixture.whenStable().then(() => {
const dropDownElement: any = element.querySelector('#dropdown-id');
const tooltip = dropDownElement.getAttribute('ng-reflect-message');
expect(tooltip).toEqual(widget.field.tooltip);
});
}));
it('should load data from restUrl and populate options', async(() => {
widget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), {
id: 'dropdown-id',
@@ -350,7 +363,6 @@ describe('DropdownCloudWidgetComponent', () => {
done();
});
});
});
});
});