模块导入示例
page.js
async function login(page, username, password) { await page.waitFor('input[id=userId]'); await page.type('input[id=userId]', username); await page.type('input[id=password]', password); await page.click('button[type="submit"]'); await page.waitFor('p.success-msg'); } module.exports = { login }
test.js
async function login(page, username, password) { await page.waitFor('input[id=userId]'); await page.type('input[id=userId]', username); await page.type('input[id=password]', password); await page.click('button[type="submit"]'); await page.waitFor('p.success-msg'); } module.exports = { login }
拖拽示例
const e = await page.$('#searchResultsSidebar'); const box = await e.boundingBox(); await page.mouse.move(box.x + box.width / 2, box.y + boy.height / 2); await page.mouse.down(); await page.mouse.move(100, 200); // move to (100, 200) coordinates await page.mouse.up();
xpath定位
const e = await page.$('#searchResultsSidebar'); const box = await e.boundingBox(); await page.mouse.move(box.x + box.width / 2, box.y + boy.height / 2); await page.mouse.down(); await page.mouse.move(100, 200); // move to (100, 200) coordinates await page.mouse.up();
获取xpath表达式对应元素文本
const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.goto('https://example.com/'); const title = await page.$x("//h1"); let text = await page.evaluate(h1 => h1.textContent, title[0]); console.log(text) await browser.close();
双击
await page.click('.link-page-wrap',{ clickCount: 2 }); const foo = await page.$('.foo-item'); await = foo.click(); await = foo.click({ clickCount: 2 });
下载chromium
const browserFetcher = puppeteer.createBrowserFetcher(); const revisionInfo = await browserFetcher.download('533271'); const browser = await puppeteer.launch({executablePath: revisionInfo.executablePath})
显示影藏的元素
await page.evaluate(() => { document.querySelector('mySelector').style.display = 'yes'; });
清空文本值
const puppeteer = require('puppeteer'); ;(async () => { const browser = await puppeteer.launch({headless: false}) const page = await browser.newPage() await page.goto('https://archive.kbb1.com/lessons', {waitUntil: 'networkidle2'}); // Clicking on Date filter // Click Apply and check if filter tag is created await Promise.all([ await page.click(".ui.blue.large.pointing.secondary.index-filters.menu div a:nth-child(4)"), page.waitForSelector("div.five.wide.column > div.ui.grid > div:nth-child(2) > div:nth-child(2) > div > input") ]); await page.$eval("div.five.wide.column > div.ui.grid > div:nth-child(2) > div:nth-child(1) > div > input[type="text"]", (selector) => { selector.value = ""; }); await page.$eval(".class", (selector) => { selector.value = ""; }); })()
获取某一个节点的某个属性
const searchValue = await page.$eval('#search', el => el.value); const preloadHref = await page.$eval('link[rel=preload]', el => el.href); const text = await page.$eval('.text', el => el.textContent); const html = await page.$eval('.main-container', e => e.outerHTML);
获取某一类节点的某个属性集合
const textArray = await page.$$eval('.text', els => Array.from(els).map(el=> el.textContent));
beforall和afterall
beforeAll(async () => { browser = await puppeteer.launch({ headless: false, slowMo: 80 }); page = await browser.newPage(); }); afterAll(()=> { browser.close(); });
Jest 断言
Matchers俗称断言库,例如上面的expect().toBe()便是其中之一,其他常见用法如下:
1.相等断言
toBe(value): 比较数字、字符串
toEqual(value): 比较对象、数组
toBeNull()
toBeUndefined()
2.包含断言
toHaveProperty(keyPath, value): 是否有对应的属性
toContain(item): 是否包含对应的值,括号里写上数组、字符串
toMatch(regexpOrString): 括号里写上正则
3.逻辑断言
toBeTruthy()
toBeFalsy()
在JavaScript中,有六个falsy值:false,0,'',null, undefined,和NaN。其他一切都是Truthy。
toBeGreaterThan(number): 大于
toBeLessThan(number): 小于
4.not 取反,用法见下面例子
js去掉字符串的空格回车换行
例如下面这个json串,中间的
表示换行
var str = "{' retmsg':'success ', ' trans_date':' 20170906'}"; console.log(str); //"{' retmsg':'success ', //' trans_date':' 20170906'}"
去掉空格
str = str.replace(/ +/g,""); console.log(str); //"{'retmsg':'success', //'trans_date':'20170906'}"
去掉回车换行
str = str.replace(/[ ]/g,""); console.log(str); //"{'retmsg':'success','trans_date':'20170906'}"