Skip to content

Commit 07a344e

Browse files
authored
Merge pull request #454 from Cognigy/feature/65064-add-tests-file-attachments
Feature/65064 add tests file attachments
2 parents 6d4864a + 2550157 commit 07a344e

File tree

4 files changed

+185
-2
lines changed

4 files changed

+185
-2
lines changed

Diff for: cypress/e2e/fileAttachements.cy.ts

+182
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,182 @@
1+
describe("File Attachement", () => {
2+
beforeEach(() => {
3+
cy.visitWebchat();
4+
});
5+
6+
it("button should not be visible by default", () => {
7+
cy.initMockWebchat().openWebchat().startConversation();
8+
cy.get("#webchatInputMessageAttachFileButton").should("not.exist");
9+
});
10+
11+
it("button should be visible when the setting is enabled", () => {
12+
cy.initMockWebchat({
13+
settings: {
14+
fileStorageSettings: {
15+
enabled: true,
16+
},
17+
},
18+
});
19+
cy.openWebchat().startConversation();
20+
cy.get("#webchatInputMessageAttachFileButton").should("be.visible");
21+
});
22+
23+
it("button should not be visible when the setting is disabled", () => {
24+
cy.initMockWebchat({
25+
settings: {
26+
fileStorageSettings: {
27+
enabled: false,
28+
},
29+
},
30+
});
31+
cy.openWebchat().startConversation();
32+
cy.get("#webchatInputMessageAttachFileButton").should("not.exist");
33+
});
34+
35+
it("upload should fail if file storage provider not configured", () => {
36+
cy.initMockWebchat({
37+
settings: {
38+
fileStorageSettings: {
39+
enabled: true,
40+
},
41+
},
42+
});
43+
cy.openWebchat().startConversation();
44+
cy.get("input[type=file]").selectFile(
45+
{
46+
contents: Cypress.Buffer.from("file contents"),
47+
fileName: "myfile.txt",
48+
mimeType: "text/plain",
49+
lastModified: Date.now(),
50+
},
51+
{ force: true },
52+
);
53+
cy.get("#filePreview0").contains("Upload Failed");
54+
});
55+
56+
it("upload failure should disable the send button", () => {
57+
cy.initMockWebchat({
58+
settings: {
59+
fileStorageSettings: {
60+
enabled: true,
61+
},
62+
},
63+
});
64+
cy.openWebchat().startConversation();
65+
cy.get("input[type=file]").selectFile(
66+
{
67+
contents: Cypress.Buffer.from("file contents"),
68+
fileName: "myfile.txt",
69+
mimeType: "text/plain",
70+
lastModified: Date.now(),
71+
},
72+
{ force: true },
73+
);
74+
cy.get("#webchatInputMessageSendMessageButton").should("be.disabled");
75+
});
76+
77+
it("should be able to upload multiple files", () => {
78+
cy.initMockWebchat({
79+
settings: {
80+
fileStorageSettings: {
81+
enabled: true,
82+
},
83+
},
84+
});
85+
cy.openWebchat().startConversation();
86+
cy.get("input[type=file]").selectFile(
87+
[
88+
{
89+
contents: Cypress.Buffer.from("file contents"),
90+
fileName: "myfile.txt",
91+
mimeType: "text/plain",
92+
lastModified: Date.now(),
93+
},
94+
{
95+
contents: Cypress.Buffer.from("file contents"),
96+
fileName: "myfile2.txt",
97+
mimeType: "text/plain",
98+
lastModified: Date.now(),
99+
},
100+
],
101+
{ force: true },
102+
);
103+
cy.get("#filePreview0").contains("Upload Failed");
104+
cy.get("#filePreview1").contains("Upload Failed");
105+
});
106+
107+
it("should be removable from the list by clicking remove button", () => {
108+
cy.initMockWebchat({
109+
settings: {
110+
fileStorageSettings: {
111+
enabled: true,
112+
},
113+
},
114+
});
115+
cy.openWebchat().startConversation();
116+
cy.get("input[type=file]")
117+
.selectFile(
118+
{
119+
contents: Cypress.Buffer.from("file contents"),
120+
fileName: "myfile.txt",
121+
mimeType: "text/plain",
122+
lastModified: Date.now(),
123+
},
124+
{ force: true },
125+
)
126+
.then(() => {
127+
cy.get("#filePreview0").contains("myfile.txt");
128+
cy.get("[aria-label='Remove File Attachment 1']").click();
129+
cy.get("#filePreview0").should("not.exist");
130+
});
131+
});
132+
133+
it("should be possible by drag and drop action", () => {
134+
cy.initMockWebchat({
135+
settings: {
136+
fileStorageSettings: {
137+
enabled: true,
138+
},
139+
},
140+
});
141+
cy.openWebchat().startConversation();
142+
cy.get("input[type=file]").selectFile(
143+
{
144+
contents: Cypress.Buffer.from("file contents"),
145+
fileName: "myfile.txt",
146+
mimeType: "text/plain",
147+
lastModified: Date.now(),
148+
},
149+
{ action: "drag-drop", force: true },
150+
);
151+
cy.get("#filePreview0").contains("Upload Failed");
152+
});
153+
154+
it("drop zone should have the default drop text", () => {
155+
cy.initMockWebchat({
156+
settings: {
157+
fileStorageSettings: {
158+
enabled: true,
159+
},
160+
},
161+
});
162+
cy.openWebchat().startConversation();
163+
cy.get("#webchatChatHistory").trigger("dragenter");
164+
cy.get("#dropzoneContent").contains("Drop to attach");
165+
});
166+
167+
it("drop zone should have the default drop text", () => {
168+
cy.initMockWebchat({
169+
settings: {
170+
fileStorageSettings: {
171+
enabled: true,
172+
dropzoneText: "Please drop here",
173+
},
174+
},
175+
});
176+
cy.openWebchat().startConversation();
177+
cy.get("#webchatChatHistory").trigger("dragenter");
178+
cy.get("#dropzoneContent").contains("Please drop here");
179+
});
180+
181+
// TODO: Add test for successful file upload
182+
});

Diff for: src/webchat-ui/components/WebchatUI.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -1190,6 +1190,7 @@ export class WebchatUI extends React.PureComponent<
11901190
className="webchat-chat-history"
11911191
tabIndex={messages?.length === 0 ? -1 : 0} // When no messages, remove chat history from tab order
11921192
onDragEnter={handleDragEnter}
1193+
id="webchatChatHistory"
11931194
>
11941195
<h2 className="sr-only" id="webchatChatHistoryHeading">
11951196
Chat History

Diff for: src/webchat-ui/components/plugins/input/file/DropZone.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ const DropZone: FC<IDropZoneProps> = props => {
7272
return (
7373
<>
7474
<DropZoneRoot>
75-
<DropZoneContent>
75+
<DropZoneContent id="dropzoneContent">
7676
<AttachFileIcon />
7777
<DragDropTypography
7878
variant="title1-regular"

Diff for: src/webchat-ui/components/plugins/input/file/PreviewUploadedFiles.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ const PreviewUploadedFiles: FC = () => {
9595
return (
9696
<UploadedFilesContainer>
9797
{fileList?.map((item, index) => (
98-
<FilePreviewWrapper key={index}>
98+
<FilePreviewWrapper key={index} id={`filePreview${index}`}>
9999
<UploadedFilePreview>
100100
<RemoveFileButton
101101
onClick={() => onRemoveFileButtonClick(index)}

0 commit comments

Comments
 (0)