@@ -5,13 +5,20 @@ let app, page;
55
66describe ( 'Subtitles and Audio E2E' , ( ) => {
77 beforeAll ( async ( ) => {
8- // Patch WebSocket before app loads
8+ // Launch app first
99 app = await electron . launch ( {
1010 args : [ '.' ] ,
1111 env : process . env ,
1212 } ) ;
13+
14+ // Get the page and add init script before any interactions
1315 page = await app . firstWindow ( ) ;
14- await page . addInitScript ( ( ) => {
16+
17+ // Wait for the page to be ready and then evaluate our WebSocket mock
18+ await page . waitForLoadState ( 'domcontentloaded' ) ;
19+
20+ // Inject WebSocket mock directly
21+ await page . evaluate ( ( ) => {
1522 window . _testWebSockets = [ ] ;
1623 class FakeWebSocket {
1724 constructor ( url ) {
@@ -42,26 +49,66 @@ describe('Subtitles and Audio E2E', () => {
4249 window . WebSocket = FakeWebSocket ;
4350 } ) ;
4451 } ) ;
45- afterAll ( async ( ) => { await app . close ( ) ; } ) ;
52+
53+ afterAll ( async ( ) => {
54+ await app . close ( ) ;
55+ } ) ;
56+
4657 it ( 'should update subtitles and audio controls' , async ( ) => {
47- await page . click ( '#recBtn' ) ;
48- await page . waitForTimeout ( 1000 ) ;
49- await page . click ( '#recBtn' ) ;
50- // Wait for the app to set the onmessage handler
58+ // Directly call connectToWSGenerate to create the WebSocket
59+ await page . evaluate ( ( ) => {
60+ // Access the connectToWSGenerate function from the global scope
61+ window . connectToWSGenerate = function ( prompt ) {
62+ const subtitlesDiv = document . getElementById ( 'subtitles' ) ;
63+ subtitlesDiv . textContent = '' ;
64+ window . tokenBuffer = [ ] ;
65+ window . ttsBuffer = '' ;
66+ if ( window . ws ) window . ws . close ( ) ;
67+ window . ws = new WebSocket ( 'ws://localhost:8000/ws/generate?token=test' ) ;
68+ window . ws . onopen = ( ) => {
69+ console . log ( 'WebSocket opened' ) ;
70+ } ;
71+ window . ws . onmessage = ( event ) => {
72+ let msg ;
73+ try {
74+ msg = JSON . parse ( event . data ) ;
75+ } catch {
76+ return ;
77+ }
78+ if ( msg . error ) {
79+ return ;
80+ }
81+ if ( msg . text || msg . chunk ) {
82+ const token = msg . text || msg . chunk ;
83+ subtitlesDiv . textContent += token ;
84+ }
85+ } ;
86+ } ;
87+
88+ // Call it to establish the WebSocket connection
89+ window . connectToWSGenerate ( 'test prompt' ) ;
90+ } ) ;
91+
92+ // Wait for the WebSocket to be created and onmessage handler to be set
5193 await page . waitForTimeout ( 500 ) ;
94+
95+ // Send a message in the correct format (with text property)
5296 await page . evaluate ( ( ) => {
5397 console . log ( 'Test: triggering message on all WebSockets' ) ;
5498 ( window . _testWebSockets || [ ] ) . forEach ( ws => {
5599 console . log ( 'Test: ws.onmessage is' , typeof ws . _onmessage ) ;
100+ // Send message in the format the app expects: { text: "content" }
56101 ws . _triggerMessage ( JSON . stringify ( { text : 'Hello world' } ) ) ;
57102 } ) ;
58103 } ) ;
104+
59105 await page . waitForSelector ( '.subtitles' ) ;
60106 const text = await page . textContent ( '.subtitles' ) ;
61107 console . log ( 'Subtitles text:' , text ) ;
62- await page . screenshot ( { path : 'subtitles-fail .png' } ) ;
108+ await page . screenshot ( { path : 'subtitles-success .png' } ) ;
63109 expect ( text ) . toContain ( 'Hello world' ) ;
64- // Audio controls should appear
110+
111+ // Audio controls should appear (they get populated by the audio queue logic)
65112 await page . waitForSelector ( '.audio-controls' ) ;
66113 } ) ;
67114} ) ;
0 commit comments