How to use screenshotPage method in Playwright Internal
Best JavaScript code snippet using playwright-internal
jiwu.test.js
Source:jiwu.test.js 
...11}12function getCaseName() {13 return expect.getState().currentTestName.split(' ').slice(1).join(' ');14}15async function screenshotPage(page, fullPage = true) {16 const caseName = getCaseName();17 await page.screenshot({18 path: getPath(caseName),19 fullPage: fullPage,20 });21}22describe('http://www.jiwu.com', () => {23 it('YL1-åºååæ¢', async () => {24 await page.goto('http://nj.jiwu.com/');25 const ele = await page.waitForXPath(26 '/html/body/header/div[2]/div[1]/div[3]',27 );28 await ele.click();29 await page.waitForNavigation();30 expect(page.url()).toBe('http://www.jiwu.com/');31 await screenshotPage(page);32 });33 it('YL2-åºåäºä¸çº§åç»æç¹å»', async () => {34 await page.goto('http://www.jiwu.com/');35 const ele = await page.waitForXPath('/html/body/div[4]/dl[1]/dd[1]/a[1]');36 const url = await (await ele.getProperty('href')).jsonValue();37 await ele.click();38 await page.waitForNavigation();39 expect(page.url()).toBe(url);40 await screenshotPage(page);41 });42 it('YL3-ä»·æ ¼æ»è§æ°æ®', async () => {43 const page = await browser.newPage();44 await page.goto('http://nj.jiwu.com/fangjia/');45 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]`);46 await ele.screenshot({47 path: getPath(getCaseName()),48 });49 });50 it('YL4-ä»·æ ¼æ»è§ææ¡', async () => {51 const page = await browser.newPage();52 await page.goto('http://nj.jiwu.com/fangjia/');53 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[1]`);54 await ele.screenshot({55 path: getPath(getCaseName()),56 });57 });58 it('YL5-ä»·æ ¼æ»è§ä»·æ ¼åå¨æé®', async () => {59 const page = await browser.newPage();60 await page.goto('http://nj.jiwu.com/fangjia/');61 const ele = await page.waitForXPath(62 `/html/body/div[5]/div[1]/div[1]/div[3]`,63 );64 await ele.click();65 await page.$('.pop-box');66 await screenshotPage(page, false);67 });68 it('YL6-æ¿ä»·èµ°å¿å¾', async () => {69 const page = await browser.newPage();70 await page.goto('http://nj.jiwu.com/fangjia/');71 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[2]`);72 await page.waitForTimeout(500);73 await ele.screenshot({74 path: getPath(getCaseName()),75 });76 });77 it('YL7-æ¿ä»·èµ°å¿å¾é¼ æ 移å¨', async () => {78 const page = await browser.newPage();79 await page.goto('http://nj.jiwu.com/fangjia/');80 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[2]`);81 const box = await ele.boundingBox();82 await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);83 await page.waitForTimeout(500);84 await ele.screenshot({85 path: getPath(getCaseName()),86 });87 });88 it('YL8-æ¿ä»·èµ°å¿å¾å¹´ä»½åæ¢', async () => {89 const page = await browser.newPage();90 await page.goto('http://nj.jiwu.com/fangjia/');91 const button = await page.waitForXPath(92 `/html/body/div[5]/div[1]/div[2]/div[2]/a[2]`,93 );94 await button.click();95 await page.waitForTimeout(500);96 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[2]`);97 await ele.screenshot({98 path: getPath(getCaseName()),99 });100 });101 it('YL9-æ¿ä»·å°å¾æ°æ¿ç»è®¡', async () => {102 const page = await browser.newPage();103 await page.goto('http://nj.jiwu.com/fangjia/');104 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[2]`);105 const box = await ele.boundingBox();106 await page.waitForTimeout(500);107 await page.mouse.click(box.x + box.width / 2 + 30, box.y + box.height - 10);108 await page.waitForTimeout(500);109 await ele.screenshot({110 path: getPath(getCaseName()),111 });112 });113 it('YL10-æ¿ä»·å°å¾äºææ¿ç»è®¡', async () => {114 const page = await browser.newPage();115 await page.goto('http://nj.jiwu.com/fangjia/');116 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[2]`);117 const box = await ele.boundingBox();118 await page.waitForTimeout(500);119 await page.mouse.click(box.x + box.width / 2 - 30, box.y + box.height - 10);120 await page.waitForTimeout(500);121 await ele.screenshot({122 path: getPath(getCaseName()),123 });124 });125 it('YL11-åºåæ¿ä»·æè¡æ°æ¿äºææ¿åæ¢', async () => {126 const page = await browser.newPage();127 await page.goto('http://nj.jiwu.com/fangjia/');128 const button = await page.waitForXPath(129 `/html/body/div[5]/div[1]/div[4]/div[2]/a[2]`,130 );131 await button.click();132 await page.waitForTimeout(500);133 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[4]`);134 await ele.screenshot({135 path: getPath(getCaseName()),136 });137 });138 it('YL12-åºåæ¿ä»·æè¡åºå跳转', async () => {139 const page = await browser.newPage();140 await page.goto('http://nj.jiwu.com/fangjia/');141 const button = await page.waitForXPath(142 `/html/body/div[5]/div[1]/div[4]/div[3]/div[1]/ul/li[2]/span[2]/a`,143 );144 const url = await (await button.getProperty('href')).jsonValue();145 await button.click();146 await page.waitForNavigation();147 expect(page.url()).toBe(url);148 await page.waitForTimeout(500);149 await screenshotPage(page);150 });151 it('YL13-åºåæ¿ä»·æè¡æ´å¤æé®', async () => {152 const page = await browser.newPage();153 await page.goto('http://nj.jiwu.com/fangjia/');154 const button = await page.waitForXPath(155 `/html/body/div[5]/div[1]/div[4]/div[3]/div[1]/a`,156 );157 await button.click();158 await page.waitForTimeout(100);159 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[4]`);160 await ele.screenshot({161 path: getPath(getCaseName()),162 });163 });164 it('YL14-åºåå¨å®æ¥¼çæè¡æ°æ¿äºææ¿åæ¢', async () => {165 const page = await browser.newPage();166 await page.goto('http://nj.jiwu.com/fangjia/');167 const button = await page.waitForXPath(168 `/html/body/div[5]/div[1]/div[5]/div[2]/a[2]`,169 );170 await button.click();171 await page.waitForTimeout(500);172 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[5]`);173 await ele.screenshot({174 path: getPath(getCaseName()),175 });176 });177 it('YL15-åºåå¨å®æ¥¼çæè¡åºå跳转', async () => {178 const page = await browser.newPage();179 await page.goto('http://nj.jiwu.com/fangjia/');180 const button = await page.waitForXPath(181 `/html/body/div[5]/div[1]/div[5]/div[3]/div[1]/ul/li[2]/span[2]/a`,182 );183 const url = await (await button.getProperty('href')).jsonValue();184 await button.click();185 await page.waitForNavigation();186 expect(page.url()).toBe(url);187 await page.waitForTimeout(500);188 await screenshotPage(page);189 });190 it('YL16-åºåå¨å®æ¥¼çæè¡æ´å¤æé®', async () => {191 const page = await browser.newPage();192 await page.goto('http://nj.jiwu.com/fangjia/');193 const button = await page.waitForXPath(194 `/html/body/div[5]/div[1]/div[5]/div[3]/div[1]/a`,195 );196 await button.click();197 await page.waitForTimeout(100);198 const ele = await page.waitForXPath(`/html/body/div[5]/div[1]/div[5]`);199 await ele.screenshot({200 path: getPath(getCaseName()),201 });202 });203 it('YL17-ä»·æ ¼åå¸è¶å¿å¾', async () => {204 const page = await browser.newPage();205 await page.goto('http://nj.jiwu.com/fangjia/');206 const ele = await page.waitForXPath('/html/body/div[5]/div[1]/div[6]');207 await page.waitForTimeout(500);208 await ele.screenshot({209 path: getPath(),210 });211 });212 it('YL18-ä»·æ ¼åå¸æ°æ¿äºææ¿åæ¢', async () => {213 const page = await browser.newPage();214 await page.goto('http://nj.jiwu.com/fangjia/');215 const ele = await page.waitForXPath('/html/body/div[5]/div[1]/div[6]');216 const button = await page.waitForXPath(217 '/html/body/div[5]/div[1]/div[6]/div[2]/a[2]',218 );219 await button.click();220 await page.waitForTimeout(500);221 await ele.screenshot({222 path: getPath(),223 });224 });225 it('YL19-äºææ¿æ交信æ¯å±ç¤ºæ°æ®', async () => {226 const page = await browser.newPage();227 await page.goto('http://nj.jiwu.com/fangjia/');228 const ele = await page.waitForXPath('/html/body/div[5]/div[1]/div[7]');229 await ele.screenshot({230 path: getPath(),231 });232 });233 it('YL20-äºææ¿æ交信æ¯æ¥çæ´å¤è·³è½¬', async () => {234 const page = await browser.newPage();235 await page.goto('http://nj.jiwu.com/fangjia/');236 const button = await page.waitForXPath(237 '/html/body/div[5]/div[1]/div[7]/div[1]/a',238 );239 await button.click();240 await page.waitForNavigation();241 await screenshotPage(page);242 });243 it('YL21-äºææ¿æ交信æ¯ç¿»é¡µ', async () => {244 const page = await browser.newPage();245 await page.goto('http://nj.jiwu.com/jilu/');246 const button = await page.waitForXPath('//*[@id="pagination"]/div/a[4]');247 await button.click();248 await page.waitForNavigation();249 await screenshotPage(page);250 });251 it('YL22-æ¿äº§å¿«è®¯', async () => {252 const page = await browser.newPage();253 await page.goto('http://nj.jiwu.com/fangjia/');254 const ele = await page.waitForXPath('/html/body/div[5]/div[2]/div[1]');255 await ele.screenshot({256 path: getPath(),257 });258 });259 it('YL23-æ¿äº§å¿«è®¯é¼ æ 移å¨é«äº®', async () => {260 const page = await browser.newPage();261 await page.goto('http://nj.jiwu.com/fangjia/');262 const ele = await page.waitForXPath('/html/body/div[5]/div[2]/div[1]');263 const button = await page.waitForXPath(264 '/html/body/div[5]/div[2]/div[1]/ul/li[1]/a',265 );266 const box = await button.boundingBox();267 await page.mouse.move(box.x + box.width / 2, box.y + box.height / 2);268 await ele.screenshot({269 path: getPath(),270 });271 });272 it('YL24-æ¿äº§å¿«è®¯ç¹å»è·³è½¬', async () => {273 const page = await browser.newPage();274 await page.goto('http://nj.jiwu.com/fangjia/');275 const button = await page.waitForXPath(276 '/html/body/div[5]/div[2]/div[1]/ul/li[1]/a',277 );278 const url = await (await button.getProperty('href')).jsonValue();279 await page.goto(url);280 await screenshotPage(page);281 });282 it('YL25-ä¼éæ°æ¿ææ¡', async () => {283 const page = await browser.newPage();284 await page.goto('http://nj.jiwu.com/fangjia/');285 const ele = await page.waitForXPath('/html/body/div[5]/div[2]/div[2]');286 await ele.screenshot({287 path: getPath(),288 });289 });290 it('YL26-ä¼éæ°æ¿æ¥çå
¨å±', async () => {291 const page = await browser.newPage();292 await page.goto('http://nj.jiwu.com/fangjia/');293 const button = await page.waitForXPath(294 '/html/body/div[5]/div[2]/div[2]/div/a',295 );296 await button.click();297 await page.waitForNavigation();298 await screenshotPage(page);299 });300 it('YL27-ä¼éæ°æ¿è¯¦ç»é¡µ', async () => {301 const page = await browser.newPage();302 await page.goto('http://nj.jiwu.com/fangjia/');303 const button = await page.waitForXPath(304 '/html/body/div[5]/div[2]/div[2]/ul/li[1]/a',305 );306 const url = await (await button.getProperty('href')).jsonValue();307 await page.goto(url);308 await screenshotPage(page);309 });310 it('YL28-ä¼éæ°æ¿è¯¦æ
页缩ç¥å¾', async () => {311 const page = await browser.newPage();312 await page.goto('http://nj.jiwu.com/fangjia/');313 const button = await page.waitForXPath(314 '/html/body/div[5]/div[2]/div[2]/ul/li[1]/a',315 );316 const url = await (await button.getProperty('href')).jsonValue();317 await page.goto(url);318 const thumb = await page.waitForXPath(319 `//*[@id="lpan_banner"]/div[2]/div[3]`,320 );321 await thumb.screenshot({322 path: getPath(),323 });324 });325 it('YL29-ä¼éæ°æ¿è¯¦æ
页缩ç¥å¾ç¹å»åæ¢', async () => {326 const page = await browser.newPage();327 await page.goto('http://nj.jiwu.com/fangjia/');328 const button = await page.waitForXPath(329 '/html/body/div[5]/div[2]/div[2]/ul/li[1]/a',330 );331 const url = await (await button.getProperty('href')).jsonValue();332 await page.goto(url);333 const thumbButton = await page.waitForXPath(334 `//*[@id="lpan_banner"]/div[2]/div[3]/ul/li[2]/img`,335 );336 await thumbButton.click();337 const ele = await page.waitForXPath(`//*[@id="lpan_banner"]`);338 await ele.screenshot({339 path: getPath(),340 });341 });342 it('YL30-ä¼éäºææ¿ææ¡', async () => {343 const page = await browser.newPage();344 await page.goto('http://nj.jiwu.com/fangjia/');345 const ele = await page.waitForXPath('/html/body/div[5]/div[2]/div[3]');346 await ele.screenshot({347 path: getPath(),348 });349 });350 it('YL31-ä¼éäºææ¿æ¥çå
¨é¨', async () => {351 const page = await browser.newPage();352 await page.goto('http://nj.jiwu.com/fangjia/');353 const button = await page.waitForXPath(354 '/html/body/div[5]/div[2]/div[3]/div/a',355 );356 await button.click();357 await page.waitForNavigation();358 await screenshotPage(page);359 });360 it('YL32-ä¼éäºææ¿è¯¦ç»é¡µ', async () => {361 const page = await browser.newPage();362 await page.goto('http://nj.jiwu.com/fangjia/');363 const button = await page.waitForXPath(364 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',365 );366 const url = await (await button.getProperty('href')).jsonValue();367 await page.goto(url);368 await screenshotPage(page);369 });370 it('YL33-ä¼éäºææ¿ç¼©ç¥å¾', async () => {371 const page = await browser.newPage();372 await page.goto('http://nj.jiwu.com/fangjia/');373 const button = await page.waitForXPath(374 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',375 );376 const url = await (await button.getProperty('href')).jsonValue();377 await page.goto(url);378 const thumb = await page.waitForXPath(`//*[@id="imgs-box"]/div[2]/div[2]`);379 await thumb.screenshot({380 path: getPath(),381 });382 });383 it('YL34-ä¼éäºææ¿è¯¦æ
页缩ç¥å¾ç¹å»åæ¢', async () => {384 const page = await browser.newPage();385 await page.goto('http://nj.jiwu.com/fangjia/');386 const button = await page.waitForXPath(387 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',388 );389 const url = await (await button.getProperty('href')).jsonValue();390 await page.goto(url);391 const thumbButton = await page.waitForXPath(392 `//*[@id="imgs-box"]/div[2]/div[2]/div/ul/li[2]/a/img`,393 );394 await thumbButton.click();395 // çå¾
effect ææ396 await page.waitForTimeout(200);397 const ele = await page.waitForXPath(398 '/html/body/div[3]/div[1]/div[2]/div[1]/div[1]/div',399 );400 await ele.screenshot({401 path: getPath(),402 });403 });404 it('YL35-ä¼éäºææ¿å
³æ³¨æ¿æº', async () => {405 const page = await browser.newPage();406 await page.goto('http://nj.jiwu.com/fangjia/');407 const link = await page.waitForXPath(408 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',409 );410 const url = await (await link.getProperty('href')).jsonValue();411 await page.goto(url);412 const button = await page.waitForXPath(413 '/html/body/div[3]/div[1]/div[1]/div[2]/span[1]/a',414 );415 await button.click();416 const modal = await page.$('.pop-wrap');417 const title = await page.evaluate(418 (ele) => ele.textContent,419 await modal.$('.tit'),420 );421 await screenshotPage(page, false);422 expect(title).toBe('å
³æ³¨æ¿æº');423 });424 it('YL36-ä¼éäºææ¿è·ååºä»·', async () => {425 const page = await browser.newPage();426 await page.goto('http://nj.jiwu.com/fangjia/');427 const link = await page.waitForXPath(428 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',429 );430 const url = await (await link.getProperty('href')).jsonValue();431 await page.goto(url);432 const button = await page.waitForXPath(433 '/html/body/div[3]/div[1]/div[1]/div[2]/span[2]/a',434 );435 await button.click();436 const modal = await page.$('.pop-wrap');437 const title = await page.evaluate(438 (ele) => ele.textContent,439 await modal.$('.tit'),440 );441 await screenshotPage(page, false);442 expect(title).toBe('è·ååºä»·');443 });444 it('YL37-ä¼éäºææ¿é¢çº¦çæ¿', async () => {445 const page = await browser.newPage();446 await page.goto('http://nj.jiwu.com/fangjia/');447 const link = await page.waitForXPath(448 '/html/body/div[5]/div[2]/div[3]/ul/li[1]/a',449 );450 const url = await (await link.getProperty('href')).jsonValue();451 await page.goto(url);452 const button = await page.waitForXPath(453 '/html/body/div[3]/div[1]/div[2]/div[2]/div[1]/ul[2]/li[4]/a',454 );455 await button.click();456 const modal = await page.$('.pop-wrap');457 const title = await page.evaluate(458 (ele) => ele.textContent,459 await modal.$('.tit'),460 );461 await screenshotPage(page, false);462 expect(title).toBe('é¢çº¦çæ¿');463 });464 it('YL38-ç½®ä¸ç®¡å®¶é¡¾é®ä¿¡æ¯', async () => {465 const page = await browser.newPage();466 await page.goto('http://suzhou.jiwu.com/zygj/');467 await screenshotPage(page);468 });469 it('YL39-ç½®ä¸ç®¡å®¶è·³è½¬ä¿¡æ¯è¯¦ç»é¡µ', async () => {470 const page = await browser.newPage();471 await page.goto('http://suzhou.jiwu.com/zygj/');472 const button = await page.waitForXPath(473 '/html/body/div[2]/div/div[1]/div[1]/ul/li[1]/div[1]/p[1]/a[1]',474 );475 await button.click();476 await page.waitForNavigation();477 await screenshotPage(page);478 });479 it('YL40-ç½®ä¸ç®¡å®¶å¨è¯¢æé®', async () => {480 const page = await browser.newPage();481 await page.goto('http://suzhou.jiwu.com/zygj/');482 const button = await page.waitForXPath(483 '/html/body/div[2]/div/div[1]/div[1]/ul/li[1]/div[1]/p[1]/a[1]',484 );485 await button.click();486 await page.waitForNavigation();487 const zixunButton = await page.waitForXPath(488 '/html/body/div[3]/div[1]/div[1]/div/div[1]/a',489 );490 await page.$eval('.panel-login', (ele) => {491 return ele.style.display === 'none';492 });493 await zixunButton.click();494 await page.$eval('.panel-login', (ele) => {495 return ele.style.display !== 'none';496 });497 await screenshotPage(page, false);498 });499 it('YL41-ç½®ä¸ç®¡å®¶æ»å¨æ¡ä¿¡æ¯', async () => {500 const page = await browser.newPage();501 await page.goto('http://suzhou.jiwu.com/zygj/');502 const button = await page.waitForXPath(503 '/html/body/div[2]/div/div[1]/div[1]/ul/li[1]/div[1]/p[1]/a[1]',504 );505 await button.click();506 await page.waitForNavigation();507 const dynamicInfo = await page.waitForXPath(508 '/html/body/div[3]/div[1]/div[2]/div',509 );510 await dynamicInfo.screenshot({511 path: getPath(`${getCaseName()}-æ»å¨å`),...
shooter.js
Source:shooter.js
...34 function hideUIFrame() {35 ui.iframe.hide();36 return Promise.resolve(null);37 }38 function screenshotPage(dataUrl, selectedPos, type, screenshotTaskFn) {39 let promise = Promise.resolve(dataUrl);40 if (!dataUrl) {41 promise = callBackground(42 "screenshotPage",43 selectedPos.toJSON(),44 type,45 window.devicePixelRatio46 );47 }48 catcher.watchPromise(49 promise.then(dataLoc => {50 screenshotTaskFn(dataLoc);51 })52 );53 }54 exports.downloadShot = function(selectedPos, previewDataUrl, type) {55 const shotPromise = previewDataUrl56 ? Promise.resolve(previewDataUrl)57 : hideUIFrame();58 catcher.watchPromise(59 shotPromise.then(dataUrl => {60 screenshotPage(dataUrl, selectedPos, type, url => {61 let typeFromDataUrl = blobConverters.getTypeFromDataUrl(url);62 typeFromDataUrl = typeFromDataUrl63 ? typeFromDataUrl.split("/", 2)[1]64 : null;65 shotObject.delAllClips();66 shotObject.addClip({67 createdDate: Date.now(),68 image: {69 url,70 type: typeFromDataUrl,71 location: selectedPos,72 },73 });74 ui.triggerDownload(url, shotObject.filename);75 uicontrol.deactivate();76 });77 })78 );79 };80 exports.preview = function(selectedPos, type) {81 catcher.watchPromise(82 hideUIFrame().then(dataUrl => {83 screenshotPage(dataUrl, selectedPos, type, url => {84 ui.iframe.usePreview();85 ui.Preview.display(url);86 });87 })88 );89 };90 let copyInProgress = null;91 exports.copyShot = function(selectedPos, previewDataUrl, type) {92 // This is pretty slow. We'll ignore additional user triggered copy events93 // while it is in progress.94 if (copyInProgress) {95 return;96 }97 // A max of five seconds in case some error occurs.98 copyInProgress = setTimeout(() => {99 copyInProgress = null;100 }, 5000);101 const unsetCopyInProgress = () => {102 if (copyInProgress) {103 clearTimeout(copyInProgress);104 copyInProgress = null;105 }106 };107 const shotPromise = previewDataUrl108 ? Promise.resolve(previewDataUrl)109 : hideUIFrame();110 catcher.watchPromise(111 shotPromise.then(dataUrl => {112 screenshotPage(dataUrl, selectedPos, type, url => {113 const blob = blobConverters.dataUrlToBlob(url);114 catcher.watchPromise(115 callBackground("copyShotToClipboard", blob).then(() => {116 uicontrol.deactivate();117 unsetCopyInProgress();118 }, unsetCopyInProgress)119 );120 });121 })122 );123 };124 exports.sendEvent = function(...args) {125 const maybeOptions = args[args.length - 1];126 if (typeof maybeOptions === "object") {...
screenshot.js
Source:screenshot.js
...22 });23 return nodeList;24 }2526 function screenshotPage() {27 urlsToAbsolute(document.images);28 urlsToAbsolute(document.querySelectorAll("link[rel='stylesheet']"));29 var screenshot = document.documentElement.cloneNode(true);30 var b = document.createElement('base');31 b.href = document.location.protocol + '//' + location.host;32 var head = screenshot.querySelector('head');33 head.insertBefore(b, head.firstChild);34 screenshot.style.pointerEvents = 'none';35 screenshot.style.overflow = 'hidden';36 screenshot.style.webkitUserSelect = 'none';37 screenshot.style.mozUserSelect = 'none';38 screenshot.style.msUserSelect = 'none';39 screenshot.style.oUserSelect = 'none';40 screenshot.style.userSelect = 'none';41 screenshot.dataset.scrollX = window.scrollX;42 screenshot.dataset.scrollY = window.scrollY;43 var script = document.createElement('script');44 script.textContent = '(' + addOnPageLoad_.toString() + ')();';45 screenshot.querySelector('body').appendChild(script);46 var blob = new Blob([screenshot.outerHTML], {47 type: 'text/html'48 });49 return blob;50 }5152 function addOnPageLoad_() {53 window.addEventListener('DOMContentLoaded', function (e) {54 var scrollX = document.documentElement.dataset.scrollX || 0;55 var scrollY = document.documentElement.dataset.scrollY || 0;56 window.scrollTo(scrollX, scrollY);57 });58 }5960 function generate() {61 window.URL = window.URL || window.webkitURL;62 window.open(window.URL.createObjectURL(screenshotPage()));63 }64 exports.screenshotPage = screenshotPage;65 exports.generate = generate;
...
webpage-screenshot.js
Source:webpage-screenshot.js
...59 })60 }61 function generate () {62 window.URL = window.URL || window.webkitURL63 window.open(window.URL.createObjectURL(screenshotPage()))64 }65 exports.screenshotPage = screenshotPage66 exports.generate = generate...
java.js
Source:java.js
...20 }21 });22 return nodeList;23 }24 function screenshotPage() {25 var wrapper = document.getElementById('wrapper');26 html2canvas(wrapper, {27 onrendered: function(canvas) {28 canvas.toBlob(function(blob) {29 saveAs(blob, 'myScreenshot.png');30 });31 }32 });33 }34 function addOnPageLoad_() {35 window.addEventListener('DOMContentLoaded', function(e) {36 var scrollX = document.documentElement.dataset.scrollX || 0;37 var scrollY = document.documentElement.dataset.scrollY || 0;38 window.scrollTo(scrollX, scrollY);39 });40 }41 function generate() {42 console.log("burda");43 screenshotPage();44 }45 exports.screenshotPage = screenshotPage;46 exports.generate = generate;...
screenshotTracker.js
Source:screenshotTracker.js
...13 const bufferString= screenshotBuffer.toString("base64");14 setTimeout((data)=>{this.report(data)}, 50, bufferString)15 16 }, { handle: true });17 await page.addInitScript({ content: ` document.addEventListener('click', event => window.screenshotPage(event.target)); `});18 }19 report(elementData) {20 const eventData = {21 eventType: this.eventType,22 eventData: elementData23 };24 this.emit(this.eventType,JSON.stringify(eventData))25 }...
pageScreenshot.js
Source:pageScreenshot.js
1var config = require('./config').screenshot;2const puppeteer = require('puppeteer');3var textProcessor = require('./textProcessor.js');4async function screenshotPage(callback){5 const screenshotPath = config.path + textProcessor.processText(config.name);6 7 const browser = await puppeteer.launch();8 const page = await browser.newPage();9 await page.goto(config.url, {waitUntil: 'load'});10 await page.setViewport({11 width: config.viewPort.width,12 height: config.viewPort.height,13 });14 if(config.customCSS != "") await page.addStyleTag({content: config.customCSS})15 const element = await page.$(config.selector);16 await element.screenshot({path: screenshotPath});17 await browser.close();18 console.log(screenshotPath);...
App.js
Source:App.js
1import React from "react";2import Navbar from "./components/Navbar/Navbar";3import Home from "./components/Home/Home";4import Features from "./components/Features/Features";5import Benefits from "./components/Benefits/Benefits";6import ScreenshotPage from "./components/ScreenshotsPage/ScreenshotPage";7import Download from "./components/Download/Download";8import Contact from "./components/contact/contact";9import "./App.css";10function App() {11 return (12 <div className="App">13 <Navbar />14 <Home />15 <Features />16 <Benefits />17 <ScreenshotPage />18 <Download />19 <Contact />20 </div>21 );22}...
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.screenshot({ path: 'example.png' });7 await browser.close();8})();9### `screenshotPage(page, options)`10const { chromium } = require('playwright');11const { screenshotPage } = require('playwright-screenshot');12(async () => {13 const browser = await chromium.launch();14 const context = await browser.newContext();
Using AI Code Generation
1const { chromium } = require('playwright');2const fs = require('fs');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const screenshot = await page.screenshot();8 fs.writeFileSync('google.png', screenshot);9 await browser.close();10})();
Using AI Code Generation
1const { screenshotPage } = require('@playwright/test/lib/server/screenshotter');2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const screenshot = await screenshotPage(page);8 console.log(screenshot);9 await browser.close();10})();11import { chromium } from 'playwright';12import { screenshotPage } from '@playwright/test/lib/server/screenshotter';13(async () => {14 const browser = await chromium.launch();15 const context = await browser.newContext();16 const page = await context.newPage();17 const screenshot = await screenshotPage(page);18 console.log(screenshot);19 await browser.close();20})();
Using AI Code Generation
1const playwright = require('playwright');2const fs = require('fs');3(async () => {4 const browser = await playwright["chromium"].launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const screenshot = await page.screenshot({fullPage: true});8 fs.writeFileSync('test.png', screenshot);9 await browser.close();10})();11import { chromium } from 'playwright';12import * as fs from 'fs';13(async () => {14 const browser = await chromium.launch();15 const context = await browser.newContext();16 const page = await context.newPage();17 const screenshot = await page.screenshot({fullPage: true});18 fs.writeFileSync('test.png', screenshot);19 await browser.close();20})();
Using AI Code Generation
1const playwright = require('playwright');2const { screenshotPage } = require('playwright/lib/server/screenshotter');3(async () => {4 const browser = await playwright['chromium'].launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const imageBuffer = await screenshotPage(page, 'jpeg', false);8 await browser.close();9 const fs = require('fs');10 fs.writeFileSync('test.jpeg', imageBuffer);11})();
Using AI Code Generation
1const screenshotPage = require('@playwright/test').test.screenshotPage;2const { chromium } = require('playwright');3(async () => {4 const browser = await chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 await screenshotPage(page, { path: 'screenshot.png' });8 await browser.close();9})();10const test = require('@playwright/test').test;11test.fixme('this test is skipped', async ({ page }) => {12 await page.screenshot({ path: 'screenshot.png' });13});14const test = require('@playwright/test').test;15test.only('this test is only one that runs', async ({ page }) => {16 await page.screenshot({ path: 'screenshot.png' });17});18test('this test is skipped', async ({ page }) => {19 await page.screenshot({ path: 'screenshot.png' });20});21const test = require('@playwright/test').test;22test.skip('this test is skipped', async ({ page }) => {23 await page.screenshot({ path: 'screenshot.png' });24});25const test = require('@playwright/test').test;26test.use({
Using AI Code Generation
1const { screenshotPage } = require('playwright/lib/server/screenshotter');2const fs = require('fs');3(async () => {4 const browser = await playwright.chromium.launch();5 const context = await browser.newContext();6 const page = await context.newPage();7 const screenshot = await screenshotPage(page);8 fs.writeFileSync('screenshot.png', screenshot);9 await browser.close();10})();
Using AI Code Generation
1const { screenshotPage } = require('@playwright/test/lib/screenshotter');2const path = require('path');3const fs = require('fs');4const { chromium } = require('playwright');5(async () => {6 const browser = await chromium.launch();7 const context = await browser.newContext();8 const page = await context.newPage();9 await screenshotPage(page, path.join(__dirname, 'test.png'));10 await browser.close();11})();12const { fixtures } = require('@playwright/test');13const { test, expect } = fixtures;14test('basic test', async ({ page }) => {15 const title = page.locator('text=Playwright');16 await expect(title).toBeVisible();17});18const { fixtures } = require('@playwright/test');19const { test, expect } = fixtures;20test('basic test', async ({ page }) => {21 const title = page.locator('text=Playwright');22 await expect(title).toBeVisible();23});24const { fixtures } = require('@playwright/test');25const { test, expect } = fixtures;26test('basic test', async ({ page }) => {27 const title = page.locator('text=Playwright');28 await expect(title).toBeVisible();29});30const { fixtures } = require('@playwright/test');31const { test, expect } = fixtures;32test('basic test', async ({ page }) => {33 const title = page.locator('text=Playwright');34 await expect(title).toBeVisible();35});
Using AI Code Generation
1const { devices } = require('@playwright/test');2const iPhone = devices['iPhone 11 Pro'];3const { webkit } = require('playwright');4const browser = await webkit.launch();5const context = await browser.newContext({6 geolocation: { longitude: 12.492507, latitude: 41.889938 },7});8const page = await context.newPage();9await page.screenshot({ path: 'colosseum-iphone.png' });10await browser.close();11const { webkit } = require('playwright');12const { screenshotPage } = require('playwright-internal-api');13const browser = await webkit.launch();14const context = await browser.newContext();15const page = await context.newPage();16await screenshotPage(page, { path: 'google.png' });17await browser.close();18### screenshotPage(page, options)19await screenshotPage(page, { path: 'google.png' });20### screenshotElement(element, options)21const element = await page.$('div');22await screenshotElement(element, { path: 'google.png' });23MIT © [Arun Kumar S](
Using AI Code Generation
1const { screenshotPage } = require('playwright-core/lib/server/supplements/recorder/recorderSupplement.js');2const fs = require('fs');3const path = require('path');4(async () => {5 const page = await browser.newPage();6 const screenshot = await screenshotPage(page);7 fs.writeFileSync(path.join(__dirname, 'playwright.png'), screenshot);8})();9### `screenshotPage(page: Page, options: ScreenshotOptions): Promise<Buffer>`10interface ScreencastFrame {11 buffer: Buffer;12 width: number;13 height: number;14 timestamp: number;15 duration: number;16}17### `screencastFrameToBuffer(frame: ScreencastFrame): Buffer`18### `screencastFrameToPNG(frame: ScreencastFrame): Buffer`19### `screencastFrameToJPEG(frame: ScreencastFrame, quality: number = 80): Buffer`20### `screencastFrameToWebP(frame: ScreencastFrame, quality: number = 80): Buffer`21### `screencastFrameToGIF(frame: ScreencastFrame, options: GIFEncoderOptions = {}): Buffer`22### `screencastFrameToAVIF(frame: ScreencastFrame): Buffer`23### `screencastFrameToHEIF(frame: ScreencastFrame): Buffer`24### `screencastFrameToMPEG(frame: ScreencastFrame
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?
