puppteer常用操作和使用
在开发一个UI自动化项目，由于RPA机器人中各平台选取UIPATH，UIBOT都需要付费，领导就选取了puppteer操作浏览器的爬虫框架做UI自动化，以下在使用过程中一些常用api和操作各种场景的开发
- 因为都是异步，基本每行代码都需要同步操作，就造成每行代码都加入await，代码比较啰嗦推荐使用rize框架高效开发Rize；
- 创建一个操作实例对象；
const browser = await puppeteerBrowser.getBrowser(); let site = await browser.newPage();
async getBrowser(){ if(!this.browser){ logInfo.info('浏览器对象构建中，下一个200毫秒=========>'); return new Promise((resolve, reject)=>{ setTimeout(()=>{ resolve(this.getBrowser()); },200);// 浏览器构建获取等待时间间隔 }); } return this.browser; } async newPage(){ let site = this.browser.newPage(); await site.setViewport({width:1920,height:1080}); return site; }
- 常用api
await site.click('#submit'); //点击操作 await site.type('#username',this.userName) //input输入字符 await site.waitForTimeout(1000); //等待1秒执行下一步操作 await frame.waitForSelector('.grid-td-col1'); //等待元素出现 //跳转第三个tab标签页 const browser = await puppeteerBrowser.getBrowser(); const newPage = (await browser.pages())[2]; await newPage.bringToFront(); //浏览器上下文操作,相当于浏览器中的console控制台 await frame2.evaluate(async () => { let a = $('.pupp').css('left'); if(a!='-999px') { $('.as').click(); } }) //获取元素属性赋值 const href = await page.$eval('#a", ele => ele.href); await frame2.$eval(`test`, e=> e.value='价格不符'); //上传文件 //uploadFile上传图片 const uploadPic = await frame2.waitForSelector('input[name=fileData]'); //上传图片目录自定义 await uploadPic.uploadFile(process.cwd()+'/doc/'+fileName); await frame2.select(`.control-text select`,'规划');//选择下拉框内容
快速选取selector选择器
