separated attachment list UI as a component and the corresponding attachment list payload as a mixin

Issue #548

3 files changed, 51 insertions, 31 deletions

diff --git a/web-ui/test/spec/mail_view/data/attachment_list.spec.js b/web-ui/test/spec/mail_view/data/attachment_list.spec.js
index f1fa0e76..3d93537b 100644
--- a/web-ui/test/spec/mail_view/data/attachment_list.spec.js
+++ b/web-ui/test/spec/mail_view/data/attachment_list.spec.js
@@ -1,45 +1,21 @@
-describeComponent('mail_view/data/attachment_list', function () {
-    'use strict';
+describeMixin('mail_view/data/attachment_list', function () {
+  'use strict';
 
-    describe('initialization', function () {
-        beforeEach(function () {
-            this.setupComponent('<div id="attachment-list">' +
-                '<ul><li id="attachment-list-item"> </li></ul>' +
-                '</div>');
+    describe('initialization', function() {
+        beforeEach(function(){
+            this.setupComponent();
         });
 
         it('should add attachment to the list based on uploadedAttachment event', function () {
             var stubAttachment = {attachment_id: 'faked'};
-            $(document).trigger(Pixelated.events.mail.uploadedAttachment, stubAttachment);
+            $(document).trigger(Pixelated.events.mail.appendAttachment, stubAttachment);
             expect(this.component.attr.attachments).toEqual([stubAttachment]);
 
             var anotherStubAttachment = {attachment_id: 'faked 2'};
-            $(document).trigger(Pixelated.events.mail.uploadedAttachment, anotherStubAttachment);
+            $(document).trigger(Pixelated.events.mail.appendAttachment, anotherStubAttachment);
             expect(this.component.attr.attachments).toEqual([stubAttachment, anotherStubAttachment]);
         });
 
-        it('should render attachment list view based on uploadedAttachment event', function () {
-            var stubAttachment = {attachment_id: 'faked', filename: 'haha.txt', filesize: 4500};
-
-            $(document).trigger(Pixelated.events.mail.uploadedAttachment, stubAttachment);
-
-            var expected_li = '<a href="/attachment/faked?filename=haha.txt&amp;encoding=base64">haha.txt (4.39 Kb)</a>';
-            expect(this.component.select('attachmentListItem').html()).toEqual(expected_li);
-        });
-
-        xit('should start uploading attachments', function () {
-            var stubAttachment = {attachment_id: 'faked', filename: 'haha.txt', filesize: 4500};
-            var mockAjax = spyOn($, 'ajax').and.callFake(function (params) {params.success(stubAttachment);});
-            var uploadedAttachment = spyOnEvent(document, Pixelated.events.mail.uploadedAttachment);
-            var uploading = spyOnEvent(document, Pixelated.events.mail.uploadingAttachment);
-
-            $(document).trigger(Pixelated.events.mail.startUploadAttachment);
-
-            expect(mockAjax).toHaveBeenCalled();
-            expect(uploadedAttachment).toHaveBeenTriggeredOnAndWith(document, stubAttachment);
-            expect(uploading).toHaveBeenTriggeredOn(document);
-        });
-
     });
 
 });
diff --git a/web-ui/test/spec/mail_view/ui/attachment.spec.js b/web-ui/test/spec/mail_view/ui/attachment_icon.spec.js
index d29660b9..d29660b9 100644
--- a/web-ui/test/spec/mail_view/ui/attachment.spec.js
+++ b/web-ui/test/spec/mail_view/ui/attachment_icon.spec.js
diff --git a/web-ui/test/spec/mail_view/ui/attachment_list.spec.js b/web-ui/test/spec/mail_view/ui/attachment_list.spec.js
new file mode 100644
index 00000000..c66b959c
--- /dev/null
+++ b/web-ui/test/spec/mail_view/ui/attachment_list.spec.js
@@ -0,0 +1,44 @@
+describeComponent('mail_view/ui/attachment_list', function () {
+    'use strict';
+
+    describe('initialization', function () {
+        beforeEach(function () {
+            this.setupComponent('<div id="attachment-list">' +
+                '<ul><li id="attachment-list-item"> </li></ul>' +
+                '</div>');
+        });
+
+        it('should trigger add attachment event', function () {
+            var triggerUploadAttachment = spyOnEvent(document, Pixelated.events.mail.appendAttachment);
+            var stubAttachment = {attachment_id: 'faked'};
+
+            $(document).trigger(Pixelated.events.mail.uploadedAttachment, stubAttachment);
+
+            expect(triggerUploadAttachment).toHaveBeenTriggeredOnAndWith(document, stubAttachment);
+        });
+
+        it('should render attachment list view based on uploadedAttachment event', function () {
+            var stubAttachment = {attachment_id: 'faked', filename: 'haha.txt', filesize: 4500};
+
+            $(document).trigger(Pixelated.events.mail.uploadedAttachment, stubAttachment);
+
+            var expected_li = '<a href="/attachment/faked?filename=haha.txt&amp;encoding=base64">haha.txt (4.39 Kb)</a>';
+            expect(this.component.select('attachmentListItem').html()).toEqual(expected_li);
+        });
+
+        xit('should start uploading attachments', function () {
+            var stubAttachment = {attachment_id: 'faked', filename: 'haha.txt', filesize: 4500};
+            var mockAjax = spyOn($, 'ajax').and.callFake(function (params) {params.success(stubAttachment);});
+            var uploadedAttachment = spyOnEvent(document, Pixelated.events.mail.uploadedAttachment);
+            var uploading = spyOnEvent(document, Pixelated.events.mail.uploadingAttachment);
+
+            $(document).trigger(Pixelated.events.mail.startUploadAttachment);
+
+            expect(mockAjax).toHaveBeenCalled();
+            expect(uploadedAttachment).toHaveBeenTriggeredOnAndWith(document, stubAttachment);
+            expect(uploading).toHaveBeenTriggeredOn(document);
+        });
+
+    });
+
+});