typescript 如何在 Angular 应用程序中使用 Puppeteer
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/51536244/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to use Puppeteer in an Angular application
提问by Ronaldonizuka
My question is simple but i don't understand if it's possible and in this case how it's possible ? I would like to use the puppeteer library in a angular application. https://www.npmjs.com/package/puppeteerit's the npm installation. But i don't understand how i can use it. For example i just want to make this script :
我的问题很简单，但我不明白这是否可能，在这种情况下怎么可能？我想在角度应用程序中使用 puppeteer 库。 https://www.npmjs.com/package/puppeteer这是 npm 安装。但我不明白如何使用它。例如，我只想制作这个脚本：
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.screenshot({path: 'example.png'});
await browser.close();
})();In a angular component, can somebody help me (it will be able me to understanding a lot of thing)
在角度组件中，有人可以帮助我吗（它可以让我理解很多东西）
Thanks in advance, sorry for my bad english, i'm french
提前致谢，抱歉我的英语不好，我是法国人
回答by Francesco Borzi
How to use Angular e2e testing with Puppeteer
如何在 Puppeteer 中使用 Angular e2e 测试
1) Install Puppeteer
1）安装Puppeteer
npm install --save-dev puppeteer @types/puppeteer
2) Configure Protractor to use Puppeteer
2）配置Protractor使用Puppeteer
Edit your protractor.conf.jsand add the following inside capabilities:
编辑您的protractor.conf.js并在其中添加以下内容capabilities：
// ...
const puppeteer = require('puppeteer');
exports.config = {
// ...
capabilities: {
browserName: 'chrome',
chromeOptions: {
args: ['--headless'],
binary: puppeteer.executablePath(),
},
},
// ...
};
3) Write and execute your tests
3) 编写和执行你的测试
For example, edit your e2e/src/app.e2e-spec.tsand do the following:
例如，编辑您的e2e/src/app.e2e-spec.ts并执行以下操作：
import * as puppeteer from 'puppeteer';
describe('workspace-project App', () => {
it('Test Puppeteer screenshot', async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('http://localhost:4200');
await page.screenshot({ path: 'example.png' });
await browser.close();
});
});
Run your e2e tests using ng e2e. The above example will produce a screenshot of your app home page and save it as example.png.
使用ng e2e. 上面的示例将生成您的应用主页的屏幕截图并将其另存为example.png.
Check the official Puppeteer websitefor more information about how to write tests.
查看官方 Puppeteer 网站以获取有关如何编写测试的更多信息。
