@@ -6,32 +6,48 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
66Please see LICENSE files in the repository root for full details.
77*/
88
9+ import * as fs from "node:fs" ;
10+
911import type { Page } from "@playwright/test" ;
1012import { test , expect } from "../../element-web-test" ;
1113import { ElementAppPage } from "../../pages/ElementAppPage" ;
14+ import { Credentials } from "../../plugins/homeserver" ;
1215
1316const STICKER_PICKER_WIDGET_ID = "fake-sticker-picker" ;
1417const STICKER_PICKER_WIDGET_NAME = "Fake Stickers" ;
1518const STICKER_NAME = "Test Sticker" ;
1619const ROOM_NAME_1 = "Sticker Test" ;
1720const ROOM_NAME_2 = "Sticker Test Two" ;
18- const STICKER_MESSAGE = JSON . stringify ( {
19- action : "m.sticker" ,
20- api : "fromWidget" ,
21- data : {
22- name : "teststicker" ,
23- description : STICKER_NAME ,
24- file : "test.png" ,
25- content : {
26- body : STICKER_NAME ,
27- msgtype : "m.sticker" ,
28- url : "mxc://localhost/somewhere" ,
21+ const STICKER_IMAGE = fs . readFileSync ( "playwright/sample-files/riot.png" ) ;
22+
23+ function getStickerMessage ( contentUri : string , mimetype : string ) : string {
24+ return JSON . stringify ( {
25+ action : "m.sticker" ,
26+ api : "fromWidget" ,
27+ data : {
28+ name : "teststicker" ,
29+ description : STICKER_NAME ,
30+ file : "test.png" ,
31+ content : {
32+ body : STICKER_NAME ,
33+ info : {
34+ h : 480 ,
35+ mimetype : mimetype ,
36+ size : 13818 ,
37+ w : 480 ,
38+ } ,
39+ msgtype : "m.sticker" ,
40+ url : contentUri ,
41+ } ,
2942 } ,
30- } ,
31- requestId : "1" ,
32- widgetId : STICKER_PICKER_WIDGET_ID ,
33- } ) ;
34- const WIDGET_HTML = `
43+ requestId : "1" ,
44+ widgetId : STICKER_PICKER_WIDGET_ID ,
45+ } ) ;
46+ }
47+
48+ function getWidgetHtml ( contentUri : string , mimetype : string ) {
49+ const stickerMessage = getStickerMessage ( contentUri , mimetype ) ;
50+ return `
3551 <html lang="en">
3652 <head>
3753 <title>Fake Sticker Picker</title>
@@ -51,13 +67,13 @@ const WIDGET_HTML = `
5167 <button name="Send" id="sendsticker">Press for sticker</button>
5268 <script>
5369 document.getElementById('sendsticker').onclick = () => {
54- window.parent.postMessage(${ STICKER_MESSAGE }
70+ window.parent.postMessage(${ stickerMessage }
5571 };
5672 </script>
5773 </body>
5874 </html>
5975` ;
60-
76+ }
6177async function openStickerPicker ( app : ElementAppPage ) {
6278 const options = await app . openMessageComposerOptions ( ) ;
6379 await options . getByRole ( "menuitem" , { name : "Sticker" } ) . click ( ) ;
@@ -71,7 +87,8 @@ async function sendStickerFromPicker(page: Page) {
7187 await expect ( page . locator ( ".mx_AppTileFullWidth#stickers" ) ) . not . toBeVisible ( ) ;
7288}
7389
74- async function expectTimelineSticker ( page : Page , roomId : string ) {
90+ async function expectTimelineSticker ( page : Page , roomId : string , contentUri : string ) {
91+ const contentId = contentUri . split ( "/" ) . slice ( - 1 ) [ 0 ] ;
7592 // Make sure it's in the right room
7693 await expect ( page . locator ( ".mx_EventTile_sticker > a" ) ) . toHaveAttribute ( "href" , new RegExp ( `/${ roomId } ) ) ;
7794
@@ -80,13 +97,43 @@ async function expectTimelineSticker(page: Page, roomId: string) {
8097 // download URL.
8198 await expect ( page . locator ( `img[alt="${ STICKER_NAME } ) ) . toHaveAttribute (
8299 "src" ,
83- new RegExp ( "/download/ localhost/somewhere" ) ,
100+ new RegExp ( `/ localhost/${ contentId } ` ) ,
84101 ) ;
85102}
86103
104+ async function expectFileTile ( page : Page , roomId : string , contentUri : string ) {
105+ await expect ( page . locator ( ".mx_MFileBody_info_filename" ) ) . toContainText ( STICKER_NAME ) ;
106+ }
107+
108+ async function setWidgetAccountData (
109+ app : ElementAppPage ,
110+ user : Credentials ,
111+ stickerPickerUrl : string ,
112+ provideCreatorUserId : boolean = true ,
113+ ) {
114+ await app . client . setAccountData ( "m.widgets" , {
115+ [ STICKER_PICKER_WIDGET_ID ] : {
116+ content : {
117+ type : "m.stickerpicker" ,
118+ name : STICKER_PICKER_WIDGET_NAME ,
119+ url : stickerPickerUrl ,
120+ creatorUserId : provideCreatorUserId ? user . userId : undefined ,
121+ } ,
122+ sender : user . userId ,
123+ state_key : STICKER_PICKER_WIDGET_ID ,
124+ type : "m.widget" ,
125+ id : STICKER_PICKER_WIDGET_ID ,
126+ } ,
127+ } ) ;
128+ }
129+
87130test . describe ( "Stickers" , ( ) => {
88131 test . use ( {
89132 displayName : "Sally" ,
133+ room : async ( { app } , use ) => {
134+ const roomId = await app . client . createRoom ( { name : ROOM_NAME_1 } ) ;
135+ await use ( { roomId } ) ;
136+ } ,
90137 } ) ;
91138
92139 // We spin up a web server for the sticker picker so that we're not testing to see if
@@ -96,66 +143,60 @@ test.describe("Stickers", () => {
96143 //
97144 // See sendStickerFromPicker() for more detail on iframe comms.
98145 let stickerPickerUrl : string ;
99- test . beforeEach ( async ( { webserver } ) => {
100- stickerPickerUrl = webserver . start ( WIDGET_HTML ) ;
101- } ) ;
102146
103- test ( "should send a sticker to multiple rooms" , async ( { page, app, user } ) => {
104- const roomId1 = await app . client . createRoom ( { name : ROOM_NAME_1 } ) ;
147+ test ( "should send a sticker to multiple rooms" , async ( { webserver, page, app, user, room } ) => {
105148 const roomId2 = await app . client . createRoom ( { name : ROOM_NAME_2 } ) ;
106-
107- await app . client . setAccountData ( "m.widgets" , {
108- [ STICKER_PICKER_WIDGET_ID ] : {
109- content : {
110- type : "m.stickerpicker" ,
111- name : STICKER_PICKER_WIDGET_NAME ,
112- url : stickerPickerUrl ,
113- creatorUserId : user . userId ,
114- } ,
115- sender : user . userId ,
116- state_key : STICKER_PICKER_WIDGET_ID ,
117- type : "m.widget" ,
118- id : STICKER_PICKER_WIDGET_ID ,
119- } ,
120- } ) ;
149+ const { content_uri : contentUri } = await app . client . uploadContent ( STICKER_IMAGE , { type : "image/png" } ) ;
150+ const widgetHtml = getWidgetHtml ( contentUri , "image/png" ) ;
151+ stickerPickerUrl = webserver . start ( widgetHtml ) ;
152+ setWidgetAccountData ( app , user , stickerPickerUrl ) ;
121153
122154 await app . viewRoomByName ( ROOM_NAME_1 ) ;
123- await expect ( page ) . toHaveURL ( `/#/room/${ roomId1 } ) ;
155+ await expect ( page ) . toHaveURL ( `/#/room/${ room . roomId } ) ;
124156 await openStickerPicker ( app ) ;
125157 await sendStickerFromPicker ( page ) ;
126- await expectTimelineSticker ( page , roomId1 ) ;
158+ await expectTimelineSticker ( page , room . roomId , contentUri ) ;
127159
128160 // Ensure that when we switch to a different room that the sticker
129161 // goes to the right place
130162 await app . viewRoomByName ( ROOM_NAME_2 ) ;
131163 await expect ( page ) . toHaveURL ( `/#/room/${ roomId2 } ) ;
132164 await openStickerPicker ( app ) ;
133165 await sendStickerFromPicker ( page ) ;
134- await expectTimelineSticker ( page , roomId2 ) ;
166+ await expectTimelineSticker ( page , roomId2 , contentUri ) ;
135167 } ) ;
136168
137- test ( "should handle a sticker picker widget missing creatorUserId" , async ( { page, app, user } ) => {
138- const roomId1 = await app . client . createRoom ( { name : ROOM_NAME_1 } ) ;
169+ test ( "should handle a sticker picker widget missing creatorUserId" , async ( {
170+ webserver,
171+ page,
172+ app,
173+ user,
174+ room,
175+ } ) => {
176+ const { content_uri : contentUri } = await app . client . uploadContent ( STICKER_IMAGE , { type : "image/png" } ) ;
177+ const widgetHtml = getWidgetHtml ( contentUri , "image/png" ) ;
178+ stickerPickerUrl = webserver . start ( widgetHtml ) ;
179+ setWidgetAccountData ( app , user , stickerPickerUrl , false ) ;
139180
140- await app . client . setAccountData ( "m.widgets" , {
141- [ STICKER_PICKER_WIDGET_ID ] : {
142- content : {
143- type : "m.stickerpicker" ,
144- name : STICKER_PICKER_WIDGET_NAME ,
145- url : stickerPickerUrl ,
146- // No creatorUserId
147- } ,
148- sender : user . userId ,
149- state_key : STICKER_PICKER_WIDGET_ID ,
150- type : "m.widget" ,
151- id : STICKER_PICKER_WIDGET_ID ,
152- } ,
181+ await app . viewRoomByName ( ROOM_NAME_1 ) ;
182+ await expect ( page ) . toHaveURL ( `/#/room/${ room . roomId } ) ;
183+ await openStickerPicker ( app ) ;
184+ await sendStickerFromPicker ( page ) ;
185+ await expectTimelineSticker ( page , room . roomId , contentUri ) ;
186+ } ) ;
187+
188+ test ( "should render invalid mimetype as a file" , async ( { webserver, page, app, user, room } ) => {
189+ const { content_uri : contentUri } = await app . client . uploadContent ( STICKER_IMAGE , {
190+ type : "application/octet-stream" ,
153191 } ) ;
192+ const widgetHtml = getWidgetHtml ( contentUri , "application/octet-stream" ) ;
193+ stickerPickerUrl = webserver . start ( widgetHtml ) ;
194+ setWidgetAccountData ( app , user , stickerPickerUrl ) ;
154195
155196 await app . viewRoomByName ( ROOM_NAME_1 ) ;
156- await expect ( page ) . toHaveURL ( `/#/room/${ roomId1 } ) ;
197+ await expect ( page ) . toHaveURL ( `/#/room/${ room . roomId } ) ;
157198 await openStickerPicker ( app ) ;
158199 await sendStickerFromPicker ( page ) ;
159- await expectTimelineSticker ( page , roomId1 ) ;
200+ await expectFileTile ( page , room . roomId , contentUri ) ;
160201 } ) ;
161202} ) ;
0 commit comments