From 8d431bea973685162a7933d54e3db60d6d6b15de Mon Sep 17 00:00:00 2001
From: Tifenn Guillas <tifenn.guillas@gmail.com>
Date: Fri, 1 Oct 2021 11:56:12 +0200
Subject: [PATCH] Tests on search summary and progress-bar components => DONE
---
.../components/progress-bar.component.spec.ts | 122 ++++++++++++++++
.../components/progress-bar.component.ts | 22 ++-
.../components/summary.component.spec.ts | 138 ++++++++++++++----
3 files changed, 248 insertions(+), 34 deletions(-)
create mode 100644 client/src/app/instance/search/components/progress-bar.component.spec.ts
diff --git a/client/src/app/instance/search/components/progress-bar.component.spec.ts b/client/src/app/instance/search/components/progress-bar.component.spec.ts
new file mode 100644
index 00000000..3fe9d464
--- /dev/null
+++ b/client/src/app/instance/search/components/progress-bar.component.spec.ts
@@ -0,0 +1,122 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProgressBarComponent } from './progress-bar.component';
+import { RouterTestingModule } from '@angular/router/testing';
+
+describe('[Instance][Search][Component] ProgressBarComponent', () => {
+ let component: ProgressBarComponent;
+ let fixture: ComponentFixture<ProgressBarComponent>;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ declarations: [ProgressBarComponent],
+ imports: [
+ RouterTestingModule,
+ // AccordionModule.forRoot(),
+ // TooltipModule.forRoot(),
+ // BrowserAnimationsModule
+ ]
+ });
+ fixture = TestBed.createComponent(ProgressBarComponent);
+ component = fixture.componentInstance;
+ });
+
+ it('should create the component', () => {
+ expect(component).toBeTruthy();
+ });
+
+ it('#getStepClass() should return correct step class', () => {
+ let style = component.getStepClass();
+ expect(style).toBe('datasetStep');
+ component.currentStep = 'dataset';
+ style = component.getStepClass();
+ expect(style).toBe('datasetStep');
+ component.currentStep = 'criteria';
+ style = component.getStepClass();
+ expect(style).toBe('criteriaStep');
+ component.currentStep = 'output';
+ style = component.getStepClass();
+ expect(style).toBe('outputStep');
+ component.currentStep = 'result';
+ style = component.getStepClass();
+ expect(style).toBe('resultStep');
+ });
+
+ it('#getNavItemAStyle() should return link color theme', () => {
+ component.instance = {
+ name: 'myInstance',
+ label: 'My Instance',
+ data_path: 'data/path',
+ config: {
+ design: {
+ design_color: 'green',
+ design_background_color: 'darker green',
+ design_logo: 'path/to/logo',
+ design_favicon: 'path/to/favicon'
+ },
+ home: {
+ home_component: 'HomeComponent',
+ home_config: {
+ home_component_text: 'Description',
+ home_component_logo: 'path/to/logo'
+ }
+ },
+ search: {
+ search_by_criteria_allowed: true,
+ search_by_criteria_label: 'Search',
+ search_multiple_allowed: true,
+ search_multiple_label: 'Search multiple',
+ search_multiple_all_datasets_selected: false
+ },
+ documentation: {
+ documentation_allowed: true,
+ documentation_label: 'Documentation'
+ }
+ },
+ nb_dataset_families: 1,
+ nb_datasets: 2
+ };
+ component.currentStep = 'a';
+ expect(component.getNavItemAStyle('b', false)).toBeNull();
+ expect(component.getNavItemAStyle('b', true)).toEqual({ color: 'green' });
+ });
+
+ it('#getNavItemIconCircleStyle() should return circle color theme', () => {
+ component.instance = {
+ name: 'myInstance',
+ label: 'My Instance',
+ data_path: 'data/path',
+ config: {
+ design: {
+ design_color: 'green',
+ design_background_color: 'darker green',
+ design_logo: 'path/to/logo',
+ design_favicon: 'path/to/favicon'
+ },
+ home: {
+ home_component: 'HomeComponent',
+ home_config: {
+ home_component_text: 'Description',
+ home_component_logo: 'path/to/logo'
+ }
+ },
+ search: {
+ search_by_criteria_allowed: true,
+ search_by_criteria_label: 'Search',
+ search_multiple_allowed: true,
+ search_multiple_label: 'Search multiple',
+ search_multiple_all_datasets_selected: false
+ },
+ documentation: {
+ documentation_allowed: true,
+ documentation_label: 'Documentation'
+ }
+ },
+ nb_dataset_families: 1,
+ nb_datasets: 2
+ };
+ component.currentStep = 'a';
+ expect(component.getNavItemIconCircleStyle('a', false)).toEqual({ 'background-color': 'green', 'border-color': 'green' });
+ expect(component.getNavItemIconCircleStyle('b', true)).toEqual({ 'color': 'green', 'border-color': 'green' });
+ });
+});
diff --git a/client/src/app/instance/search/components/progress-bar.component.ts b/client/src/app/instance/search/components/progress-bar.component.ts
index de9abad0..64a72787 100644
--- a/client/src/app/instance/search/components/progress-bar.component.ts
+++ b/client/src/app/instance/search/components/progress-bar.component.ts
@@ -12,16 +12,16 @@ import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
import { SearchQueryParams } from '../../store/models';
import { Instance } from 'src/app/metamodel/models';
+/**
+ * @class
+ * @classdesc Search progress bar component.
+ */
@Component({
selector: 'app-progress-bar',
templateUrl: 'progress-bar.component.html',
styleUrls: ['progress-bar.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush
})
-/**
- * @class
- * @classdesc Search progress bar component.
- */
export class ProgressBarComponent {
@Input() currentStep: string;
@Input() instance: Instance;
@@ -52,7 +52,12 @@ export class ProgressBarComponent {
}
}
- getNavItemAStyle(currentStep: string, checked: boolean) {
+ /**
+ * Returns link color theme.
+ *
+ * @return { color: string } | null
+ */
+ getNavItemAStyle(currentStep: string, checked: boolean): { color: string } | null {
if (this.currentStep === currentStep || checked) {
return {
'color': this.instance.config.design.design_color
@@ -62,7 +67,12 @@ export class ProgressBarComponent {
}
}
- getNavItemIconCircleStyle(currentStep: string, checked: boolean) {
+ /**
+ * Returns circle color theme.
+ *
+ * @return { }
+ */
+ getNavItemIconCircleStyle(currentStep: string, checked: boolean): {} {
let style = {};
if (this.currentStep === currentStep) {
style['border-color'] = this.instance.config.design.design_color;
diff --git a/client/src/app/instance/search/components/summary.component.spec.ts b/client/src/app/instance/search/components/summary.component.spec.ts
index 1b46e6ac..9d5c4d91 100644
--- a/client/src/app/instance/search/components/summary.component.spec.ts
+++ b/client/src/app/instance/search/components/summary.component.spec.ts
@@ -2,10 +2,11 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AccordionModule } from 'ngx-bootstrap/accordion';
+import { TooltipModule } from 'ngx-bootstrap/tooltip';
import { SummaryComponent } from './summary.component';
-import { TooltipModule } from 'ngx-bootstrap/tooltip';
import { FieldCriterion } from '../../store/models/criterion';
+import { OutputCategory } from '../../../metamodel/models';
describe('[Instance][Search][Component] SummaryComponent', () => {
let component: SummaryComponent;
@@ -147,8 +148,8 @@ describe('[Instance][Search][Component] SummaryComponent', () => {
component.criteriaList = [];
expect(component.noCriteria()).toBeTruthy();
component.criteriaList = [
- {id: 1, type: 'field', operator: 'eq', value: 'fd_crit_1'} as FieldCriterion,
- {id: 2, type: 'field', operator: 'eq', value: 'fd_crit_2'} as FieldCriterion
+ { id: 1, type: 'field', operator: 'eq', value: 'fd_crit_1' } as FieldCriterion,
+ { id: 2, type: 'field', operator: 'eq', value: 'fd_crit_2' } as FieldCriterion
]
;
expect(component.noCriteria()).toBeFalsy();
@@ -158,29 +159,110 @@ describe('[Instance][Search][Component] SummaryComponent', () => {
expect(component.noCriteria()).toBeFalsy();
});
- // it('#getAttribute() should return the attribute with the given id', () => {
- // component.attributeList = ATTRIBUTE_LIST;
- // expect(component.getAttribute(1).name).toBe('name_one');
- // });
- //
- // it('#printCriterion() should return pretty criterion', () => {
- // const criterion: Criterion = CRITERIA_LIST.find(c => c.id === 1);
- // expect(component.printCriterion(criterion)).toBe('= fd_crit_1');
- // });
- //
- // it('#getCategoryByFamilySortedByDisplay(idFamily) should sort by display categories belonging to idFamily', () => {
- // component.categoryList = CATEGORY_LIST;
- // const sortedCategoryList: Category[] = component.getCategoryByFamilySortedByDisplay(1);
- // expect(sortedCategoryList.length).toBe(2);
- // expect(sortedCategoryList[0].id).toBe(2);
- // expect(sortedCategoryList[1].id).toBe(1);
- // });
- //
- // it('#getSelectedOutputByCategory() should return selected attributes belonging to the given category', () => {
- // component.attributeList = ATTRIBUTE_LIST;
- // component.outputList = [1];
- // expect(component.getSelectedOutputByCategory(1).length).toEqual(1);
- // component.outputList = [];
- // expect(component.getSelectedOutputByCategory(1).length).toEqual(0);
- // });
+ it('#getAttribute() should return the attribute with the given id', () => {
+ component.attributeList = [
+ {
+ id: 1,
+ name: 'att1',
+ label: 'attribute1',
+ form_label: 'Attribute 1',
+ output_display: 1,
+ criteria_display: 1,
+ search_type: 'field',
+ operator: 'eq',
+ type: 'string',
+ min: 'one',
+ display_detail: 1,
+ id_criteria_family: 1,
+ id_output_category: 1
+ },
+ {
+ id: 2,
+ name: 'att2',
+ label: 'attribute2',
+ form_label: 'Attribute 2',
+ output_display: 1,
+ criteria_display: 1,
+ search_type: 'field',
+ operator: 'eq',
+ type: 'string',
+ min: 'two',
+ display_detail: 1,
+ id_criteria_family: 2,
+ id_output_category: 1
+ }
+ ];
+ expect(component.getAttribute(1).name).toBe('att1');
+ });
+
+ it('#printCriterion() should return pretty criterion', () => {
+ const criterion = { id: 1, type: 'field', operator: 'eq', value: 'fd_crit_1' } as FieldCriterion;
+ expect(component.printCriterion(criterion)).toBe('= fd_crit_1');
+ });
+
+ it('#getCategoryByFamilySortedByDisplay(idFamily) should sort by display categories belonging to idFamily', () => {
+ component.outputCategoryList = [
+ {
+ id: 3,
+ label: 'The last output category',
+ display: 30,
+ id_output_family: 2
+ },
+ {
+ id: 1,
+ label: 'Another output category',
+ display: 10,
+ id_output_family: 1
+ },
+ {
+ id: 2,
+ label: 'Default output category',
+ display: 20,
+ id_output_family: 1
+ }
+ ];
+ const sortedCategoryList: OutputCategory[] = component.getCategoryByFamilySortedByDisplay(1);
+ expect(sortedCategoryList.length).toBe(2);
+ expect(sortedCategoryList[0].id).toBe(1);
+ expect(sortedCategoryList[1].id).toBe(2);
+ });
+
+ it('#getSelectedOutputByCategory() should return selected attributes belonging to the given category', () => {
+ component.attributeList = [
+ {
+ id: 1,
+ name: 'att1',
+ label: 'attribute1',
+ form_label: 'Attribute 1',
+ output_display: 1,
+ criteria_display: 1,
+ search_type: 'field',
+ operator: 'eq',
+ type: 'string',
+ min: 'one',
+ display_detail: 1,
+ id_criteria_family: 1,
+ id_output_category: 1
+ },
+ {
+ id: 2,
+ name: 'att2',
+ label: 'attribute2',
+ form_label: 'Attribute 2',
+ output_display: 1,
+ criteria_display: 1,
+ search_type: 'field',
+ operator: 'eq',
+ type: 'string',
+ min: 'two',
+ display_detail: 1,
+ id_criteria_family: 2,
+ id_output_category: 2
+ }
+ ];
+ component.outputList = [1];
+ expect(component.getSelectedOutputByCategory(1).length).toEqual(1);
+ component.outputList = [];
+ expect(component.getSelectedOutputByCategory(1).length).toEqual(0);
+ });
});
--
GitLab