https://playwright.dev/assets/js/2f368f56.e9c215c8.js

1"use strict";(self.webpackChunkplaywright_dev=self.webpackChunkplaywright_dev||[]).push([["5560"],{25e3(e,a,i){i.r(a),i.d(a,{metadata:()=>o,default:()=>g,frontMatter:()=>s,contentTitle:()=>t,toc:()=>d,assets:()=>r});var o=JSON.parse('{"id":"dialogs","title":"Dialogs","description":"Introduction","source":"@site/versioned_docs/version-stable/dialogs.mdx","sourceDirName":".","slug":"/dialogs","permalink":"/docs/dialogs","draft":false,"unlisted":false,"tags":[],"version":"stable","frontMatter":{"id":"dialogs","title":"Dialogs"},"sidebar":"docs","previous":{"title":"Debugging Tests","permalink":"/docs/debug"},"next":{"title":"Downloads","permalink":"/docs/downloads"}}'),l=i(74848),n=i(28453);i(13554),i(41647),i(83137);let s={id:"dialogs",title:"Dialogs"},t,r={},d=[{value:"Introduction",id:"introduction",level:2},{value:"alert(), confirm(), prompt() dialogs",id:"alert-confirm-prompt-dialogs",level:2},{value:"beforeunload dialog",id:"beforeunload-dialog",level:2},{value:"Print dialogs",id:"print-dialogs",level:2}];function c(e){let a={a:"a",admonition:"admonition",code:"code",h2:"h2",p:"p",pre:"pre",strong:"strong",...(0,n.R)(),...e.components};return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(a.h2,{id:"introduction",children:"Introduction"}),"\n",(0,l.jsxs)(a.p,{children:["Playwright can interact with the web page dialogs such as ",(0,l.jsx)(a.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/alert",children:(0,l.jsx)(a.code,{children:"alert"})}),", ",(0,l.jsx)(a.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm",children:(0,l.jsx)(a.code,{children:"confirm"})}),", ",(0,l.jsx)(a.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/prompt",children:(0,l.jsx)(a.code,{children:"prompt"})})," as well as ",(0,l.jsx)(a.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/beforeunload_event",children:(0,l.jsx)(a.code,{children:"beforeunload"})})," confirmation. For print dialogs, see ",(0,l.jsx)(a.a,{href:"#print-dialogs",children:"Print"}),"."]}),"\n",(0,l.jsx)(a.h2,{id:"alert-confirm-prompt-dialogs",children:"alert(), confirm(), prompt() dialogs"}),"\n",(0,l.jsxs)(a.p,{children:["By default, dialogs are auto-dismissed by Playwright, so you don't have to handle them. However, you can register a dialog handler before the action that triggers the dialog to either ",(0,l.jsx)(a.a,{href:"/docs/api/class-dialog#dialog-accept",children:"dialog.accept()"})," or ",(0,l.jsx)(a.a,{href:"/docs/api/class-dialog#dialog-dismiss",children:"dialog.dismiss()"})," it."]}),"\n",(0,l.jsx)(a.pre,{children:(0,l.jsx)(a.code,{className:"language-js",children:"page.on('dialog', dialog => dialog.accept());\nawait page.getByRole('button').click();\n"})}),"\n",(0,l.jsx)(a.admonition,{type:"note",children:(0,l.jsxs)(a.p,{children:[(0,l.jsx)(a.a,{href:"/docs/api/class-page#page-event-dialog",children:"page.on('dialog')"})," listener ",(0,l.jsx)(a.strong,{children:"must handle"})," the dialog. Otherwise your action will stall, be it ",(0,l.jsx)(a.a,{href:"/docs/api/class-locator#locator-click",children:"locator.click()"})," or something else. That's because dialogs in Web are modals and therefore block further page execution until they are handled."]})}),"\n",(0,l.jsx)(a.p,{children:"As a result, the following snippet will never resolve:"}),"\n",(0,l.jsx)(a.admonition,{type:"warning",children:(0,l.jsx)(a.p,{children:"WRONG!"})}),"\n",(0,l.jsx)(a.pre,{children:(0,l.jsx)(a.code,{className:"language-js",children:"page.on('dialog', dialog => console.log(dialog.message()));\nawait page.getByRole('button').click(); // Will hang here\n"})}),"\n",(0,l.jsx)(a.admonition,{type:"note",children:(0,l.jsxs)(a.p,{children:["If there is no listener for ",(0,l.jsx)(a.a,{href:"/docs/api/class-page#page-event-dialog",children:"page.on('dialog')"}),", all dialogs are automatically dismissed."]})}),"\n",(0,l.jsx)(a.h2,{id:"beforeunload-dialog",children:"beforeunload dialog"}),"\n",(0,l.jsxs)(a.p,{children:["When ",(0,l.jsx)(a.a,{href:"/docs/api/class-page#page-close",children:"page.close()"})," is invoked with the truthy ",(0,l.jsx)(a.a,{href:"/docs/api/class-page#page-close-option-run-before-unload",children:"runBeforeUnload"})," value, the page runs its unload handlers. This is the only case when ",(0,l.jsx)(a.a,{href:"/docs/api/class-page#page-close",children:"page.close()"})," does not wait for the page to actually close, because it might be that the page stays open in the end of the operation."]}),"\n",(0,l.jsxs)(a.p,{children:["You can register a dialog handler to handle the ",(0,l.jsx)(a.code,{children:"beforeunload"})," dialog yourself:"]}),"\n",(0,l.jsx)(a.pre,{children:(0,l.jsx)(a.code,{className:"language-js",children:"page.on('dialog', async dialog => {\n  assert(dialog.type() === 'beforeunload');\n  await dialog.dismiss();\n});\nawait page.close({ runBeforeUnload: true });\n"})}),"\n",(0,l.jsx)(a.h2,{id:"print-dialogs",children:"Print dialogs"}),"\n",(0,l.jsxs)(a.p,{children:["In order to assert that a print dialog via ",(0,l.jsx)(a.a,{href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/print",children:(0,l.jsx)(a.code,{children:"window.print"})})," was triggered, you can use the following snippet:"]}

1),"\n",(0,l.jsx)(a.pre,{children:(0,l.jsx)(a.code,{className:"language-js",children:"await page.goto('<url>');\n\nawait page.evaluate('(() => {window.waitForPrintDialog = new Promise(f => window.print = f);})()');\nawait page.getByText('Print it!').click();\n\nawait page.waitForFunction('window.waitForPrintDialog');\n"})}),"\n",(0,l.jsx)(a.p,{children:"This will wait for the print dialog to be opened after the button is clicked. Make sure to evaluate the script before clicking the button / after the page is loaded."})]})}function g(e={}){let{wrapper:a}={...(0,n.R)(),...e.components};return a?(0,l.jsx)(a,{...e,children:(0,l.jsx)(c,{...e})}):c(e)}}}]);