@@ -88,28 +88,6 @@ const test = base.extend<TestFixtures>({
8888 }
8989} ) ;
9090
91- async function startAndCallConnectTool ( browserWithExtension : BrowserWithExtension , startClient : StartClient ) : Promise < Client > {
92- const { client } = await startClient ( {
93- args : [ `--connect-tool` ] ,
94- config : {
95- browser : {
96- userDataDir : browserWithExtension . userDataDir ,
97- }
98- } ,
99- } ) ;
100-
101- expect ( await client . callTool ( {
102- name : 'browser_connect' ,
103- arguments : {
104- name : 'extension'
105- }
106- } ) ) . toHaveResponse ( {
107- result : 'Successfully changed connection method.' ,
108- } ) ;
109-
110- return client ;
111- }
112-
11391async function startWithExtensionFlag ( browserWithExtension : BrowserWithExtension , startClient : StartClient ) : Promise < Client > {
11492 const { client } = await startClient ( {
11593 args : [ `--extension` ] ,
@@ -137,144 +115,137 @@ const testWithOldExtensionVersion = test.extend({
137115 } ,
138116} ) ;
139117
140- for ( const [ mode , startClientMethod ] of [
141- [ 'connect-tool' , startAndCallConnectTool ] ,
142- [ 'extension-flag' , startWithExtensionFlag ] ,
143- ] as const ) {
144-
145- test ( `navigate with extension (${ mode } )` , async ( { browserWithExtension, startClient, server } ) => {
146- const browserContext = await browserWithExtension . launch ( ) ;
118+ test ( `navigate with extension` , async ( { browserWithExtension, startClient, server } ) => {
119+ const browserContext = await browserWithExtension . launch ( ) ;
147120
148- const client = await startClientMethod ( browserWithExtension , startClient ) ;
121+ const client = await startWithExtensionFlag ( browserWithExtension , startClient ) ;
149122
150- const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
151- return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
152- } ) ;
123+ const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
124+ return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
125+ } ) ;
153126
154- const navigateResponse = client . callTool ( {
155- name : 'browser_navigate' ,
156- arguments : { url : server . HELLO_WORLD } ,
157- } ) ;
127+ const navigateResponse = client . callTool ( {
128+ name : 'browser_navigate' ,
129+ arguments : { url : server . HELLO_WORLD } ,
130+ } ) ;
158131
159- const selectorPage = await confirmationPagePromise ;
160- // For browser_navigate command, the UI shows Allow/Reject buttons instead of tab selector
161- await selectorPage . getByRole ( 'button' , { name : 'Allow' } ) . click ( ) ;
132+ const selectorPage = await confirmationPagePromise ;
133+ // For browser_navigate command, the UI shows Allow/Reject buttons instead of tab selector
134+ await selectorPage . getByRole ( 'button' , { name : 'Allow' } ) . click ( ) ;
162135
163- expect ( await navigateResponse ) . toHaveResponse ( {
164- pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
165- } ) ;
136+ expect ( await navigateResponse ) . toHaveResponse ( {
137+ pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
166138 } ) ;
139+ } ) ;
167140
168- test ( `snapshot of an existing page (${ mode } )` , async ( { browserWithExtension, startClient, server } ) => {
169- const browserContext = await browserWithExtension . launch ( ) ;
170-
171- const page = await browserContext . newPage ( ) ;
172- await page . goto ( server . HELLO_WORLD ) ;
141+ test ( `snapshot of an existing page` , async ( { browserWithExtension, startClient, server } ) => {
142+ const browserContext = await browserWithExtension . launch ( ) ;
173143
174- // Another empty page.
175- await browserContext . newPage ( ) ;
176- expect ( browserContext . pages ( ) ) . toHaveLength ( 3 ) ;
144+ const page = await browserContext . newPage ( ) ;
145+ await page . goto ( server . HELLO_WORLD ) ;
177146
178- const client = await startClientMethod ( browserWithExtension , startClient ) ;
179- expect ( browserContext . pages ( ) ) . toHaveLength ( 3 ) ;
147+ // Another empty page.
148+ await browserContext . newPage ( ) ;
149+ expect ( browserContext . pages ( ) ) . toHaveLength ( 3 ) ;
180150
181- const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
182- return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
183- } ) ;
151+ const client = await startWithExtensionFlag ( browserWithExtension , startClient ) ;
152+ expect ( browserContext . pages ( ) ) . toHaveLength ( 3 ) ;
184153
185- const navigateResponse = client . callTool ( {
186- name : 'browser_snapshot' ,
187- arguments : { } ,
188- } ) ;
154+ const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
155+ return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
156+ } ) ;
189157
190- const selectorPage = await confirmationPagePromise ;
191- expect ( browserContext . pages ( ) ) . toHaveLength ( 4 ) ;
158+ const navigateResponse = client . callTool ( {
159+ name : 'browser_snapshot' ,
160+ arguments : { } ,
161+ } ) ;
192162
193- await selectorPage . locator ( '.tab-item' , { hasText : 'Title' } ) . getByRole ( 'button' , { name : 'Connect' } ) . click ( ) ;
163+ const selectorPage = await confirmationPagePromise ;
164+ expect ( browserContext . pages ( ) ) . toHaveLength ( 4 ) ;
194165
195- expect ( await navigateResponse ) . toHaveResponse ( {
196- pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
197- } ) ;
166+ await selectorPage . locator ( '.tab-item' , { hasText : 'Title' } ) . getByRole ( 'button' , { name : 'Connect' } ) . click ( ) ;
198167
199- expect ( browserContext . pages ( ) ) . toHaveLength ( 4 ) ;
168+ expect ( await navigateResponse ) . toHaveResponse ( {
169+ pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
200170 } ) ;
201171
202- test ( `extension not installed timeout (${ mode } )` , async ( { browserWithExtension, startClient, server, useShortConnectionTimeout } ) => {
203- useShortConnectionTimeout ( 100 ) ;
204-
205- const browserContext = await browserWithExtension . launch ( ) ;
172+ expect ( browserContext . pages ( ) ) . toHaveLength ( 4 ) ;
173+ } ) ;
206174
207- const client = await startClientMethod ( browserWithExtension , startClient ) ;
175+ test ( `extension not installed timeout` , async ( { browserWithExtension, startClient, server, useShortConnectionTimeout } ) => {
176+ useShortConnectionTimeout ( 100 ) ;
208177
209- const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
210- return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
211- } ) ;
178+ const browserContext = await browserWithExtension . launch ( ) ;
212179
213- expect ( await client . callTool ( {
214- name : 'browser_navigate' ,
215- arguments : { url : server . HELLO_WORLD } ,
216- } ) ) . toHaveResponse ( {
217- result : expect . stringContaining ( 'Extension connection timeout. Make sure the "Playwright MCP Bridge" extension is installed.' ) ,
218- isError : true ,
219- } ) ;
180+ const client = await startWithExtensionFlag ( browserWithExtension , startClient ) ;
220181
221- await confirmationPagePromise ;
182+ const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
183+ return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
222184 } ) ;
223185
224- testWithOldExtensionVersion ( `works with old extension version (${ mode } )` , async ( { browserWithExtension, startClient, server, useShortConnectionTimeout } ) => {
225- useShortConnectionTimeout ( 500 ) ;
186+ expect ( await client . callTool ( {
187+ name : 'browser_navigate' ,
188+ arguments : { url : server . HELLO_WORLD } ,
189+ } ) ) . toHaveResponse ( {
190+ result : expect . stringContaining ( 'Extension connection timeout. Make sure the "Playwright MCP Bridge" extension is installed.' ) ,
191+ isError : true ,
192+ } ) ;
226193
227- // Prelaunch the browser, so that it is properly closed after the test.
228- const browserContext = await browserWithExtension . launch ( ) ;
194+ await confirmationPagePromise ;
195+ } ) ;
229196
230- const client = await startClientMethod ( browserWithExtension , startClient ) ;
197+ testWithOldExtensionVersion ( `works with old extension version` , async ( { browserWithExtension, startClient, server, useShortConnectionTimeout } ) => {
198+ useShortConnectionTimeout ( 500 ) ;
231199
232- const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
233- return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
234- } ) ;
200+ // Prelaunch the browser, so that it is properly closed after the test.
201+ const browserContext = await browserWithExtension . launch ( ) ;
235202
236- const navigateResponse = client . callTool ( {
237- name : 'browser_navigate' ,
238- arguments : { url : server . HELLO_WORLD } ,
239- } ) ;
203+ const client = await startWithExtensionFlag ( browserWithExtension , startClient ) ;
240204
241- const selectorPage = await confirmationPagePromise ;
242- // For browser_navigate command, the UI shows Allow/Reject buttons instead of tab selector
243- await selectorPage . getByRole ( 'button' , { name : 'Allow' } ) . click ( ) ;
205+ const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
206+ return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
207+ } ) ;
244208
245- expect ( await navigateResponse ) . toHaveResponse ( {
246- pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
247- } ) ;
209+ const navigateResponse = client . callTool ( {
210+ name : 'browser_navigate' ,
211+ arguments : { url : server . HELLO_WORLD } ,
248212 } ) ;
249213
250- test ( `extension needs update ( ${ mode } )` , async ( { browserWithExtension , startClient , server , useShortConnectionTimeout , overrideProtocolVersion } ) => {
251- useShortConnectionTimeout ( 500 ) ;
252- overrideProtocolVersion ( 1000 ) ;
214+ const selectorPage = await confirmationPagePromise ;
215+ // For browser_navigate command, the UI shows Allow/Reject buttons instead of tab selector
216+ await selectorPage . getByRole ( 'button' , { name : 'Allow' } ) . click ( ) ;
253217
254- // Prelaunch the browser, so that it is properly closed after the test.
255- const browserContext = await browserWithExtension . launch ( ) ;
218+ expect ( await navigateResponse ) . toHaveResponse ( {
219+ pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
220+ } ) ;
221+ } ) ;
256222
257- const client = await startClientMethod ( browserWithExtension , startClient ) ;
223+ test ( `extension needs update` , async ( { browserWithExtension, startClient, server, useShortConnectionTimeout, overrideProtocolVersion } ) => {
224+ useShortConnectionTimeout ( 500 ) ;
225+ overrideProtocolVersion ( 1000 ) ;
258226
259- const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
260- return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
261- } ) ;
227+ // Prelaunch the browser, so that it is properly closed after the test.
228+ const browserContext = await browserWithExtension . launch ( ) ;
262229
263- const navigateResponse = client . callTool ( {
264- name : 'browser_navigate' ,
265- arguments : { url : server . HELLO_WORLD } ,
266- } ) ;
230+ const client = await startWithExtensionFlag ( browserWithExtension , startClient ) ;
267231
268- const confirmationPage = await confirmationPagePromise ;
269- await expect ( confirmationPage . locator ( '.status-banner' ) ) . toContainText ( `Playwright MCP version trying to connect requires newer extension version` ) ;
232+ const confirmationPagePromise = browserContext . waitForEvent ( 'page' , page => {
233+ return page . url ( ) . startsWith ( 'chrome-extension://jakfalbnbhgkpmoaakfflhflbfpkailf/connect.html' ) ;
234+ } ) ;
270235
271- expect ( await navigateResponse ) . toHaveResponse ( {
272- result : expect . stringContaining ( 'Extension connection timeout.' ) ,
273- isError : true ,
274- } ) ;
236+ const navigateResponse = client . callTool ( {
237+ name : 'browser_navigate' ,
238+ arguments : { url : server . HELLO_WORLD } ,
275239 } ) ;
276240
277- }
241+ const confirmationPage = await confirmationPagePromise ;
242+ await expect ( confirmationPage . locator ( '.status-banner' ) ) . toContainText ( `Playwright MCP version trying to connect requires newer extension version` ) ;
243+
244+ expect ( await navigateResponse ) . toHaveResponse ( {
245+ result : expect . stringContaining ( 'Extension connection timeout.' ) ,
246+ isError : true ,
247+ } ) ;
248+ } ) ;
278249
279250test ( `custom executablePath` , async ( { startClient, server, useShortConnectionTimeout } ) => {
280251 useShortConnectionTimeout ( 1000 ) ;
@@ -331,6 +302,4 @@ test(`bypass connection dialog with token`, async ({ browserWithExtension, start
331302 expect ( await navigateResponse ) . toHaveResponse ( {
332303 pageState : expect . stringContaining ( `- generic [active] [ref=e1]: Hello, world!` ) ,
333304 } ) ;
334-
335-
336305} ) ;
0 commit comments