Merge pull request #2 from primefaces/master

sync with master repository

src/app/components/autocomplete/autocomplete.ts

@@ -120,6 +120,8 @@ export class AutoComplete implements AfterViewChecked,AfterContentInit,DoCheck,O
 
     @Input() dropdownIcon: string = "pi pi-caret-down";
 
+    @Input() unique: boolean = true;
+
     @Output() completeMethod: EventEmitter<any> = new EventEmitter();
 
     @Output() onSelect: EventEmitter<any> = new EventEmitter();
@@ -392,7 +394,7 @@ export class AutoComplete implements AfterViewChecked,AfterContentInit,DoCheck,O
         if (this.multiple) {
             this.multiInputEL.nativeElement.value = '';
             this.value = this.value||[];
-            if (!this.isSelected(option)) {
+            if (!this.isSelected(option) || !this.unique) {
                 this.value = [...this.value,option];
                 this.onModelChange(this.value);
             }

src/app/components/calendar/calendar.ts

@@ -1026,7 +1026,8 @@ export class Calendar implements OnInit,OnDestroy,ControlValueAccessor {
     }
 
     isMonthSelected(month: number): boolean {
-        return this.isSelected({year: this.currentYear, month: month, day: 1, selectable: true});
+        let day = this.value ? (Array.isArray(this.value) ? this.value[0].getDate() : this.value.getDate()) : 1; 
+        return this.isSelected({year: this.currentYear, month: month, day: day, selectable: true});
     }
 
     isDateEquals(value, dateMeta) {

src/app/components/dom/domhandler.spec.ts

@@ -0,0 +1,169 @@
+import { DomHandler } from './domhandler';
+
+describe('DomHandler', () => {
+
+    it('should add single and multiple class to element', () => {
+        const element = document.createElement("div");
+        DomHandler.addClass(element,"primeng");
+        let mockElement = {classList:undefined,className:""};
+        DomHandler.addClass(mockElement,"primeng");
+        expect(element.classList).toContain("primeng");
+        expect(mockElement.className).toContain("primeng");
+        DomHandler.addMultipleClasses(element,"rocks! vamos!");
+        DomHandler.addMultipleClasses(mockElement,"rocks! vamos!");
+        expect(element.classList.value).toContain("primeng rocks! vamos!");
+        expect(mockElement.className).toContain("rocks! vamos!");
+    });
+
+    it('should remove class from element', () => {
+        const element = document.createElement("div");
+        DomHandler.addClass(element,"primeng");
+        let mockElement = {classList:undefined,className:""};
+        DomHandler.addClass(mockElement,"primeng");
+        DomHandler.removeClass(element,"primeng");
+        DomHandler.removeClass(mockElement,"primeng");
+        expect(element.classList).not.toContain("primeng");
+        expect(mockElement.className).not.toContain("primeng");
+    });
+
+    it('should check elemets class', () => {
+        const element = document.createElement("div");
+        DomHandler.addClass(element,"primeng");
+        let mockElement = {classList:undefined,className:""};
+        DomHandler.addClass(mockElement,"primeng");
+        expect(DomHandler.hasClass(element,"primeng")).toBeTruthy();
+        expect(DomHandler.hasClass(mockElement,"primeng")).toBeTruthy();
+    });
+
+    it('should get siblings', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("span");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        expect(DomHandler.siblings(element.children[0]).length).toEqual(2);
+    });
+
+    it('should remove child', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("span");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        DomHandler.removeChild(element.children[1],element);
+        expect(element.children.length).toEqual(2);
+    });
+
+    it('should check value isInteger', () => {
+        expect(DomHandler.isInteger(5)).toBeTruthy();
+        expect(DomHandler.isInteger("5")).toBeFalsy();
+    });
+
+    it('should get focusable elements', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("button");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        expect(DomHandler.getFocusableElements(element).length).toEqual(1);
+    });
+
+    it('should find element', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("a");
+        DomHandler.addClass(childEl,"primeng");
+        DomHandler.addClass(childEl3,"primeng");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        expect(DomHandler.find(element,"a").length).toEqual(2);
+        expect(DomHandler.findSingle(element,"a")).toBeTruthy();
+        expect(DomHandler.findSingle(null,"a")).toBeNull();
+    });
+
+    it('should find index', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("a");
+        DomHandler.addClass(childEl,"primeng");
+        DomHandler.addClass(childEl3,"primeng");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        expect(DomHandler.index(element.children[2])).toEqual(2);
+    });
+
+    it('should find index with indexWithinGroup', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("a");
+        childEl2.setAttribute("primeng","rocks!");
+        childEl3.setAttribute("primeng","rocks!");
+        DomHandler.addClass(childEl,"primeng");
+        DomHandler.addClass(childEl3,"primeng");
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        expect(DomHandler.indexWithinGroup(element.children[2],"primeng")).toEqual(1);
+    });
+
+    it('should use relativePosition', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("a");
+        childEl2.setAttribute("primeng","rocks!");
+        childEl3.setAttribute("primeng","rocks!");
+        DomHandler.addClass(childEl,"primeng");
+        DomHandler.addClass(childEl3,"primeng");
+        element.style.height = "200px";
+        element.style.width = "200px";
+        childEl3.style.height = "100px";
+        childEl3.style.width = "100px";
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        DomHandler.relativePosition(element.children[2],element);
+        expect(childEl3.style.top).toEqual("0px");
+        expect(childEl3.style.left).toEqual("0px");
+    });
+
+    it('should use absolutePosition', () => {
+        const element = document.createElement("div");
+        const childEl = document.createElement("p");
+        const childEl2 = document.createElement("a");
+        const childEl3 = document.createElement("a");
+        childEl2.setAttribute("primeng","rocks!");
+        childEl3.setAttribute("primeng","rocks!");
+        DomHandler.addClass(childEl,"primeng");
+        DomHandler.addClass(childEl3,"primeng");
+        element.style.height = "200px";
+        element.style.width = "200px";
+        childEl3.style.height = "100px";
+        childEl3.style.width = "100px";
+        element.appendChild(childEl);
+        element.appendChild(childEl2);
+        element.appendChild(childEl3);
+        DomHandler.absolutePosition(element.children[2],element);
+        expect(childEl3.style.top).toEqual("0px");
+        expect(childEl3.style.left).toEqual("0px");
+    });
+
+    it('should get hidden element height and width', () => {
+        const element = document.createElement("div");
+        element.style.height = "0px";
+        element.style.width = "0px";
+        expect(DomHandler.getHiddenElementOuterHeight(element)).toEqual(0);
+        expect(DomHandler.getHiddenElementOuterWidth(element)).toEqual(0);
+    });
+});

src/app/components/dropdown/dropdown.spec.ts

@@ -8,14 +8,17 @@ import { Component } from '@angular/core';
 
 @Component({
 	template: `
-		<p-dropdown [options]="groupedCars" placeholder="Select a Car" [group]="true">
+		<p-dropdown [(ngModel)]="selectedCity" [options]="groupedCars" placeholder="Select a Car" [group]="true">
 			<ng-template let-group pTemplate="group">
 				<span>{{group.label}}</span>
 			</ng-template>
 		</p-dropdown>
+		<p-dropdown [(ngModel)]="selectedCity"></p-dropdown>
+		<button (click)="setValue()"></button>
 	`
 })
 class TestDropdownComponent {
+	selectedCity: any;
 	groupedCars = [
 		{
 			label: 'Germany', value: 'germany.png', 
@@ -42,10 +45,15 @@ class TestDropdownComponent {
 			]
 		}
 	];
+
+	setValue() {
+		this.selectedCity = {name: 'New York', code: 'NY'};
+	}
 }
 describe('Dropdown', () => {
 
     let dropdown: Dropdown;
+    let testDropdown: Dropdown;
     let groupDropdown: Dropdown;
 	let fixture: ComponentFixture<Dropdown>;
 	let groupFixture: ComponentFixture<TestDropdownComponent>;
@@ -67,6 +75,7 @@ describe('Dropdown', () => {
 	  fixture = TestBed.createComponent(Dropdown);
 	  groupFixture = TestBed.createComponent(TestDropdownComponent);
 	  groupDropdown = groupFixture.debugElement.children[0].componentInstance;
+	  testDropdown = groupFixture.debugElement.children[1].componentInstance;
       dropdown = fixture.componentInstance;
     });
 
@@ -193,6 +202,7 @@ describe('Dropdown', () => {
 			{label:'Paris', value:{id:5, name: 'Paris', code: 'PRS'}}
 		];
 		dropdown.showClear=true;
+		dropdown.autoWidth = true;
 		fixture.detectChanges();
 
 		const container = fixture.debugElement.query(By.css('.ui-dropdown')).nativeElement;
@@ -211,20 +221,25 @@ describe('Dropdown', () => {
 	});
 
 	it('should filtered', async(() => {
+		dropdown.filter = true;
+		dropdown.filterValue = "n";
+		fixture.detectChanges();
+
 		dropdown.options = [
 			{label: 'New York', code: 'NY'},
 			{label: 'Rome', code: 'RM'},
 			{label: 'London', code: 'LDN'},
 			{label: 'Istanbul', code: 'IST'},
 			{label: 'Paris', code: 'PRS'}
 		];
-		dropdown.filter = true;
 		fixture.detectChanges();
 
 		const container = fixture.debugElement.query(By.css('.ui-dropdown')).nativeElement;
 		container.click();
 		fixture.detectChanges();
 
+		let items=fixture.debugElement.query(By.css('.ui-dropdown-items'));
+		expect(items.nativeElement.children.length).toEqual(3);
 		const filterDiv = fixture.debugElement.query(By.css('.ui-dropdown-filter-container'));
 		expect(filterDiv).toBeTruthy();
 		const filterInputEl = fixture.debugElement.query(By.css('.ui-dropdown-filter'));
@@ -234,7 +249,7 @@ describe('Dropdown', () => {
 		dropdown.onFilter(event)
 		fixture.detectChanges();
 
-		const items=fixture.debugElement.query(By.css('.ui-dropdown-items'));
+		items=fixture.debugElement.query(By.css('.ui-dropdown-items'));
 		expect(items.nativeElement.children.length).toEqual(3);
 	}));
 
@@ -325,29 +340,37 @@ describe('Dropdown', () => {
 	});
 
 	it('should select with down key', () => {
-		dropdown.options = [
+		groupFixture.detectChanges();
+
+		testDropdown.options = [
 			{name: 'New York', code: 'NY'},
 			{name: 'Rome', code: 'RM'},
 			{name: 'London', code: 'LDN'},
 			{name: 'Istanbul', code: 'IST'},
 			{name: 'Paris', code: 'PRS'}
 		];
-		dropdown.appendTo = document.body;
-		fixture.detectChanges();
+		testDropdown.appendTo = document.body;
+		testDropdown.filter = true;
+		testDropdown.filterValue = "n";
+		groupFixture.detectChanges();
+
+		groupFixture.debugElement.children[2].nativeElement.click();
+		groupFixture.detectChanges();
 
-		const inputEl = fixture.debugElement.query(By.css('input')).nativeElement;
+		expect(testDropdown.selectedOption.name).toEqual("New York");
+		const inputEl = groupFixture.debugElement.children[1].query(By.css('input')).nativeElement;
 		const keydownEvent: any = document.createEvent('CustomEvent');
         keydownEvent.which = 40;
 		keydownEvent.initEvent('keydown', true, true);
 		keydownEvent.altKey = true;
 		inputEl.dispatchEvent(keydownEvent);
-		fixture.detectChanges();
+		groupFixture.detectChanges();
 
 		keydownEvent.altKey = false;
 		inputEl.dispatchEvent(keydownEvent);
-		fixture.detectChanges();
+		groupFixture.detectChanges();
 
-		expect(dropdown.selectedOption.name).toEqual("Rome");
+		expect(testDropdown.selectedOption.name).toEqual("Rome");
 	});
 
 	it('should select with enter key and close the overlay', () => {

src/app/components/dropdown/dropdown.ts

@@ -406,7 +406,6 @@ export class Dropdown implements OnInit,AfterViewInit,AfterContentInit,AfterView
         if (!option.disabled) {
             this.selectItem(event, option);
             this.focusViewChild.nativeElement.focus();
-            this.filled = true;
         }
 
         setTimeout(() => {
@@ -418,6 +417,7 @@ export class Dropdown implements OnInit,AfterViewInit,AfterContentInit,AfterView
         if (this.selectedOption != option) {
             this.selectedOption = option;
             this.value = option.value;
+            this.filled = true;
 
             this.onModelChange(this.value);
             this.updateEditableLabel();

src/app/components/inputmask/inputmask.spec.ts

@@ -251,4 +251,35 @@ describe('InputMask', () => {
         let inputMaskEl = fixture.debugElement.query(By.css('input'));
         expect(inputMaskEl.parent.nativeElement.className).toContain("ui-inputwrapper-focus");
     });
+
+    it('should disabled with setDisabledState', () => {
+        inputmask.setDisabledState(true);
+        fixture.detectChanges();
+
+        inputmask.focus();
+        fixture.detectChanges();
+
+        expect(document.activeElement).not.toEqual(inputmask.inputViewChild.nativeElement);
+    });
+
+    it('should be readonly', () => {
+        inputmask.readonly = true;
+        fixture.detectChanges();
+
+        const updateModelSpy = spyOn(inputmask, "updateModel").and.callThrough();
+        const inputMaskEl = fixture.debugElement.query(By.css("input"));
+        const event: any = document.createEvent('CustomEvent');
+        event.which = 13;
+        event.initEvent('keydown', true, true);
+        inputMaskEl.nativeElement.dispatchEvent(event as KeyboardEvent);
+        event.initEvent('input', true, true);
+        inputMaskEl.nativeElement.dispatchEvent(event as KeyboardEvent);
+        event.initEvent('keypress', true, true);
+        inputMaskEl.nativeElement.dispatchEvent(event as KeyboardEvent);
+        inputMaskEl.nativeElement.dispatchEvent(new Event("focus"));
+        fixture.detectChanges();
+
+        expect(document.activeElement).not.toEqual(inputmask.inputViewChild.nativeElement);
+        expect(updateModelSpy).not.toHaveBeenCalled();
+    });
 });