From 69904456df86b7deb0a3627ce90d391e12027957 Mon Sep 17 00:00:00 2001 From: Zita Szupera Date: Wed, 17 Nov 2021 10:12:52 +0100 Subject: [PATCH] fix: Empty messages can be sent #133 --- package-lock.json | 14 ++++----- package.json | 2 +- projects/stream-chat-angular/package.json | 2 +- .../message-input.component.html | 7 ++++- .../message-input.component.spec.ts | 29 ++++++++++++++++--- .../message-input/message-input.component.ts | 5 +++- 6 files changed, 44 insertions(+), 15 deletions(-) diff --git a/package-lock.json b/package-lock.json index 8da79ac7..bf1a73b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,7 +25,7 @@ "pretty-bytes": "^5.6.0", "rxjs": "~6.6.0", "stream-chat": "^4.3.0", - "stream-chat-css": "^1.0.22", + "stream-chat-css": "^1.0.23", "ts-node": "^10.2.1", "tslib": "^2.3.0", "uuidv4": "^6.2.12", @@ -24263,9 +24263,9 @@ } }, "node_modules/stream-chat-css": { - "version": "1.0.22", - "resolved": "https://registry.npmjs.org/stream-chat-css/-/stream-chat-css-1.0.22.tgz", - "integrity": "sha512-id9DDyS1GLZo60/59av6G7yMsKC/hWLhpiEUMQDg36CB4TkCGKCak27A+htej25xvqbqmgVNFKWlatFBvU8xDg==" + "version": "1.0.23", + "resolved": "https://registry.npmjs.org/stream-chat-css/-/stream-chat-css-1.0.23.tgz", + "integrity": "sha512-ab7NFnFKbhAm8dbCzRPiSyfhGHXlbwro5Q/BxXhjLCdalEUN3dRvHOmW7mqWY7TdloJAs+3QTM9ORNxDTV7usg==" }, "node_modules/stream-chat/node_modules/form-data": { "version": "4.0.0", @@ -45392,9 +45392,9 @@ } }, "stream-chat-css": { - "version": "1.0.22", - "resolved": "https://registry.npmjs.org/stream-chat-css/-/stream-chat-css-1.0.22.tgz", - "integrity": "sha512-id9DDyS1GLZo60/59av6G7yMsKC/hWLhpiEUMQDg36CB4TkCGKCak27A+htej25xvqbqmgVNFKWlatFBvU8xDg==" + "version": "1.0.23", + "resolved": "https://registry.npmjs.org/stream-chat-css/-/stream-chat-css-1.0.23.tgz", + "integrity": "sha512-ab7NFnFKbhAm8dbCzRPiSyfhGHXlbwro5Q/BxXhjLCdalEUN3dRvHOmW7mqWY7TdloJAs+3QTM9ORNxDTV7usg==" }, "stream-combiner2": { "version": "1.1.1", diff --git a/package.json b/package.json index 001b4885..cc0338a7 100644 --- a/package.json +++ b/package.json @@ -81,7 +81,7 @@ "pretty-bytes": "^5.6.0", "rxjs": "~6.6.0", "stream-chat": "^4.3.0", - "stream-chat-css": "^1.0.22", + "stream-chat-css": "^1.0.23", "ts-node": "^10.2.1", "tslib": "^2.3.0", "uuidv4": "^6.2.12", diff --git a/projects/stream-chat-angular/package.json b/projects/stream-chat-angular/package.json index 3101f601..c132eb31 100644 --- a/projects/stream-chat-angular/package.json +++ b/projects/stream-chat-angular/package.json @@ -13,7 +13,7 @@ "@angular/core": "^12.2.0 || ^13.0.0", "@ngx-translate/core": "^13.0.0 || ^14.0.0", "stream-chat": "^4.3.0", - "stream-chat-css": "^1.0.22" + "stream-chat-css": "^1.0.23" }, "dependencies": { "@ctrl/ngx-emoji-mart": "^6.0.1", diff --git a/projects/stream-chat-angular/src/lib/message-input/message-input.component.html b/projects/stream-chat-angular/src/lib/message-input/message-input.component.html index 008cb37c..da6a04f8 100644 --- a/projects/stream-chat-angular/src/lib/message-input/message-input.component.html +++ b/projects/stream-chat-angular/src/lib/message-input/message-input.component.html @@ -1,4 +1,9 @@ -
+
{ const spy = jasmine.createSpy(); component.messageUpdate.subscribe(spy); component.message = mockMessage(); + fixture.detectChanges(); updateMessageSpy.and.rejectWith(new Error('Error')); await component.messageSent(new KeyboardEvent('keydown', { key: 'Enter' })); @@ -147,6 +148,7 @@ describe('MessageInputComponent', () => { it('should emit #messageUpdate event if message update was successful', async () => { component.message = mockMessage(); + fixture.detectChanges(); const spy = jasmine.createSpy(); component.messageUpdate.subscribe(spy); await component.messageSent(new KeyboardEvent('keydown', { key: 'Enter' })); @@ -265,13 +267,10 @@ describe('MessageInputComponent', () => { { file, state: 'success', url: 'url/to/image' }, ]); const files = [file]; - attachmentService.resetAttachmentUploads.and.returnValue([]); - attachmentService.mapToAttachments.and.returnValue([]); await component.filesSelected(files as any as FileList); await component.messageSent(); - await component.messageSent(); - expect(sendMessageSpy).toHaveBeenCalledWith(jasmine.any(String), []); + expect(attachmentService.resetAttachmentUploads).toHaveBeenCalledWith(); }); it(`shouldn't send message, if file uploads are in progress`, async () => { @@ -372,4 +371,26 @@ describe('MessageInputComponent', () => { attachments ); }); + + it(`shouldn't send empty message`, () => { + const textarea = queryTextarea(); + const event = new KeyboardEvent('keydown', { key: 'Enter' }); + spyOn(event, 'preventDefault'); + textarea?.dispatchEvent(event); + fixture.detectChanges(); + + expect(sendMessageSpy).not.toHaveBeenCalled(); + expect(event.preventDefault).toHaveBeenCalledWith(); + }); + + it('should apply CSS class if attachments are present', () => { + const cssClass = 'str-chat__input-flat-has-attachments'; + + expect(nativeElement.querySelector(`.${cssClass}`)).toBeNull(); + + attachmentService.attachmentUploads$.next([{} as any as AttachmentUpload]); + fixture.detectChanges(); + + expect(nativeElement.querySelector(`.${cssClass}`)).not.toBeNull(); + }); }); diff --git a/projects/stream-chat-angular/src/lib/message-input/message-input.component.ts b/projects/stream-chat-angular/src/lib/message-input/message-input.component.ts index 435c795a..371ec114 100644 --- a/projects/stream-chat-angular/src/lib/message-input/message-input.component.ts +++ b/projects/stream-chat-angular/src/lib/message-input/message-input.component.ts @@ -111,8 +111,11 @@ export class MessageInputComponent implements OnChanges, OnDestroy { } return; } - const text = this.messageInput.nativeElement.value; const attachments = this.attachmentService.mapToAttachments(); + const text = this.messageInput.nativeElement.value; + if (!text && (!attachments || attachments.length === 0)) { + return; + } if (!this.isUpdate) { this.messageInput.nativeElement.value = ''; }