KaneAI - World’s First E2E Software Testing Agent.Signup for Private Beta 
How to use waitForFunction method in Playwright Internal
Best JavaScript code snippet using playwright-internal
scripting_spec.js
Source:scripting_spec.js 
...18 if (clear) {19 await clearInput(page, selector);20 }21 await action();22 await page.waitForFunction(23 `document.querySelector("${selector.replace("\\", "\\\\")}").value !== ""` // lgtm [js/incomplete-sanitization]24 );25 return page.$eval(selector, el => el.value);26 }27 describe("in 160F-2019.pdf", () => {28 let pages;29 beforeAll(async () => {30 pages = await loadAndWait("160F-2019.pdf", "#\\34 16R");31 });32 afterAll(async () => {33 await closePages(pages);34 });35 it("must check that first text field has focus", async () => {36 await Promise.all(37 pages.map(async ([browserName, page]) => {38 await page.waitForFunction(39 "window.PDFViewerApplication.scriptingReady === true"40 );41 // The document has an open action in order to give42 // the focus to 401R.43 const id = await page.evaluate(44 () => window.document.activeElement.id45 );46 expect(id).withContext(`In ${browserName}`).toEqual("401R");47 })48 );49 });50 it("must show a text field and then make in invisible when content is removed", async () => {51 await Promise.all(52 pages.map(async ([browserName, page]) => {53 let visibility = await page.$eval(54 "#\\34 27R",55 el => getComputedStyle(el).visibility56 );57 expect(visibility).withContext(`In ${browserName}`).toEqual("hidden");58 await page.type("#\\34 16R", "3.14159", { delay: 200 });59 await page.click("#\\34 19R");60 await page.waitForFunction(61 `getComputedStyle(document.querySelector("#\\\\34 27R")).visibility !== "hidden"`62 );63 visibility = await page.$eval(64 "#\\34 27R",65 el => getComputedStyle(el).visibility66 );67 expect(visibility)68 .withContext(`In ${browserName}`)69 .toEqual("visible");70 // Clear the textfield71 await clearInput(page, "#\\34 16R");72 // and leave it73 await page.click("#\\34 19R");74 await page.waitForFunction(75 `getComputedStyle(document.querySelector("#\\\\34 27R")).visibility !== "visible"`76 );77 visibility = await page.$eval(78 "#\\34 27R",79 el => getComputedStyle(el).visibility80 );81 expect(visibility).withContext(`In ${browserName}`).toEqual("hidden");82 })83 );84 });85 it("must format the field with 2 digits and leave field with a click", async () => {86 await Promise.all(87 pages.map(async ([browserName, page]) => {88 await page.type("#\\34 16R", "3.14159", { delay: 200 });89 await page.click("#\\34 19R");90 const text = await page.$eval("#\\34 16R", el => el.value);91 expect(text).withContext(`In ${browserName}`).toEqual("3,14");92 const sum = await page.$eval("#\\34 27R", el => el.value);93 expect(sum).withContext(`In ${browserName}`).toEqual("3,14");94 })95 );96 });97 it("must format the field with 2 digits, leave field with a click and again", async () => {98 await Promise.all(99 pages.map(async ([browserName, page]) => {100 await page.type("#\\34 48R", "61803", { delay: 200 });101 await page.click("#\\34 19R");102 let text = await page.$eval("#\\34 48R", el => el.value);103 expect(text).withContext(`In ${browserName}`).toEqual("61.803,00");104 await page.click("#\\34 48R");105 text = await page.$eval("#\\34 48R", el => el.value);106 expect(text).withContext(`In ${browserName}`).toEqual("61803");107 // Clear the textfield108 await clearInput(page, "#\\34 48R");109 await page.type("#\\34 48R", "1.61803", { delay: 200 });110 await page.click("#\\34 19R");111 text = await page.$eval("#\\34 48R", el => el.value);112 expect(text).withContext(`In ${browserName}`).toEqual("1,62");113 })114 );115 });116 it("must format the field with 2 digits and leave field with a TAB", async () => {117 await Promise.all(118 pages.map(async ([browserName, page]) => {119 await page.type("#\\34 22R", "2.7182818", { delay: 200 });120 await page.keyboard.press("Tab");121 const text = await page.$eval("#\\34 22R", el => el.value);122 expect(text).withContext(`In ${browserName}`).toEqual("2,72");123 const sum = await page.$eval("#\\34 27R", el => el.value);124 expect(sum).withContext(`In ${browserName}`).toEqual("5,86");125 })126 );127 });128 it("must format the field with 2 digits and hit ESC", async () => {129 await Promise.all(130 pages.map(async ([browserName, page]) => {131 let sum = await page.$eval("#\\34 71R", el => el.value);132 expect(sum).withContext(`In ${browserName}`).toEqual("4,24");133 await page.type("#\\34 36R", "0.69314", { delay: 200 });134 await page.keyboard.press("Escape");135 const text = await page.$eval("#\\34 36R", el => el.value);136 expect(text).withContext(`In ${browserName}`).toEqual("0.69314");137 sum = await page.$eval("#\\34 71R", el => el.value);138 expect(sum).withContext(`In ${browserName}`).toEqual("3,55");139 })140 );141 });142 it("must format the field with 2 digits on key ENTER", async () => {143 await Promise.all(144 pages.map(async ([browserName, page]) => {145 await page.type("#\\34 19R", "0.577215", { delay: 200 });146 await page.keyboard.press("Enter");147 const text = await page.$eval("#\\34 19R", el => el.value);148 expect(text).toEqual("0.577215");149 const sum = await page.$eval("#\\34 27R", el => el.value);150 expect(sum).toEqual("6,44");151 })152 );153 });154 it("must reset all", async () => {155 await Promise.all(156 pages.map(async ([browserName, page]) => {157 // click on a radio button158 await page.click("[data-annotation-id='449R']");159 // this field has no actions but it must be cleared on reset160 await page.type("#\\34 05R", "employee", { delay: 200 });161 let checked = await page.$eval("#\\34 49R", el => el.checked);162 expect(checked).toEqual(true);163 // click on reset button164 await page.click("[data-annotation-id='402R']");165 let text = await page.$eval("#\\34 16R", el => el.value);166 expect(text).toEqual("");167 text = await page.$eval("#\\34 22R", el => el.value);168 expect(text).toEqual("");169 text = await page.$eval("#\\34 19R", el => el.value);170 expect(text).toEqual("");171 text = await page.$eval("#\\34 05R", el => el.value);172 expect(text).toEqual("");173 const sum = await page.$eval("#\\34 27R", el => el.value);174 expect(sum).toEqual("");175 checked = await page.$eval("#\\34 49R", el => el.checked);176 expect(checked).toEqual(false);177 })178 );179 });180 });181 describe("in js-buttons.pdf", () => {182 let pages;183 beforeAll(async () => {184 pages = await loadAndWait("js-buttons.pdf", "#\\38 0R");185 });186 afterAll(async () => {187 await closePages(pages);188 });189 it("must show values in a text input when clicking on radio buttons", async () => {190 await Promise.all(191 pages.map(async ([browserName, page]) => {192 await page.waitForFunction(193 "window.PDFViewerApplication.scriptingReady === true"194 );195 const expected = [196 ["#\\38 1R", "Group1=Choice1::1"],197 ["#\\38 2R", "Group1=Choice2::2"],198 ["#\\38 3R", "Group1=Choice3::3"],199 ["#\\38 4R", "Group1=Choice4::4"],200 ];201 for (const [selector, expectedText] of expected) {202 // Clear the textfield203 await clearInput(page, "#\\38 0R");204 await page.click(selector);205 await page.waitForFunction(206 `document.querySelector("#\\\\38 0R").value !== ""`207 );208 const text = await page.$eval("#\\38 0R", el => el.value);209 expect(text).withContext(`In ${browserName}`).toEqual(expectedText);210 }211 })212 );213 });214 it("must show values in a text input when clicking on checkboxes", async () => {215 await Promise.all(216 pages.map(async ([browserName, page]) => {217 const expected = [218 ["#\\38 5R", "Check1=Yes::5"],219 ["#\\38 7R", "Check2=Yes::6"],220 ["#\\38 8R", "Check3=Yes::7"],221 ["#\\38 9R", "Check4=Yes::8"],222 ["#\\38 5R", "Check1=Off::5"],223 ["#\\38 7R", "Check2=Off::6"],224 ["#\\38 8R", "Check3=Off::7"],225 ["#\\38 9R", "Check4=Off::8"],226 ];227 for (const [selector, expectedText] of expected) {228 // Clear the textfield229 await clearInput(page, "#\\38 0R");230 await page.click(selector);231 await page.waitForFunction(232 `document.querySelector("#\\\\38 0R").value !== ""`233 );234 const text = await page.$eval("#\\38 0R", el => el.value);235 expect(text).withContext(`In ${browserName}`).toEqual(expectedText);236 }237 })238 );239 });240 it("must show values in a text input when clicking on checkboxes in a group", async () => {241 await Promise.all(242 pages.map(async ([browserName, page]) => {243 const expected = [244 ["#\\39 0R", "Check5=Yes1::9"],245 ["#\\39 1R", "Check5=Yes2::10"],246 ["#\\39 2R", "Check5=Yes3::11"],247 ["#\\39 3R", "Check5=Yes4::12"],248 ["#\\39 3R", "Check5=Off::12"],249 ];250 for (const [selector, expectedText] of expected) {251 // Clear the textfield252 await clearInput(page, "#\\38 0R");253 await page.click(selector);254 await page.waitForFunction(255 `document.querySelector("#\\\\38 0R").value !== ""`256 );257 const text = await page.$eval("#\\38 0R", el => el.value);258 expect(text).withContext(`In ${browserName}`).toEqual(expectedText);259 }260 })261 );262 });263 it("must show values in a text input when clicking on checkboxes or radio with no actions", async () => {264 await Promise.all(265 pages.map(async ([browserName, page]) => {266 const expected = [267 ["", "Off;Off"],268 ["#\\39 4R", "Yes;Off"],269 ["#\\39 5R", "Yes;NoAct2"],270 ["#\\39 6R", "Yes;NoAct3"],271 ["#\\39 4R", "Off;NoAct3"],272 ["#\\39 5R", "Off;NoAct2"],273 ];274 for (const [selector, expectedText] of expected) {275 // Clear the textfield276 await clearInput(page, "#\\38 0R");277 if (selector) {278 await page.click(selector);279 }280 await page.click("[data-annotation-id='97R']");281 await page.waitForFunction(282 `document.querySelector("#\\\\38 0R").value !== ""`283 );284 const text = await page.$eval("#\\38 0R", el => el.value);285 expect(text).withContext(`In ${browserName}`).toEqual(expectedText);286 }287 })288 );289 });290 });291 describe("in doc_actions.pdf for printing", () => {292 let pages;293 beforeAll(async () => {294 pages = await loadAndWait("doc_actions.pdf", "#\\34 7R");295 });296 afterAll(async () => {297 await closePages(pages);298 });299 it("must execute WillPrint and DidPrint actions", async () => {300 await Promise.all(301 pages.map(async ([browserName, page]) => {302 if (process.platform === "win32" && browserName === "firefox") {303 pending("Disabled in Firefox on Windows, because of bug 1662471.");304 }305 await page.waitForFunction(306 "window.PDFViewerApplication.scriptingReady === true"307 );308 await clearInput(page, "#\\34 7R");309 await page.evaluate(_ => {310 window.document.activeElement.blur();311 });312 await page.waitForFunction(313 `document.querySelector("#\\\\34 7R").value === ""`314 );315 let text = await actAndWaitForInput(page, "#\\34 7R", async () => {316 await page.click("#print");317 });318 expect(text).withContext(`In ${browserName}`).toEqual("WillPrint");319 await page.waitForFunction(320 `document.querySelector("#\\\\35 0R").value !== ""`321 );322 text = await page.$eval("#\\35 0R", el => el.value);323 expect(text).withContext(`In ${browserName}`).toEqual("DidPrint");324 })325 );326 });327 });328 describe("in doc_actions.pdf for saving", () => {329 let pages;330 beforeAll(async () => {331 pages = await loadAndWait("doc_actions.pdf", "#\\34 7R");332 });333 afterAll(async () => {334 await closePages(pages);335 });336 it("must execute WillSave and DidSave actions", async () => {337 await Promise.all(338 pages.map(async ([browserName, page]) => {339 await page.waitForFunction(340 "window.PDFViewerApplication.scriptingReady === true"341 );342 try {343 // Disable download in chrome344 // (it leads to an error in firefox so the try...)345 await page._client.send("Page.setDownloadBehavior", {346 behavior: "deny",347 });348 } catch (_) {}349 await clearInput(page, "#\\34 7R");350 await page.evaluate(_ => {351 window.document.activeElement.blur();352 });353 await page.waitForFunction(354 `document.querySelector("#\\\\34 7R").value === ""`355 );356 let text = await actAndWaitForInput(page, "#\\34 7R", async () => {357 await page.click("#download");358 });359 expect(text).withContext(`In ${browserName}`).toEqual("WillSave");360 await page.waitForFunction(361 `document.querySelector("#\\\\35 0R").value !== ""`362 );363 text = await page.$eval("#\\35 0R", el => el.value);364 expect(text).withContext(`In ${browserName}`).toEqual("DidSave");365 })366 );367 });368 });369 describe("in doc_actions.pdf for page actions", () => {370 let pages;371 beforeAll(async () => {372 pages = await loadAndWait("doc_actions.pdf", "#\\34 7R");373 });374 afterAll(async () => {375 await closePages(pages);376 });377 it("must execute PageOpen and PageClose actions", async () => {378 await Promise.all(379 pages.map(async ([browserName, page]) => {380 await page.waitForFunction(381 "window.PDFViewerApplication.scriptingReady === true"382 );383 let text = await page.$eval("#\\34 7R", el => el.value);384 expect(text).withContext(`In ${browserName}`).toEqual("PageOpen 1");385 for (let run = 0; run < 5; run++) {386 for (const ref of [18, 19, 20, 21, 47, 50]) {387 await page.evaluate(refElem => {388 const element = window.document.getElementById(`${refElem}R`);389 if (element) {390 element.value = "";391 }392 }, ref);393 }394 for (const [refOpen, refClose, pageNumOpen, pageNumClose] of [395 [18, 50, 2, 1],396 [21, 19, 3, 2],397 [47, 20, 1, 3],398 ]) {399 text = await actAndWaitForInput(400 page,401 `#\\3${Math.floor(refOpen / 10)} ${refOpen % 10}R`,402 async () => {403 await page.evaluate(refElem => {404 window.document405 .getElementById(`${refElem}R`)406 .scrollIntoView();407 }, refOpen);408 },409 false410 );411 expect(text)412 .withContext(`In ${browserName}`)413 .toEqual(`PageOpen ${pageNumOpen}`);414 text = await page.$eval(415 `#\\3${Math.floor(refClose / 10)} ${refClose % 10}R`,416 el => el.value417 );418 expect(text)419 .withContext(`In ${browserName}`)420 .toEqual(`PageClose ${pageNumClose}`);421 }422 }423 })424 );425 });426 });427 describe("in js-authors.pdf", () => {428 let pages;429 beforeAll(async () => {430 pages = await loadAndWait("js-authors.pdf", "#\\32 5R");431 });432 afterAll(async () => {433 await closePages(pages);434 });435 it("must print authors in a text field", async () => {436 await Promise.all(437 pages.map(async ([browserName, page]) => {438 const text = await actAndWaitForInput(page, "#\\32 5R", async () => {439 await page.click("[data-annotation-id='26R']");440 });441 expect(text)442 .withContext(`In ${browserName}`)443 .toEqual("author1::author2::author3::author4::author5");444 })445 );446 });447 });448 describe("in listbox_actions.pdf", () => {449 let pages;450 beforeAll(async () => {451 pages = await loadAndWait("listbox_actions.pdf", "#\\33 3R");452 });453 afterAll(async () => {454 await closePages(pages);455 });456 it("must print selected value in a text field", async () => {457 await Promise.all(458 pages.map(async ([browserName, page]) => {459 for (const num of [7, 6, 4, 3, 2, 1]) {460 await clearInput(page, "#\\33 3R");461 await page.click(`option[value=Export${num}]`);462 await page.waitForFunction(463 `document.querySelector("#\\\\33 3R").value !== ""`464 );465 const text = await page.$eval("#\\33 3R", el => el.value);466 expect(text)467 .withContext(`In ${browserName}`)468 .toEqual(`Item${num},Export${num}`);469 }470 })471 );472 });473 it("must clear and restore list elements", async () => {474 await Promise.all(475 pages.map(async ([browserName, page]) => {476 // Click on ClearItems button.477 await page.click("[data-annotation-id='34R']");478 await page.waitForFunction(479 `document.querySelector("#\\\\33 0R").children.length === 0`480 );481 // Click on Restore button.482 await page.click("[data-annotation-id='37R']");483 await page.waitForFunction(484 `document.querySelector("#\\\\33 0R").children.length !== 0`485 );486 for (const num of [7, 6, 4, 3, 2, 1]) {487 await clearInput(page, "#\\33 3R");488 await page.click(`option[value=Export${num}]`);489 await page.waitForFunction(490 `document.querySelector("#\\\\33 3R").value !== ""`491 );492 const text = await page.$eval("#\\33 3R", el => el.value);493 expect(text)494 .withContext(`In ${browserName}`)495 .toEqual(`Item${num},Export${num}`);496 }497 })498 );499 });500 it("must insert new elements", async () => {501 await Promise.all(502 pages.map(async ([browserName, page]) => {503 let len = 6;504 for (const num of [1, 3, 5, 6, 431, -1, 0]) {505 ++len;506 await clearInput(page, "#\\33 3R");507 await clearInput(page, "#\\33 9R");508 await page.type("#\\33 9R", `${num},Insert${num},Tresni${num}`, {509 delay: 10,510 });511 // Click on AddItem button.512 await page.click("[data-annotation-id='38R']");513 await page.waitForFunction(514 `document.querySelector("#\\\\33 0R").children.length === ${len}`515 );516 // Click on newly added option.517 await page.select("#\\33 0R", `Tresni${num}`);518 await page.waitForFunction(519 `document.querySelector("#\\\\33 3R").value !== ""`520 );521 const text = await page.$eval("#\\33 3R", el => el.value);522 expect(text)523 .withContext(`In ${browserName}`)524 .toEqual(`Insert${num},Tresni${num}`);525 }526 })527 );528 });529 it("must delete some element", async () => {530 await Promise.all(531 pages.map(async ([browserName, page]) => {532 let len = 6;533 // Click on Restore button.534 await clearInput(page, "#\\33 3R");535 await page.click("[data-annotation-id='37R']");536 await page.waitForFunction(537 `document.querySelector("#\\\\33 0R").children.length === ${len}`538 );539 for (const num of [2, 5]) {540 --len;541 await clearInput(page, "#\\33 9R");542 await page.type("#\\33 9R", `${num}`);543 // Click on DeleteItem button.544 await page.click("[data-annotation-id='36R']");545 await page.waitForFunction(546 `document.querySelector("#\\\\33 0R").children.length === ${len}`547 );548 }549 for (const num of [6, 4, 2, 1]) {550 await page.click(`option[value=Export${num}]`);551 await page.waitForFunction(552 `document.querySelector("#\\\\33 3R").value !== ""`553 );554 const text = await page.$eval("#\\33 3R", el => el.value);555 expect(text)556 .withContext(`In ${browserName}`)557 .toEqual(`Item${num},Export${num}`);558 }559 })560 );561 });562 });563 describe("in js-colors.pdf", () => {564 let pages;565 beforeAll(async () => {566 pages = await loadAndWait("js-colors.pdf", "#\\33 4R");567 });568 afterAll(async () => {569 await closePages(pages);570 });571 it("must change colors", async () => {572 await Promise.all(573 pages.map(async ([browserName, page]) => {574 for (const [name, ref] of [575 ["Text1", "#\\33 4R"],576 ["Check1", "#\\33 5R"],577 ["Radio1", "#\\33 7R"],578 ["Choice1", "#\\33 8R"],579 ]) {580 await clearInput(page, "#\\33 4R");581 await page.type("#\\33 4R", `${name}`, {582 delay: 10,583 });584 for (const [id, propName, expected] of [585 [41, "backgroundColor", "rgb(255, 0, 0)"],586 [43, "color", "rgb(0, 255, 0)"],587 [44, "border-top-color", "rgb(0, 0, 255)"],588 ]) {589 const current = await page.$eval(590 ref,591 (el, _propName) => getComputedStyle(el)[_propName],592 propName593 );594 await page.click(`[data-annotation-id='${id}R']`);595 await page.waitForFunction(596 (_ref, _current, _propName) =>597 getComputedStyle(document.querySelector(_ref))[_propName] !==598 _current,599 {},600 ref,601 current,602 propName603 );604 const color = await page.$eval(605 ref,606 (el, _propName) => getComputedStyle(el)[_propName],607 propName608 );609 expect(color).withContext(`In ${browserName}`).toEqual(expected);610 }611 }612 })613 );614 });615 });616 describe("in issue13132.pdf", () => {617 let pages;618 beforeAll(async () => {619 pages = await loadAndWait("issue13132.pdf", "#\\31 71R");620 });621 afterAll(async () => {622 await closePages(pages);623 });624 it("must compute sum of fields", async () => {625 await Promise.all(626 pages.map(async ([browserName, page]) => {627 await page.waitForFunction(628 "window.PDFViewerApplication.scriptingReady === true"629 );630 await page.evaluate(() => {631 window.document.getElementById("171R").scrollIntoView();632 });633 let sum = 0;634 for (const [id, val] of [635 ["#\\31 38R", 1],636 ["#\\37 7R", 2],637 ["#\\39 3R", 3],638 ["#\\31 51R", 4],639 ["#\\37 9R", 5],640 ]) {641 const prev = await page.$eval("#\\31 71R", el => el.value);642 await page.type(id, val.toString(), { delay: 100 });643 await page.keyboard.press("Tab");644 await page.waitForFunction(645 _prev =>646 getComputedStyle(document.querySelector("#\\31 71R")).value !==647 _prev,648 {},649 prev650 );651 sum += val;652 const total = await page.$eval("#\\31 71R", el => el.value);653 expect(total).withContext(`In ${browserName}`).toEqual(`£${sum}`);654 }655 // Some unrendered annotations have been updated, so check656 // that they've the correct value when rendered.657 await page.evaluate(() => {658 window.document659 .querySelectorAll('[data-page-number="4"][class="page"]')[0]660 .scrollIntoView();661 });662 await page.waitForSelector("#\\32 99R", {663 timeout: 0,664 });665 const total = await page.$eval("#\\32 99R", el => el.value);666 expect(total).withContext(`In ${browserName}`).toEqual(`£${sum}`);667 })668 );669 });670 });671 describe("Check field properties", () => {672 let pages;673 beforeAll(async () => {674 pages = await loadAndWait("evaljs.pdf", "#\\35 5R");675 });676 afterAll(async () => {677 await closePages(pages);678 });679 it("must check page index", async () => {680 await Promise.all(681 pages.map(async ([browserName, page]) => {682 await page.waitForFunction(683 "window.PDFViewerApplication.scriptingReady === true"684 );685 await clearInput(page, "#\\35 5R");686 await page.type(687 "#\\35 5R",688 `689 ['Text1', 'Text2', 'Text4',690 'List Box7', 'Group6'].map(x => this.getField(x).page).join(',')691 `692 );693 // Click on execute button to eval the above code.694 await page.click("[data-annotation-id='57R']");695 await page.waitForFunction(696 `document.querySelector("#\\\\35 6R").value !== ""`697 );698 const text = await page.$eval("#\\35 6R", el => el.value);699 expect(text).withContext(`In ${browserName}`).toEqual("0,0,1,1,1");700 })701 );702 });703 it("must check display", async () => {704 await Promise.all(705 pages.map(async ([browserName, page]) => {706 for (const [type, vis] of [707 ["hidden", "hidden"],708 ["noPrint", "visible"],709 ["noView", "hidden"],710 ["visible", "visible"],711 ]) {712 let visibility = await page.$eval(713 "#\\35 6R",714 el => getComputedStyle(el).visibility715 );716 await clearInput(page, "#\\35 5R");717 await page.type(718 "#\\35 5R",719 `this.getField("Text2").display = display.${type};`720 );721 await page.click("[data-annotation-id='57R']");722 await page.waitForFunction(723 `getComputedStyle(document.querySelector("#\\\\35 6R")).visibility !== "${visibility}"`724 );725 visibility = await page.$eval(726 "#\\35 6R",727 el => getComputedStyle(el).visibility728 );729 expect(visibility).withContext(`In ${browserName}`).toEqual(vis);730 }731 })732 );733 });734 });735 describe("in issue13269.pdf", () => {736 let pages;737 beforeAll(async () => {738 pages = await loadAndWait("issue13269.pdf", "#\\32 7R");739 });740 afterAll(async () => {741 await closePages(pages);742 });743 it("must update fields with the same name from JS", async () => {744 await Promise.all(745 pages.map(async ([browserName, page]) => {746 await page.waitForFunction(747 "window.PDFViewerApplication.scriptingReady === true"748 );749 await page.type("#\\32 7R", "hello");750 await page.keyboard.press("Enter");751 await Promise.all(752 [4, 5, 6].map(async n =>753 page.waitForFunction(754 `document.querySelector("#\\\\32 ${n}R").value !== ""`755 )756 )757 );758 const expected = "hello world";759 for (const n of [4, 5, 6]) {760 const text = await page.$eval(`#\\32 ${n}R`, el => el.value);761 expect(text).withContext(`In ${browserName}`).toEqual(expected);762 }763 })764 );765 });766 });767});
waittask.spec.js
Source:waittask.spec.js
...49 await page.waitFor(timeout);50 expect(Date.now() - startTime).not.toBeLessThan(timeout / 2);51 });52 it('should work with multiline body', async({page, server}) => {53 const result = await page.waitForFunction(`54 (() => true)()55 `);56 expect(await result.jsonValue()).toBe(true);57 });58 it('should wait for predicate', async({page, server}) => {59 await Promise.all([60 page.waitFor(() => window.innerWidth < 100),61 page.setViewport({width: 10, height: 10}),62 ]);63 });64 it('should throw when unknown type', async({page, server}) => {65 let error = null;66 await page.waitFor({foo: 'bar'}).catch(e => error = e);67 expect(error.message).toContain('Unsupported target type');68 });69 it('should wait for predicate with arguments', async({page, server}) => {70 await page.waitFor((arg1, arg2) => arg1 !== arg2, {}, 1, 2);71 });72 });73 describe('Frame.waitForFunction', function() {74 it('should accept a string', async({page, server}) => {75 const watchdog = page.waitForFunction('window.__FOO === 1');76 await page.evaluate(() => window.__FOO = 1);77 await watchdog;78 });79 it('should work when resolved right before execution context disposal', async({page, server}) => {80 await page.evaluateOnNewDocument(() => window.__RELOADED = true);81 await page.waitForFunction(() => {82 if (!window.__RELOADED)83 window.location.reload();84 return true;85 });86 });87 it('should poll on interval', async({page, server}) => {88 let success = false;89 const startTime = Date.now();90 const polling = 100;91 const watchdog = page.waitForFunction(() => window.__FOO === 'hit', {polling})92 .then(() => success = true);93 await page.evaluate(() => window.__FOO = 'hit');94 expect(success).toBe(false);95 await page.evaluate(() => document.body.appendChild(document.createElement('div')));96 await watchdog;97 expect(Date.now() - startTime).not.toBeLessThan(polling / 2);98 });99 it('should poll on mutation', async({page, server}) => {100 let success = false;101 const watchdog = page.waitForFunction(() => window.__FOO === 'hit', {polling: 'mutation'})102 .then(() => success = true);103 await page.evaluate(() => window.__FOO = 'hit');104 expect(success).toBe(false);105 await page.evaluate(() => document.body.appendChild(document.createElement('div')));106 await watchdog;107 });108 it('should poll on raf', async({page, server}) => {109 const watchdog = page.waitForFunction(() => window.__FOO === 'hit', {polling: 'raf'});110 await page.evaluate(() => window.__FOO = 'hit');111 await watchdog;112 });113 it('should work with strict CSP policy', async({page, server}) => {114 server.setCSP('/empty.html', 'script-src ' + server.PREFIX);115 await page.goto(server.EMPTY_PAGE);116 let error = null;117 await Promise.all([118 page.waitForFunction(() => window.__FOO === 'hit', {polling: 'raf'}).catch(e => error = e),119 page.evaluate(() => window.__FOO = 'hit')120 ]);121 expect(error).toBe(null);122 });123 it('should throw on bad polling value', async({page, server}) => {124 let error = null;125 try {126 await page.waitForFunction(() => !!document.body, {polling: 'unknown'});127 } catch (e) {128 error = e;129 }130 expect(error).toBeTruthy();131 expect(error.message).toContain('polling');132 });133 it('should throw negative polling interval', async({page, server}) => {134 let error = null;135 try {136 await page.waitForFunction(() => !!document.body, {polling: -10});137 } catch (e) {138 error = e;139 }140 expect(error).toBeTruthy();141 expect(error.message).toContain('Cannot poll with non-positive interval');142 });143 it('should return the success value as a JSHandle', async({page}) => {144 expect(await (await page.waitForFunction(() => 5)).jsonValue()).toBe(5);145 });146 it('should return the window as a success value', async({ page }) => {147 expect(await page.waitForFunction(() => window)).toBeTruthy();148 });149 it('should accept ElementHandle arguments', async({page}) => {150 await page.setContent('<div></div>');151 const div = await page.$('div');152 let resolved = false;153 const waitForFunction = page.waitForFunction(element => !element.parentElement, {}, div).then(() => resolved = true);154 expect(resolved).toBe(false);155 await page.evaluate(element => element.remove(), div);156 await waitForFunction;157 });158 it('should respect timeout', async({page}) => {159 let error = null;160 await page.waitForFunction('false', {timeout: 10}).catch(e => error = e);161 expect(error).toBeTruthy();162 expect(error.message).toContain('waiting for function failed: timeout');163 expect(error).toBeInstanceOf(puppeteer.errors.TimeoutError);164 });165 it('should respect default timeout', async({page}) => {166 page.setDefaultTimeout(1);167 let error = null;168 await page.waitForFunction('false').catch(e => error = e);169 expect(error).toBeInstanceOf(puppeteer.errors.TimeoutError);170 expect(error.message).toContain('waiting for function failed: timeout');171 });172 it('should disable timeout when its set to 0', async({page}) => {173 const watchdog = page.waitForFunction(() => {174 window.__counter = (window.__counter || 0) + 1;175 return window.__injected;176 }, {timeout: 0, polling: 10});177 await page.waitForFunction(() => window.__counter > 10);178 await page.evaluate(() => window.__injected = true);179 await watchdog;180 });181 it('should survive cross-process navigation', async({page, server}) => {182 let fooFound = false;183 const waitForFunction = page.waitForFunction('window.__FOO === 1').then(() => fooFound = true);184 await page.goto(server.EMPTY_PAGE);185 expect(fooFound).toBe(false);186 await page.reload();187 expect(fooFound).toBe(false);188 await page.goto(server.CROSS_PROCESS_PREFIX + '/grid.html');189 expect(fooFound).toBe(false);190 await page.evaluate(() => window.__FOO = 1);191 await waitForFunction;192 expect(fooFound).toBe(true);193 });194 it('should survive navigations', async({page, server}) => {195 const watchdog = page.waitForFunction(() => window.__done);196 await page.goto(server.EMPTY_PAGE);197 await page.goto(server.PREFIX + '/consolelog.html');198 await page.evaluate(() => window.__done = true);199 await watchdog;200 });201 });202 describe('Frame.waitForSelector', function() {203 const addElement = tag => document.body.appendChild(document.createElement(tag));204 it('should immediately resolve promise if node exists', async({page, server}) => {205 await page.goto(server.EMPTY_PAGE);206 const frame = page.mainFrame();207 await frame.waitForSelector('*');208 await frame.evaluate(addElement, 'div');209 await frame.waitForSelector('div');...
2-protected-mode.js
Source:2-protected-mode.js
...31 });32 it('should be possible to add data-protected attribute', async () => {33 await pageA.evaluate(() =>34 document.documentElement.setAttribute('data-protected', ''));35 const attributeSetA = await util.waitForFunction(pageA, () =>36 document.documentElement.getAttribute('data-protected') === '');37 assert.isTrue(attributeSetA);38 const attributeSetB = await util.waitForFunction(pageB, () =>39 document.documentElement.getAttribute('data-protected') === '');40 assert.isTrue(attributeSetB);41 });42 // We don't do this just to test the attribute, the page must be reloaded after making the body43 // protected.44 it('data-protected attribute should be visible after reload', async () => {45 await Promise.all([pageA.reload(), pageB.reload()]);46 const attributeSetA = await util.waitForFunction(pageA, () =>47 document.documentElement.getAttribute('data-protected') === '');48 assert.isTrue(attributeSetA);49 });50 it('webstrate should be protected', async () => {51 const webstrate = await pageA.evaluate(() => window.webstrate);52 assert.isTrue(webstrate.isProtected, 'webstrate isn\'t protected');53 });54 it('inserted transient div should be visible on inserting client', async () => {55 await pageA.evaluate(() => {56 const div = document.createElement('div');57 div.innerHTML = 'X';58 document.body.appendChild(div);59 });60 const bodyHasOneChild = await util.waitForFunction(pageA, () =>61 document.body.children.length === 1);62 assert.isTrue(bodyHasOneChild);63 const childContentsA = await pageA.evaluate(() => document.body.firstElementChild.innerHTML);64 assert.equal(childContentsA, 'X', 'div should contain exactly \'X');65 });66 it('inserted transient div should not be visible on other client', async () => {67 const bodyHasChildrenB = await util.waitForFunction(pageB, () =>68 document.body.children.length > 0);69 assert.isFalse(bodyHasChildrenB, 'transient div should not be visible on other client');70 });71 it('inserted non-transient div should be visible on inserting client', async () => {72 await pageA.evaluate(() => {73 const div = document.createElement('div', { approved: true });74 div.innerHTML = 'Y';75 document.body.appendChild(div);76 });77 const bodyHasTwoChildren = await util.waitForFunction(pageA, () =>78 document.body.children.length === 2);79 assert.isTrue(bodyHasTwoChildren,80 'body has two children (transient div and non-transient div)');81 const childContentsA = await pageA.evaluate(() => document.body.lastElementChild.innerHTML);82 assert.equal(childContentsA, 'Y', 'div should contain exactly \'Y');83 });84 it('inserted non-transient div should be visible on other client', async () => {85 const bodyHasOneChildB = await util.waitForFunction(pageB, () =>86 document.body.children.length === 1);87 assert.isTrue(bodyHasOneChildB, 'body should have exactly one child');88 });89 it('inserted non-transient div with defined namespace should be visible on inserting client',90 async () => {91 await pageA.evaluate(() => {92 const div = document.createElementNS('http://www.w3.org/1999/xhtml', 'div',93 { approved: true });94 div.innerHTML = 'Y';95 document.body.appendChild(div);96 });97 const bodyHasThreeChildren = await util.waitForFunction(pageA, () =>98 document.body.children.length === 3);99 assert.isTrue(bodyHasThreeChildren,100 'body has two children (transient div and non-transient div)');101 const childContentsA = await pageA.evaluate(() => document.body.lastElementChild.innerHTML);102 assert.equal(childContentsA, 'Y', 'div should contain exactly \'Y');103 });104 it('inserted non-transient div with defined namespace should be visible on other client',105 async () => {106 const bodyHasTwoChildrenB = await util.waitForFunction(pageB, () =>107 document.body.children.length === 2);108 assert.isTrue(bodyHasTwoChildrenB, 'body should have exactly one child');109 });110 it('transient attribute set should be visible on inserting client', async () => {111 await pageA.evaluate(() =>112 document.body.lastElementChild.setAttribute('x', 'Transient attribute'));113 const hasAttributeA = await util.waitForFunction(pageA, () =>114 document.body.lastElementChild.getAttribute('x'));115 assert.isTrue(hasAttributeA, 'attribute should be visible');116 const attribute = await pageA.evaluate(() => document.body.lastElementChild.getAttribute('x'));117 assert.equal(attribute, 'Transient attribute', 'Attribute is \'Transient attribute!\'');118 });119 it('transient attribute set should not be visible on other client', async () => {120 const hasAttributeB = await util.waitForFunction(pageB, () => document.body.getAttribute('x'));121 assert.isFalse(hasAttributeB, 'attribute should not be visible');122 });123 it('non-transient attribute set should be visible on inserting client', async () => {124 await pageA.evaluate(() =>125 document.body.lastElementChild.setAttribute('y', 'Non-transient attribute',126 { approved: true }));127 const hasAttributeA = await util.waitForFunction(pageA, () =>128 document.body.lastElementChild.hasAttribute('y'));129 assert.isTrue(hasAttributeA, 'attribute should be visible');130 const attribute = await pageA.evaluate(() => document.body.lastElementChild.getAttribute('y'));131 assert.equal(attribute, 'Non-transient attribute', 'Attribute is \'Non-transient attribute\'');132 });133 it('non-transient attribute set should be visible on other client', async () => {134 const hasAttributeB = await util.waitForFunction(pageB, () =>135 document.body.lastElementChild.hasAttribute('y'));136 assert.isTrue(hasAttributeB, 'attribute should be visible');137 const attribute = await pageB.evaluate(() => document.body.lastElementChild.getAttribute('y'));138 assert.equal(attribute, 'Non-transient attribute', 'Attribute is \'Non-transient attribute\'');139 });140 it('edit on non-transient attribute set should be visible to other clients', async () => {141 await util.sleep(1);142 await pageA.evaluate(() => document.body.lastElementChild.setAttribute('y', 'Edit A'));143 const correctAttributeValueA = await util.waitForFunction(pageB, () =>144 document.body.lastElementChild.getAttribute('y') === 'Edit A');145 assert.isTrue(correctAttributeValueA, 'attribute set on client A gets reflected to B');146 await pageB.evaluate(() => document.body.lastElementChild.setAttribute('y', 'Edit B'));147 const correctAttributeValueB = await util.waitForFunction(pageA, () =>148 document.body.lastElementChild.getAttribute('y') === 'Edit B');149 assert.isTrue(correctAttributeValueB, 'attribute set on client B gets reflected to A');150 });151 it('id property should be visible as non-transient id attribute on inserting client',152 async () => {153 await pageA.evaluate(() => document.body.id = 'body-id');154 const hasAttributeId = await util.waitForFunction(pageA, () =>155 document.body.hasAttribute('id'));156 assert.isTrue(hasAttributeId, 'attribute not visible');157 const attributeValue = await pageA.evaluate(() => document.body.id);158 assert.equal(attributeValue, 'body-id', 'The id attribute is not \'body-id\'');159 });160 it('id property should be visible as non-transient id attribute on other client', async () => {161 const hasAttributeId = await util.waitForFunction(pageB, () =>162 document.body.hasAttribute('id'));163 assert.isTrue(hasAttributeId, 'attribute not visible');164 const attributeValue = await pageB.evaluate(() => document.body.id);165 assert.equal(attributeValue, 'body-id', 'The id attribute is not \'body-id\'');166 });167 it('classList.add should be visible as non-transient class attribute on inserting client',168 async () => {169 await pageA.evaluate(() => document.body.classList.add('class1'));170 const hasAttributeClass = await util.waitForFunction(pageA, () =>171 document.body.getAttribute('class'));172 assert.isTrue(hasAttributeClass, 'attribute not visible');173 const attributeValue = await pageA.evaluate(() => document.body.getAttribute('class'));174 assert.equal(attributeValue, 'class1', 'The class attribute is not \'class1\'');175 });176 it('classList.add should be visible as non-transient class attribute on other client',177 async () => {178 const hasAttributeClass = await util.waitForFunction(pageB, () =>179 document.body.hasAttribute('class'));180 assert.isTrue(hasAttributeClass, 'attribute not visible');181 const attributeValue = await pageB.evaluate(() => document.body.getAttribute('class'));182 assert.equal(attributeValue, 'class1', 'The id attribute is not \'class1\'');183 });184 it('classList.contains should work on both clients',185 async () => {186 const pageAContainsClass = await util.waitForFunction(pageA, () =>187 document.body.classList.contains('class1'));188 assert.isTrue(pageAContainsClass, 'class attribute does not contain \'class1\'');189 const pageBContainsClass = await util.waitForFunction(pageB, () =>190 document.body.classList.contains('class1'));191 assert.isTrue(pageBContainsClass, 'class attribute does not contain \'class1\'');192 });193 it('style properties should be visible as non-transient style attribute on inserting client',194 async () => {195 await pageA.evaluate(() => document.body.style.backgroundColor = 'hotpink');196 const hasAttribute = await util.waitForFunction(pageA, () =>197 document.body.getAttribute('style'));198 assert.isTrue(hasAttribute, 'style attribute not visible');199 const propertyValue = await pageA.evaluate(() => document.body.style.backgroundColor);200 assert.equal(propertyValue, 'hotpink',201 'style.backgroundColor property is not \'hotpink\'');202 const attributeValue = await pageA.evaluate(() =>203 document.body.getAttribute('style'));204 assert.equal(attributeValue, 'background-color: hotpink;',205 'style attribute is not \'background-color: hotpink\'');206 });207 it('style properties should be visible as non-transient style attribute on other client',208 async () => {209 const hasAttribute = await util.waitForFunction(pageB, () =>210 document.body.getAttribute('style'));211 assert.isTrue(hasAttribute, 'style attribute not visible');212 const propertyValue = await pageB.evaluate(() => document.body.style.backgroundColor);213 assert.equal(propertyValue, 'hotpink',214 'style.backgroundColor property is not \'hotpink\'');215 const attributeValue = await pageB.evaluate(() =>216 document.body.getAttribute('style'));217 assert.equal(attributeValue, 'background-color: hotpink;',218 'style attribute is not \'background-color: hotpink\'');219 });220 it('dataset properties should be visible as non-transient data-* attribute on inserting client',221 async () => {222 await pageA.evaluate(() => document.body.dataset.camelCase = 'kebab-case');223 const hasAttribute = await util.waitForFunction(pageA, () =>224 document.body.getAttribute('data-camel-case'));225 assert.isTrue(hasAttribute, 'attribute not visible');226 const datasetValue = await pageA.evaluate(() => document.body.dataset.camelCase);227 assert.equal(datasetValue, 'kebab-case',228 'The data-camel-case property is not \'kebab-case\'');229 const attributeValue = await pageA.evaluate(() =>230 document.body.getAttribute('data-camel-case'));231 assert.equal(attributeValue, 'kebab-case',232 'The data-camel-case attribute is not \'kebab-case\'');233 });234 it('dataset properties should be visible as non-transient data-* attribute on other client',235 async () => {236 const hasAttribute = await util.waitForFunction(pageB, () =>237 document.body.getAttribute('data-camel-case'));238 assert.isTrue(hasAttribute, 'attribute not visible');239 const datasetValue = await pageB.evaluate(() => document.body.dataset.camelCase);240 assert.equal(datasetValue, 'kebab-case',241 'The data-camel-case property is not \'kebab-case\'');242 const attributeValue = await pageB.evaluate(() =>243 document.body.getAttribute('data-camel-case'));244 assert.equal(attributeValue, 'kebab-case',245 'The data-camel-case attribute is not \'kebab-case\'');246 });...
2-transient.js
Source:2-transient.js
...28 await pageA.evaluate(() => {29 const t = document.createElement('transient');30 document.body.appendChild(t);31 });32 const containsTransientTag = await util.waitForFunction(pageA,33 () => document.body.innerHTML.trim() === '<transient></transient>');34 assert.isTrue(containsTransientTag);35 });36 it('transient tag should not be visible to other clients', async () => {37 const containsTransientTag = await util.waitForFunction(pageB,38 () => document.body.innerHTML.trim() === '<transient></transient>');39 assert.isFalse(containsTransientTag);40 });41 it('regular tag should be visible on all clients', async () => {42 await pageA.evaluate(() => {43 const span = document.createElement('span');44 document.body.appendChild(span);45 });46 const containsDivTagA = await util.waitForFunction(pageA,47 () => document.body.querySelector('body > transient + span'));48 assert.isTrue(containsDivTagA);49 const containsDivTagB = await util.waitForFunction(pageB,50 () => document.body.querySelector('body > span'));51 assert.isTrue(containsDivTagB);52 });53 it('can insert div into transient tag', async () => {54 await pageA.evaluate(() => {55 const t = document.querySelector('transient');56 const d = document.createElement('div');57 t.appendChild(d);58 });59 const containsTransientTag = await util.waitForFunction(pageA,60 () => document.body.querySelector('transient > div'));61 assert.isTrue(containsTransientTag);62 });63 it('transient tag should still not be visible to other clients', async () => {64 const containsTransientTag = await util.waitForFunction(pageB,65 () => document.body.querySelector('transient'));66 assert.isFalse(containsTransientTag);67 });68 it('can set transient attribute on body', async () => {69 await pageA.evaluate(() => {70 document.body.setAttribute('transient-foo', 'bar');71 });72 const hasTransientAttribute = await util.waitForFunction(pageA,73 () => document.body.getAttribute('transient-foo') === 'bar');74 assert.isTrue(hasTransientAttribute);75 });76 it('transient attribute should not be visible on other clients', async () => {77 const hasTransientAttribute = await util.waitForFunction(pageB,78 () => document.body.hasAttribute('transient-foo'));79 assert.isFalse(hasTransientAttribute);80 });81 it('regular attribute should be visible on all clients', async () => {82 await pageA.evaluate(() => {83 document.body.setAttribute('regular-foo', 'bar');84 });85 const hasTransientAttributeA = await util.waitForFunction(pageA,86 () => document.body.hasAttribute('regular-foo'));87 assert.isTrue(hasTransientAttributeA);88 const hasTransientAttributeB = await util.waitForFunction(pageB,89 () => document.body.hasAttribute('regular-foo'));90 assert.isTrue(hasTransientAttributeB);91 });92 it('should be able to define custom transient attributes and elements', async () => {93 let error = false;94 pageA.on('pageerror', _error => error = ['pageA', _error]);95 pageB.on('pageerror', _error => error = ['pageB', _error]);96 await pageA.evaluate(() => {97 const script = document.createElement('script');98 script.innerHTML =`webstrate.on('loaded', () => {99 const isTransientAttribute = webstrate.config.isTransientAttribute;100 webstrate.config.isTransientAttribute = (DOMNode, attributeName) =>101 attributeName.startsWith('custom-') || isTransientAttribute(DOMNode, attributeName);102 const isTransientElement = webstrate.config.isTransientElement;103 webstrate.config.isTransientElement = (DOMNode) =>104 DOMNode.tagName.toLowerCase() === 'custom' || isTransientElement(DOMNode);105 });`;106 document.head.appendChild(script);107 });108 await util.sleep(.5);109 assert.equal(error, false, 'error before reload: ' + error);110 await pageA.reload({ waitUntil: 'networkidle2' });111 await util.sleep(.5);112 assert.equal(error, false, 'error after reload: ' + error);113 });114 it('can set custom-transient attribute on body', async () => {115 await pageA.evaluate(() => {116 document.body.setAttribute('custom-foo', 'bar');117 });118 const hasCustomAttribute = await util.waitForFunction(pageA,119 () => document.body.getAttribute('custom-foo') === 'bar');120 assert.isTrue(hasCustomAttribute);121 });122 it('custom-transient attribute should not be be visible on other clients', async () => {123 const hasCustomAttribute = await util.waitForFunction(pageB,124 () => document.body.getAttribute('custom-foo') === 'bar');125 assert.isFalse(hasCustomAttribute);126 });127 it('other regular attributes should still be visible on all clients', async () => {128 await pageA.evaluate(() => {129 document.body.setAttribute('other-foo', 'bar');130 });131 const hasTransientAttributeA = await util.waitForFunction(pageA,132 () => document.body.hasAttribute('other-foo'));133 assert.isTrue(hasTransientAttributeA);134 const hasTransientAttributeB = await util.waitForFunction(pageB,135 () => document.body.hasAttribute('other-foo'));136 assert.isTrue(hasTransientAttributeB);137 });138 it('can insert custom-transient tag into body', async () => {139 await pageA.evaluate(() => {140 const c = document.createElement('custom');141 document.body.appendChild(c);142 });143 const containsCustomTransientTag = await util.waitForFunction(pageA,144 () => document.body.querySelector('custom'));145 assert.isTrue(containsCustomTransientTag);146 });147 it('custom-transient tag should not be visible to other clients', async () => {148 const containsCustomTransientTag = await util.waitForFunction(pageB,149 () => document.body.querySelector('custom'));150 assert.isFalse(containsCustomTransientTag);151 });152 it('other regular tag should still be visible on all clients', async () => {153 await pageA.evaluate(() => {154 const other = document.createElement('other');155 document.body.appendChild(other);156 });157 // We don't check for `body > transient + span + custom + other` here, because we've reloaded,158 // so the `transient` tag should be gone.159 const containsOtherTagA = await util.waitForFunction(pageA,160 () => document.body.querySelector('body > span + custom + other'));161 assert.isTrue(containsOtherTagA);162 const containsOtherTagB = await util.waitForFunction(pageB,163 () => document.body.querySelector('body > span + other'));164 assert.isTrue(containsOtherTagB);165 });...
screenshots.js
Source:screenshots.js
...8 onboarding: async () => page.click('[href="/onboarding"]', {waitUntil: 'domcontentloaded'}),9 u: async () => {10 await page.click('[href="/logobutton"]', {waitUntil: 'domcontentloaded'});11 await page.click('#random-instance-button', {waitForFunction: 'domcontentloaded'});12 await page.waitForFunction('document.querySelector("button.udashboard-logo-btn") !== null');13 return {14 funds: async () => {15 await page.click('button.udashboard-logo-btn', {waitForFunction: 'domcontentloaded'});16 return {17 send: async () => page.click('button.funds-send', {waitForFunction: 'domcontentloaded'}),18 };19 },20 devices: async () => {21 await page.click('button.udashboard-logo-btn', {waitForFunction: 'domcontentloaded'});22 await page.click('a.udashboard-tab-devices', {waitForFunction: 'domcontentloaded'});23 await sleep(1000);24 },25 backup: async () => {26 await page.click('button.udashboard-logo-btn', {waitForFunction: 'domcontentloaded'});27 await page.click('a.udashboard-tab-backup', {waitForFunction: 'domcontentloaded'});28 await sleep(1000);29 return {30 generate: async () => {31 await page.click('button.backup-btn', {waitForFunction: 'domcontentloaded'});32 await page.waitForFunction('document.querySelector("button.backup-print-btn") !== null');33 },34 };35 },36 };37 },38 wallet: async () => page.click('[href="/walletselector"]', {waitUntil: 'domcontentloaded'}),39 keyboard: async () => page.click('[href="/keyboard"]', {waitUntil: 'domcontentloaded'}),40 topup: async () => {41 await page.click('[href="/topUp"]', {waitUntil: 'domcontentloaded'});42 await page.click('button#show-topup-button-0', {waitUntil: 'domcontentloaded'});43 return {44 crypto: async () => page.click('label#topup-btn-crypto', {waitForFunction: 'domcontentloaded'}),45 fiat: async () => page.click('label#topup-btn-fiat', {waitForFunction: 'domcontentloaded'}),46 };...
e2e.test.js
Source:e2e.test.js
...51 await page.goto(url);52 // Add53 const plus = await page.$('button[class=new]');54 plus.click();55 await page.waitForFunction(() => !document.querySelector('div.modal-add-update').classList.contains('hidden'));56 const name = await page.$('textarea[id=description]');57 await name.type('Lock, stock and two smoking barrels');58 const save = await page.$('button[class=save]');59 save.click();60 await page.waitForFunction(() => document.querySelector('div.modal-add-update').classList.contains('hidden'));61 await page.waitForFunction(() => (document.querySelector('.column-item-title').textContent === 'Lock, stock and two smoking barrels'));62 // Update63 const update = await page.$('svg[class=column-item-actions-update]');64 update.click();65 await page.waitForFunction(() => !document.querySelector('div.modal-add-update').classList.contains('hidden'));66 await name.click({ clickCount: 3 });67 await name.type('Pulp fiction');68 save.click();69 await page.waitForFunction(() => document.querySelector('div.modal-add-update').classList.contains('hidden'));70 await page.waitForFunction(() => (document.querySelector('.column-item-title').textContent === 'Pulp fiction'));71 // Delete72 const remove = await page.$('svg[class=column-item-actions-delete]');73 remove.click();74 await page.waitForFunction(() => !document.querySelector('div.modal-delete').classList.contains('hidden'));75 const destroy = await page.$('button[class=delete]');76 destroy.click();77 await page.waitForFunction(() => document.querySelector('div.modal-delete').classList.contains('hidden'));78 await page.waitForFunction(() => !(document.querySelector('.column-item-title')));79 // Error80 plus.click();81 await page.waitForFunction(() => !document.querySelector('div.modal-add-update').classList.contains('hidden'));82 await name.type('1');83 await name.press('Backspace');84 await page.waitForFunction(() => !document.querySelector('.error-description').classList.contains('hidden'));85 await page.waitForFunction(() => document.querySelector('.save').disabled);86 });87 });...
buttons.test.js
Source:buttons.test.js
...19 it( 'dismisses link editor when escape is pressed', async () => {20 // Regression: https://github.com/WordPress/gutenberg/pull/1988521 await insertBlock( 'Buttons' );22 await pressKeyWithModifier( 'primary', 'k' );23 await page.waitForFunction(24 () => !! document.activeElement.closest( '.block-editor-url-input' )25 );26 await page.keyboard.press( 'Escape' );27 await page.waitForFunction(28 () =>29 document.activeElement ===30 document.querySelector( '.block-editor-rich-text__editable' )31 );32 await page.keyboard.type( 'WordPress' );33 expect( await getEditedPostContent() ).toMatchSnapshot();34 } );35 it( 'moves focus from the link editor back to the button when escape is pressed after the URL has been submitted', async () => {36 // Regression: https://github.com/WordPress/gutenberg/issues/3430737 await insertBlock( 'Buttons' );38 await pressKeyWithModifier( 'primary', 'k' );39 await page.waitForFunction(40 () => !! document.activeElement.closest( '.block-editor-url-input' )41 );42 await page.keyboard.type( 'https://example.com' );43 await page.keyboard.press( 'Enter' );44 await page.waitForFunction(45 () =>46 document.activeElement ===47 document.querySelector(48 '.block-editor-link-control a[href="https://example.com"]'49 )50 );51 await page.keyboard.press( 'Escape' );52 // Focus should move from the link control to the button block's text.53 await page.waitForFunction(54 () =>55 document.activeElement ===56 document.querySelector( '[aria-label="Button text"]' )57 );58 // The link control should still be visible when a URL is set.59 const linkControl = await page.$( '.block-editor-link-control' );60 expect( linkControl ).toBeTruthy();61 } );62 it( 'can jump to the link editor using the keyboard shortcut', async () => {63 await insertBlock( 'Buttons' );64 await page.keyboard.type( 'WordPress' );65 await pressKeyWithModifier( 'primary', 'k' );66 await page.keyboard.type( 'https://www.wordpress.org/' );67 await page.keyboard.press( 'Enter' );...
mainClient.int.js
Source:mainClient.int.js
...3};4describe('Hashi integration', () => {5 it('should not be ready if the iframe has not loaded', async () => {6 await page.goto(url('iframeunloaded'));7 await page.waitForFunction('Boolean(window.hashi)');8 expect(await page.evaluate('window.hashi.ready')).toBe(false);9 });10 it('should be ready if the ready event has been triggered', async () => {11 await page.goto(url('iframeloaded'));12 await page.waitForFunction('Boolean(window.hashi)');13 await page.waitForFunction('window.hashi.ready === true');14 expect(await page.evaluate('window.hashi.ready')).toBe(true);15 });16 it('should synchronize localstorage from inside the iframe to the hashi storage', async () => {17 await page.goto(url('iframelocalstorage'));18 await page.waitForFunction('Boolean(window.hashi)');19 await page.waitForFunction('window.hashi.ready === true');20 await page.waitForFunction('Boolean(window.data)');21 expect(await page.evaluate('window.data.localStorage.test')).toBe('this is a test');22 });23 it('should synchronize cookie from inside the iframe to the hashi storage', async () => {24 await page.goto(url('iframecookie'));25 await page.waitForFunction('Boolean(window.hashi)');26 await page.waitForFunction('window.hashi.ready === true');27 await page.waitForFunction('Boolean(window.data)');28 expect(await page.evaluate('window.data.cookie.rootCookies.test.value')).toBe('this is a test');29 });...
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.waitForFunction(() => {7 return document.querySelector('text="Get started"') !== null;8 });9 await browser.close();10})();11const { chromium } = require('playwright');12(async () => {13 const browser = await chromium.launch();14 const context = await browser.newContext();15 const page = await context.newPage();16 await page.waitForSelector('text="Get started"');17 await browser.close();18})();19const { chromium } = require('playwright');20(async () => {21 const browser = await chromium.launch();22 const context = await browser.newContext();23 const page = await context.newPage();24 await page.waitFor(() => {25 return document.querySelector('text="Get started"') !== null;26 });27 await browser.close();28})();29const { chromium } = require('playwright');30(async () => {31 const browser = await chromium.launch();32 const context = await browser.newContext();33 const page = await context.newPage();34 await browser.close();35})();36const { chromium } = require('playwright');37(async () => {38 const browser = await chromium.launch();39 const context = await browser.newContext();40 const page = await context.newPage();41 await page.waitForLoadState('load');42 await browser.close();43})();44const { chromium } = require('playwright');
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.evaluate(() => {7 window['counter'] = 0;8 window['increment'] = () => window['counter']++;9 document.querySelector('button').addEventListener('click', window['increment']);10 });11 await Promise.all([12 page.waitForFunction(() => window['counter'] === 2),13 page.click('button'),14 page.click('button'),15 ]);16 await browser.close();17})();
Using AI Code Generation
1const playwright = require('playwright');2(async () => {3 for (const browserType of BROWSER) {4 const browser = await playwright[browserType].launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await page.waitForFunction(() => {8 return document.querySelector('input').value === 'my text';9 });10 await browser.close();11 }12})();13const playwright = require('playwright');14(async () => {15 for (const browserType of BROWSER) {16 const browser = await playwright[browserType].launch();17 const context = await browser.newContext();18 const page = await context.newPage();19 await page.waitForFunction(() => {20 return document.querySelector('input').value === 'my text';21 });22 await browser.close();23 }24})();25const playwright = require('playwright');26(async () => {27 for (const browserType of BROWSER) {28 const browser = await playwright[browserType].launch();29 const context = await browser.newContext();30 const page = await context.newPage();31 await page.waitForFunction(() => {32 return document.querySelector('input').value === 'my text';33 });34 await browser.close();35 }36})();37const playwright = require('playwright');38(async () => {39 for (const browserType of BROWSER) {40 const browser = await playwright[browserType].launch();41 const context = await browser.newContext();42 const page = await context.newPage();43 await page.waitForFunction(() => {44 return document.querySelector('input').value === 'my text';45 });46 await browser.close();47 }48})();49const playwright = require('playwright');50(async () => {51 for (const browserType of BROWSER) {52 const browser = await playwright[browserType].launch();53 const context = await browser.newContext();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.waitForFunction(() => document.readyState === 'complete');7 await page.waitForFunction(() => document.querySelector('input[name="q"]').offsetWidth > 0);8 await browser.close();9})();10const { chromium } = require('playwright');11(async () => {12 const browser = await chromium.launch({ headless: false });13 const context = await browser.newContext();14 const page = await context.newPage();15 await page.waitForSelector('input[name="q"]');16 await browser.close();17})();18const { chromium } = require('playwright');19(async () => {20 const browser = await chromium.launch({ headless: false });21 const context = await browser.newContext();22 const page = await context.newPage();23 await page.waitFor('input[name="q"]');24 await browser.close();25})();26const { chromium } = require('playwright');27(async () => {28 const browser = await chromium.launch({ headless: false });29 const context = await browser.newContext();30 const page = await context.newPage();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const page = await browser.newPage();5 const [response] = await Promise.all([6 page.waitForResponse('**/json'),7 page.click('text=Sign in'),8 ]);9 console.log(response.url());10 await browser.close();11})();12const { chromium } = require('playwright');13(async () => {14 const browser = await chromium.launch({ headless: false });15 const page = await browser.newPage();16 await page.waitForFunction(() => document.querySelector('input[name="q"]').value === 'playwright');17 await browser.close();18})();19const { chromium } = require('playwright');20(async () => {21 const browser = await chromium.launch({ headless: false });22 const page = await browser.newPage();23 await page.waitForFunction(() => document.querySelector('input[name="q"]').value === 'playwright', { polling: 'mutation' });24 await browser.close();25})();26const { chromium } = require('playwright');27(async () => {28 const browser = await chromium.launch({ headheadless: false });29 const page = await browser.newPage();30 await page.waitForFunction(() => document.querySelector('input[name="q"]').value === 'playwright', { polling: 'raf' });31 await browser.close();32})();33const { chromium } = require('playwright');34(async () => {35 const browser = await chromium.launch({ headheadless: false });36 const page = await browser.newPage();37 await page.waitForFunction(() => document.querySelector('input[name="q"]').value === 'playwright', { polling: 'idle' });38 await browser.close();39})();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const page = await browser.newPage();5 await page.click('input[name="q"]');6 await page.keyboard.type('Hello World');7 await page.waitForFunction(() => {8 return document.querySelector('input[name="q"]').value === 'Hello World';9 });10 await browser.close();11})();12const { chromium } = require('playwright');13(async () => {14 const browser = await chromium.launch();15 const page = await browser.newPage();16 await page.click('input[name="q"]');17 await page.keyboard.type('Hello World');18 await page.waitForFunction(() => {19 return document.querySelector('input[name="q"]').value === 'Hello World';20 }, { polling: 'raf' });21 await browser.close();22})();23const { chromium } = require('playwright');24(async () => {25 const browser = await chromium.launch();26 const page = await browser.newPage();27 await page.click('input[name="q"]');28 await page.keyboard.type('Hello World');29 await page.waitForFunction(() => {30 return document.querySelector('input[name="q"]').value === 'Hello World';31 }, { polling: 'mutation' });32 await browser.close();33})();34const { chromium } = require('playwright');35(async () => {36 const browser = await chromium.launch();37 const page = await browser.newPage();38 await page.click('input[name="q"]');39 await page.keyboard.type('Hello World');40 await page.waitForFunction(() => {41 return document.querySelector('input[name="q"]').value === 'Hello World';42 }, { polling: 'mutation', timeout: 1000 });43 await browser.close();44})();45const { chromium } = require('playwright');46(async () => {47 const browser = await chromium.launch();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch({ headless: false });4 const page = await browser.newPage();5 await page.waitForFunction(() => {6 const element = document.querySelector('h1');7 return element.innerText === 'Example Domain';8 });9 await browser.close();10})();11const { chromium } = require('playwright');12(async () => {13 const browser = await chromium.launch({ headless: false });14 const page = await browser.newPage();15 await page.waitForFunction(() => {16 const element = document.querySelector('h1');17 return element.innerText === 'Example Domain';18 });19 await browser.close();20})();21const { chromium } = require('playwright');22(async () => {23 const browser = await chromium.launch({ headless: false });24 const page = await browser.newPage();25 await page.waitForFunction(() => {26 const element = document.querySelector('h1');27 return element.innerText === 'Example Domain';28 });29 await browser.close();30})();31const { chromium } = require('playwright');32(async () => {33 const browser = await chromium.launch({ headless: false });34 const page = await browser.newPage();35 await page.waitForFunction(() => {36 const element = document.querySelector('h1');37 return element.innerText === 'Example Domain';38 });39 await browser.close();40})();41const { chromium } = require('playwright');42(async () => {43 const browser = await chromium.launch({ headless: false });44 const page = await browser.newPage();45 await page.waitForFunction(() => {46 const element = document.querySelector('h1');47 return element.innerText === 'Example Domain';48 });49 await browser.close();50})();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const page = await browser.newPage();5 await page.waitForFunction(() => !!document.querySelector('input[placeholder="Search"]'));6 await page.fill('input[placeholder="Search"]', 'api');7 await page.waitForFunction(() => !!document.querySelector('.search-results-container'));8 await page.screenshot({ path: `search-results.png` });9 await browser.close();10})();11const { chromium } = require('playwright');12(async () => {13 const browser = await chromium.launch();14 const page = await browser.newPage();15 await page.waitForSelector('input[placeholder="Search"]');16 await page.fill('input[placeholder="Search"]', 'api');17 await page.waitForSelector('.search-results-container');18 await page.screenshot({ path: `search-results.png` });19 await browser.close();20})();21const { chromium } = require('playwright');22(async () => {23 const browser = await chromium.launch();24 const page = await browser.newPage();25 await page.waitForTimeout(3000);26 await page.screenshot({ path: `search-results.png` });27 await browser.close();28})();29const { chromium } = require('playwright');30(async () => {31 const browser = await chromium.launch();32 const page = await browser.newPage();33 await page.screenshot({ path: `search-results.png` });34 await browser.close();35})();36const { chromium } = require('playwright');37(async () => {38 const browser = await chromium.launch();39 const page = await browser.newPage();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3const browser = await chromium.launch();4const page = await browser.newPage();5await page.waitForFunction('document.querySelector("input[name=\"q\"]")');6await browser.close();7})();8const { chromium } = require('playwright');9(async () => {10const browser = await chromium.launch();11const page = await browser.newPage();12await page.waitForSelector('input[name=\"q\"]');13await browser.close();14})();15const { chromium } = require('playwright');16(async () => {17const browser = await chromium.launch();18const page = await browser.newPage();19await browser.close();20})();21const { chromium } = require('playwright');22(async () => {23const browser = await chromium.launch();24const page = await browser.newPage();25await page.waitForLoadState('domcontentloaded');26await browser.close();27})();28const { chromium } = require('playwright');29(async () => {30const browser = await chromium.launch();31const page = await browser.newPage();32await page.waitForNavigation();33await browser.close();34})();35const { chromium } = require('playwright');36(async () => {37const browser = await chromium.launch();38const page = await browser.newPage();39await browser.close();40})();41const { chromium } = require('playwright');42(async () => {43const browser = await chromium.launch();44const page = await browser.newPage();45await browser.close();46})();
Using AI Code Generation
1const { chromium } = require('playwright');2(async () => {3 const browser = await chromium.launch();4 const context = await browser.newContext();5 const page = await context.newPage();6 await page.waitForFunction(() => document.querySelector('input[name="q"]'));7 await page.screenshot({ path: 'screenshot.png' });8 await browser.close();9})();10const { chromium } = require('playwright');11(async () => {12 const browser = await chromium.launch();13 const context = await browser.newContext();14 const page = await context.newPage();15 await page.waitForFunction('document.querySelector("input[name="q"]")');16 await page.screenshot({ path: 'screenshot.png' });17 await browser.close();18})();19const { chromium } = require('playwright');20(async () => {21 const browser = await chromium.launch();22 const context = await browser.newContext();23 const page = await context.newPage();24 await page.waitForFunction('document.querySelector("input[name="q"]") && document.querySelector("input[name="q"]").offsetParent');25 await page.screenshot({ path: 'screenshot.png' });26 await browser.close();27})();28const { chromium } = require('playwright');29(async () => {30 const browser = await chromium.launch();31 const context = await browser.newContext();32 const page = await context.newPage();33 await page.waitForFunction('document.querySelector("input[name="q"]") && document.querySelector("input[name="q"]").offsetParent &&
Playwright tutorial
LambdaTest’s Playwright tutorial will give you a broader idea about the Playwright automation framework, its unique features, and use cases with examples to exceed your understanding of Playwright testing. This tutorial will give A to Z guidance, from installing the Playwright framework to some best practices and advanced concepts.
Chapters:
- What is Playwright : Playwright is comparatively new but has gained good popularity. Get to know some history of the Playwright with some interesting facts connected with it.
- How To Install Playwright : Learn in detail about what basic configuration and dependencies are required for installing Playwright and run a test. Get a step-by-step direction for installing the Playwright automation framework.
- Playwright Futuristic Features: Launched in 2020, Playwright gained huge popularity quickly because of some obliging features such as Playwright Test Generator and Inspector, Playwright Reporter, Playwright auto-waiting mechanism and etc. Read up on those features to master Playwright testing.
- What is Component Testing: Component testing in Playwright is a unique feature that allows a tester to test a single component of a web application without integrating them with other elements. Learn how to perform Component testing on the Playwright automation framework.
- Inputs And Buttons In Playwright: Every website has Input boxes and buttons; learn about testing inputs and buttons with different scenarios and examples.
- Functions and Selectors in Playwright: Learn how to launch the Chromium browser with Playwright. Also, gain a better understanding of some important functions like “BrowserContext,” which allows you to run multiple browser sessions, and “newPage” which interacts with a page.
- Handling Alerts and Dropdowns in Playwright : Playwright interact with different types of alerts and pop-ups, such as simple, confirmation, and prompt, and different types of dropdowns, such as single selector and multi-selector get your hands-on with handling alerts and dropdown in Playright testing.
- Playwright vs Puppeteer: Get to know about the difference between two testing frameworks and how they are different than one another, which browsers they support, and what features they provide.
- Run Playwright Tests on LambdaTest: Playwright testing with LambdaTest leverages test performance to the utmost. You can run multiple Playwright tests in Parallel with the LammbdaTest test cloud. Get a step-by-step guide to run your Playwright test on the LambdaTest platform.
- Playwright Python Tutorial: Playwright automation framework support all major languages such as Python, JavaScript, TypeScript, .NET and etc. However, there are various advantages to Python end-to-end testing with Playwright because of its versatile utility. Get the hang of Playwright python testing with this chapter.
- Playwright End To End Testing Tutorial: Get your hands on with Playwright end-to-end testing and learn to use some exciting features such as TraceViewer, Debugging, Networking, Component testing, Visual testing, and many more.
- Playwright Video Tutorial: Watch the video tutorials on Playwright testing from experts and get a consecutive in-depth explanation of Playwright automation testing.
Run Playwright Internal automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
