[ADF-1704] added encoding to filename to avoid break on special chara… (#2509)

* [ADF-1704] added encoding to filename to avoid break on special characters

* [ADF-1704] removed unused encode decode for file name

ng2-components/ng2-activiti-form/src/components/widgets/upload/upload.widget.html

@@ -14,7 +14,7 @@
                             (keyup.enter)="fileClicked(file)"
                             role="button"
                             tabindex="0"/>
-                    <span matLine id="{{'file-'+file.id}}" (click)="fileClicked(file)" (keyup.enter)="fileClicked(file)" role="button" tabindex="0" class="adf-file">{{decode(file.name)}}</span>
+                    <span matLine id="{{'file-'+file.id}}" (click)="fileClicked(file)" (keyup.enter)="fileClicked(file)" role="button" tabindex="0" class="adf-file">{{file.name}}</span>
                     <button *ngIf="!field.readOnly" mat-icon-button [id]="'file-'+file.id+'-remove'" (click)="reset(file);" (keyup.enter)="reset(file);">
                         <mat-icon class="mat-24">highlight_off</mat-icon>
                     </button>

ng2-components/ng2-activiti-form/src/components/widgets/upload/upload.widget.spec.ts

@@ -233,6 +233,104 @@ describe('UploadWidgetComponent', () => {
             });
         }));
 
+        it('should show correctly the file name when is formed with special characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = '±!@#$%^&*()_+{}:”|<>?§™£-=[];’\\,./.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe(`±!@#$%^&*()_+{}:”|<>?§™£-=[];’\\,./.jpg`);
+            });
+        }));
+
+        it('should show correctly the file name when is formed with Arabic characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'غ ظ	ض	ذ	خ	ث	ت	ش	ر	ق	ص	ف	ع	س	ن	م	ل	ك	ي	ط	ح	ز	و	ه	د	ج	ب	ا.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('غ ظ	ض	ذ	خ	ث	ت	ش	ر	ق	ص	ف	ع	س	ن	م	ل	ك	ي	ط	ح	ز	و	ه	د	ج	ب	ا.jpg');
+            });
+        }));
+
+        it('should show correctly the file name when is formed with French characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'Àâæçéèêëïîôœùûüÿ.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('Àâæçéèêëïîôœùûüÿ.jpg');
+            });
+        }));
+
+        it('should show correctly the file name when is formed with Greek characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'άέήίϊϊΐόύϋΰώθωερτψυιοπασδφγηςκλζχξωβνμ.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('άέήίϊϊΐόύϋΰώθωερτψυιοπασδφγηςκλζχξωβνμ.jpg');
+            });
+        }));
+
+        it('should show correctly the file name when is formed with Polish accented characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'Ą	Ć	Ę	Ł	Ń	Ó	Ś	Ź	Żą	ć	ę	ł	ń	ó	ś	ź	ż.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('Ą	Ć	Ę	Ł	Ń	Ó	Ś	Ź	Żą	ć	ę	ł	ń	ó	ś	ź	ż.jpg');
+            });
+        }));
+
+        it('should show correctly the file name when is formed with Spanish accented characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'á, é, í, ó, ú, ñ, Ñ, ü, Ü, ¿, ¡. Á, É, Í, Ó, Ú.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('á, é, í, ó, ú, ñ, Ñ, ü, Ü, ¿, ¡. Á, É, Í, Ó, Ú.jpg');
+            });
+        }));
+
+        it('should show correctly the file name when is formed with Swedish characters', async(() => {
+            uploadWidgetComponent.field.value = [];
+            fakeJpgAnswer.name = 'Äåéö.jpg';
+            uploadWidgetComponent.field.value.push(fakeJpgAnswer);
+            fixture.detectChanges();
+
+            fixture.whenStable().then(() => {
+                fixture.detectChanges();
+                let jpegElement = element.querySelector('#file-1156');
+                expect(jpegElement).not.toBeNull();
+                expect(jpegElement.textContent).toBe('Äåéö.jpg');
+            });
+        }));
+
         it('should remove file from field value', async(() => {
             uploadWidgetComponent.field.params.multiple = true;
             uploadWidgetComponent.field.value = [];

ng2-components/ng2-activiti-form/src/components/widgets/upload/upload.widget.ts

@@ -96,10 +96,6 @@ export class UploadWidgetComponent extends WidgetComponent implements OnInit {
         }
     }
 
-    decode(fileName: string): string {
-        return decodeURI(fileName);
-    }
-
     private removeElementFromList(list, element) {
         let index = list.indexOf(element);
         if (index !== -1) {