Go to file
dependabot[bot] 04c286d5a0
chore(deps): Bump @angular-devkit/schematics from 15.0.4 to 15.1.1 (#9517)
Bumps
[@angular-devkit/schematics](https://github.com/angular/angular-cli)
from 15.0.4 to 15.1.1.
<details>
<summary>Release notes</summary>
<p><em>Sourced from <a
href="https://github.com/angular/angular-cli/releases"><code>@​angular-devkit/schematics</code>'s
releases</a>.</em></p>
<blockquote>
<h2>v15.1.1</h2>
<p><!-- raw HTML omitted --><!-- raw HTML omitted --></p>
<h1>15.1.1 (2023-01-12)</h1>
<h3><code>@​angular-devkit/build-angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="b94bf60ca8"><img
src="https://img.shields.io/badge/b94bf60ca-fix-green" alt="fix -
b94bf60ca" /></a></td>
<td>update <code>esbuild</code> to <code>0.16.17</code></td>
</tr>
</tbody>
</table>
<h2>Special Thanks</h2>
<p>Alan Agius</p>
<h2>v15.1.0</h2>
<p><!-- raw HTML omitted --><!-- raw HTML omitted --></p>
<h1>15.1.0 (2023-01-11)</h1>
<h2>Deprecations</h2>
<h3><code>@​angular-devkit/schematics</code></h3>
<ul>
<li>The Observable based
<code>SchematicTestRunner.runSchematicAsync</code> and
<code>SchematicTestRunner.runExternalSchematicAsync</code> method have
been deprecated in favor of the Promise based
<code>SchematicTestRunner.runSchematic</code> and
<code>SchematicTestRunner.runExternalSchematic</code>.</li>
</ul>
<h3><code>@​schematics/angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="5b18ce1545"><img
src="https://img.shields.io/badge/5b18ce154-feat-blue" alt="feat -
5b18ce154" /></a></td>
<td>add <code>guardType</code> as an alias of <code>implements</code> in
guard schematic</td>
</tr>
<tr>
<td><a
href="dd2b65943d"><img
src="https://img.shields.io/badge/dd2b65943-feat-blue" alt="feat -
dd2b65943" /></a></td>
<td>add configuration files generation schematic</td>
</tr>
<tr>
<td><a
href="8d000d1563"><img
src="https://img.shields.io/badge/8d000d156-feat-blue" alt="feat -
8d000d156" /></a></td>
<td>add environments generation schematic</td>
</tr>
<tr>
<td><a
href="6c39a162be"><img
src="https://img.shields.io/badge/6c39a162b-feat-blue" alt="feat -
6c39a162b" /></a></td>
<td>Add schematics for generating functional router guards and
resolvers</td>
</tr>
<tr>
<td><a
href="62121f89ab"><img
src="https://img.shields.io/badge/62121f89a-feat-blue" alt="feat -
62121f89a" /></a></td>
<td>add sideEffects:false to library package.json</td>
</tr>
<tr>
<td><a
href="9299dea649"><img
src="https://img.shields.io/badge/9299dea64-feat-blue" alt="feat -
9299dea64" /></a></td>
<td>generate functional interceptors</td>
</tr>
<tr>
<td><a
href="49b313f27a"><img
src="https://img.shields.io/badge/49b313f27-fix-green" alt="fix -
49b313f27" /></a></td>
<td>add missing import for functional interceptor spec</td>
</tr>
<tr>
<td><a
href="2f92fe7e58"><img
src="https://img.shields.io/badge/2f92fe7e5-fix-green" alt="fix -
2f92fe7e5" /></a></td>
<td>add missing semicolon in functional guard/resolver/interceptor</td>
</tr>
<tr>
<td><a
href="9b6d190f4a"><img
src="https://img.shields.io/badge/9b6d190f4-fix-green" alt="fix -
9b6d190f4" /></a></td>
<td>remove EnvironmentInjector import in functional guard spec</td>
</tr>
<tr>
<td><a
href="b11d3f6442"><img
src="https://img.shields.io/badge/b11d3f644-fix-green" alt="fix -
b11d3f644" /></a></td>
<td>use proper variable in functional guard spec</td>
</tr>
<tr>
<td><a
href="451975f765"><img
src="https://img.shields.io/badge/451975f76-fix-green" alt="fix -
451975f76" /></a></td>
<td>use proper variable in resolver functional spec</td>
</tr>
</tbody>
</table>
<h3><code>@​angular-devkit/build-angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="c29df69546"><img
src="https://img.shields.io/badge/c29df6954-feat-blue" alt="feat -
c29df6954" /></a></td>
<td>add <code>assets</code> option to server builder</td>
</tr>
<tr>
<td><a
href="839d0cb57a"><img
src="https://img.shields.io/badge/839d0cb57-feat-blue" alt="feat -
839d0cb57" /></a></td>
<td>implement stats-json option for esbuild builder</td>
</tr>
<tr>
<td><a
href="216991b9d9"><img
src="https://img.shields.io/badge/216991b9d-feat-blue" alt="feat -
216991b9d" /></a></td>
<td>support inline component Sass styles with esbuild builder</td>
</tr>
<tr>
<td><a
href="7c87ce47c6"><img
src="https://img.shields.io/badge/7c87ce47c-fix-green" alt="fix -
7c87ce47c" /></a></td>
<td>ensure Sass load paths are resolved from workspace root</td>
</tr>
<tr>
<td><a
href="7a063238b8"><img
src="https://img.shields.io/badge/7a063238b-fix-green" alt="fix -
7a063238b" /></a></td>
<td>explicitly send options to JS transformer workers</td>
</tr>
<tr>
<td><a
href="22cba79370"><img
src="https://img.shields.io/badge/22cba7937-fix-green" alt="fix -
22cba7937" /></a></td>
<td>provide an option to <code>exclude</code> specs in Karma
builder</td>
</tr>
<tr>
<td><a
href="20376649c5"><img
src="https://img.shields.io/badge/20376649c-fix-green" alt="fix -
20376649c" /></a></td>
<td>transform async generator class methods for Zone.js support</td>
</tr>
<tr>
<td><a
href="0520608f68"><img
src="https://img.shields.io/badge/0520608f6-fix-green" alt="fix -
0520608f6" /></a></td>
<td>use relative css resource paths in esbuild JSON stats</td>
</tr>
<tr>
<td><a
href="0c01532cb5"><img
src="https://img.shields.io/badge/0c01532cb-perf-orange" alt="perf -
0c01532cb" /></a></td>
<td>use worker pool for JavaScript transforms in esbuild builder</td>
</tr>
</tbody>
</table>
<h3><code>@​angular-devkit/schematics</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="207358afb8"><img
src="https://img.shields.io/badge/207358afb-feat-blue" alt="feat -
207358afb" /></a></td>
<td>add <code>runSchematic</code> and <code>runExternalSchematic</code>
methods</td>
</tr>
</tbody>
</table>
<h2>Special Thanks</h2>
<p>Alan Agius, Andrew Scott, Charles Lyding, Cédric Exbrayat, Doug
Parker, Felix Hamann, Jason Bedard, Joey Perrott and Kristiyan
Kostadinov</p>
<h2>v15.1.0-rc.0</h2>
<!-- raw HTML omitted -->
</blockquote>
<p>... (truncated)</p>
</details>
<details>
<summary>Changelog</summary>
<p><em>Sourced from <a
href="https://github.com/angular/angular-cli/blob/main/CHANGELOG.md"><code>@​angular-devkit/schematics</code>'s
changelog</a>.</em></p>
<blockquote>
<h1>15.1.1 (2023-01-12)</h1>
<h3><code>@​angular-devkit/build-angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="b94bf60ca8">b94bf60ca</a></td>
<td>fix</td>
<td>update <code>esbuild</code> to <code>0.16.17</code></td>
</tr>
</tbody>
</table>
<h2>Special Thanks</h2>
<p>Alan Agius</p>
<!-- raw HTML omitted -->
<p><!-- raw HTML omitted --><!-- raw HTML omitted --></p>
<h1>15.1.0 (2023-01-11)</h1>
<h2>Deprecations</h2>
<h3><code>@​angular-devkit/schematics</code></h3>
<ul>
<li>The Observable based
<code>SchematicTestRunner.runSchematicAsync</code> and
<code>SchematicTestRunner.runExternalSchematicAsync</code> method have
been deprecated in favor of the Promise based
<code>SchematicTestRunner.runSchematic</code> and
<code>SchematicTestRunner.runExternalSchematic</code>.</li>
</ul>
<h3><code>@​schematics/angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="5b18ce1545">5b18ce154</a></td>
<td>feat</td>
<td>add <code>guardType</code> as an alias of <code>implements</code> in
guard schematic</td>
</tr>
<tr>
<td><a
href="dd2b65943d">dd2b65943</a></td>
<td>feat</td>
<td>add configuration files generation schematic</td>
</tr>
<tr>
<td><a
href="8d000d1563">8d000d156</a></td>
<td>feat</td>
<td>add environments generation schematic</td>
</tr>
<tr>
<td><a
href="6c39a162be">6c39a162b</a></td>
<td>feat</td>
<td>Add schematics for generating functional router guards and
resolvers</td>
</tr>
<tr>
<td><a
href="62121f89ab">62121f89a</a></td>
<td>feat</td>
<td>add sideEffects:false to library package.json</td>
</tr>
<tr>
<td><a
href="9299dea649">9299dea64</a></td>
<td>feat</td>
<td>generate functional interceptors</td>
</tr>
<tr>
<td><a
href="49b313f27a">49b313f27</a></td>
<td>fix</td>
<td>add missing import for functional interceptor spec</td>
</tr>
<tr>
<td><a
href="2f92fe7e58">2f92fe7e5</a></td>
<td>fix</td>
<td>add missing semicolon in functional guard/resolver/interceptor</td>
</tr>
<tr>
<td><a
href="9b6d190f4a">9b6d190f4</a></td>
<td>fix</td>
<td>remove EnvironmentInjector import in functional guard spec</td>
</tr>
<tr>
<td><a
href="b11d3f6442">b11d3f644</a></td>
<td>fix</td>
<td>use proper variable in functional guard spec</td>
</tr>
<tr>
<td><a
href="451975f765">451975f76</a></td>
<td>fix</td>
<td>use proper variable in resolver functional spec</td>
</tr>
</tbody>
</table>
<h3><code>@​angular-devkit/build-angular</code></h3>
<table>
<thead>
<tr>
<th>Commit</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><a
href="c29df69546">c29df6954</a></td>
<td>feat</td>
<td>add <code>assets</code> option to server builder</td>
</tr>
<tr>
<td><a
href="839d0cb57a">839d0cb57</a></td>
<td>feat</td>
<td>implement stats-json option for esbuild builder</td>
</tr>
<tr>
<td><a
href="216991b9d9">216991b9d</a></td>
<td>feat</td>
<td>support inline component Sass styles with esbuild builder</td>
</tr>
<tr>
<td><a
href="7c87ce47c6">7c87ce47c</a></td>
<td>fix</td>
<td>ensure Sass load paths are resolved from workspace root</td>
</tr>
<tr>
<td><a
href="7a063238b8">7a063238b</a></td>
<td>fix</td>
<td>explicitly send options to JS transformer workers</td>
</tr>
<tr>
<td><a
href="22cba79370">22cba7937</a></td>
<td>fix</td>
<td>provide an option to <code>exclude</code> specs in Karma
builder</td>
</tr>
</tbody>
</table>
<!-- raw HTML omitted -->
</blockquote>
<p>... (truncated)</p>
</details>
<details>
<summary>Commits</summary>
<ul>
<li><a
href="a8953ffe77"><code>a8953ff</code></a>
release: cut the v15.1.1 release</li>
<li><a
href="4ba55e4655"><code>4ba55e4</code></a>
refactor: change <code>JSONFile</code> to private instead of
internal</li>
<li><a
href="6dd88b4705"><code>6dd88b4</code></a>
build: update <code>eslint-plugin-import</code> to
<code>2.27.4</code></li>
<li><a
href="b94bf60ca8"><code>b94bf60</code></a>
fix(<code>@​angular-devkit/build-angular</code>): update
<code>esbuild</code> to <code>0.16.17</code></li>
<li><a
href="d6583e584f"><code>d6583e5</code></a>
docs(<code>@​angular/cli</code>): add ng new long description</li>
<li><a
href="ea64defb0b"><code>ea64def</code></a>
release: cut the v15.1.0 release</li>
<li><a
href="7731588f9a"><code>7731588</code></a>
build: update angular packages for 15.1.0 release</li>
<li><a
href="d41b741ea9"><code>d41b741</code></a>
build: lock file maintenance</li>
<li><a
href="0520608f68"><code>0520608</code></a>
fix(<code>@​angular-devkit/build-angular</code>): use relative css
resource paths in esbuil...</li>
<li><a
href="22cba79370"><code>22cba79</code></a>
fix(<code>@​angular-devkit/build-angular</code>): provide an option to
<code>exclude</code> specs in K...</li>
<li>Additional commits viewable in <a
href="https://github.com/angular/angular-cli/compare/15.0.4...15.1.1">compare
view</a></li>
</ul>
</details>
<br />


[![Dependabot compatibility
score](https://dependabot-badges.githubapp.com/badges/compatibility_score?dependency-name=@angular-devkit/schematics&package-manager=npm_and_yarn&previous-version=15.0.4&new-version=15.1.1)](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores)

Dependabot will resolve any conflicts with this PR as long as you don't
alter it yourself. You can also trigger a rebase manually by commenting
`@dependabot rebase`.

[//]: # (dependabot-automerge-start)
[//]: # (dependabot-automerge-end)

---

<details>
<summary>Dependabot commands and options</summary>
<br />

You can trigger Dependabot actions by commenting on this PR:
- `@dependabot rebase` will rebase this PR
- `@dependabot recreate` will recreate this PR, overwriting any edits
that have been made to it
- `@dependabot merge` will merge this PR after your CI passes on it
- `@dependabot squash and merge` will squash and merge this PR after
your CI passes on it
- `@dependabot cancel merge` will cancel a previously requested merge
and block automerging
- `@dependabot reopen` will reopen this PR if it is closed
- `@dependabot close` will close this PR and stop Dependabot recreating
it. You can achieve the same result by closing it manually
- `@dependabot ignore this major version` will close this PR and stop
Dependabot creating any more for this major version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this minor version` will close this PR and stop
Dependabot creating any more for this minor version (unless you reopen
the PR or upgrade to it yourself)
- `@dependabot ignore this dependency` will close this PR and stop
Dependabot creating any more for this dependency (unless you reopen the
PR or upgrade to it yourself)


</details>

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Kian-Meng Ang <kianmeng.ang@gmail.com>
Co-authored-by: Alex Rudenko <OrKoN@users.noreply.github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Nikolay Vitkov <34244704+Lightning00Blade@users.noreply.github.com>
2023-01-17 15:10:39 +01:00
.github chore: disable IA when issue is confirmed but edited (#9525) 2023-01-17 08:21:22 +01:00
.husky chore: Improve CI (#8601) 2022-07-01 15:03:12 +02:00
.vscode chore(ng-schematics): Use WireIt for builds and tests (#9356) 2022-12-05 10:35:31 +01:00
docker feat: use node18 as docker base image (#9456) 2023-01-02 11:00:16 +01:00
docs docs: fix typos (#9476) 2023-01-16 20:25:09 +01:00
examples docs: fix cross-browser.js example (#9291) 2022-11-17 13:26:08 +01:00
packages chore(deps): Bump @angular-devkit/schematics from 15.0.4 to 15.1.1 (#9517) 2023-01-17 15:10:39 +01:00
test chore: use named import for devtools-protocol module (#9511) 2023-01-17 11:34:57 +00:00
test-d fix(puppeteer-core): avoid type instantiation errors (#9370) 2022-12-06 19:21:08 +01:00
tools docs: fix typos (#9476) 2023-01-16 20:25:09 +01:00
website chore: release main (#9495) 2023-01-12 08:21:09 +01:00
.editorconfig EditorConfig: 2 space indent (#195) 2017-08-03 09:50:08 -07:00
.eslintignore feat!: use ~/.cache/puppeteer for browser downloads (#9095) 2022-10-11 11:20:45 +00:00
.eslintplugin.js chore: add custom rule for formatting comments (#8777) 2022-08-12 14:15:26 +02:00
.eslintrc.js chore: rename vendor to third_party (#9021) 2022-09-28 15:23:37 +02:00
.eslintrc.types.cjs fix: remove unused imports (#8613) 2022-07-01 16:00:03 +02:00
.gitattributes chore(git): Fix line endings in text files (#4320) 2019-04-22 09:03:42 -07:00
.gitignore chore(ng-schematics): Use WireIt for builds and tests (#9356) 2022-12-05 10:35:31 +01:00
.mocharc.cjs chore: support WebDriver BiDi browser instances (#8932) 2022-09-15 02:15:15 +02:00
.npmrc fix: move CI npm config out of .npmrc (#6901) 2021-02-17 18:52:22 +01:00
.prettierignore chore(ng-schematics): Use WireIt for builds and tests (#9356) 2022-12-05 10:35:31 +01:00
.prettierrc.cjs docs: improve docs (#9179) 2022-10-28 08:49:28 +02:00
.release-please-manifest.json chore: release main (#9495) 2023-01-12 08:21:09 +01:00
commitlint.config.js chore: update commitlint.config.js (#9064) 2022-10-06 09:40:39 +02:00
LICENSE chore: use https URL for license info (#6279) 2020-08-10 10:35:07 +02:00
package-lock.json chore(deps): Bump @angular-devkit/schematics from 15.0.4 to 15.1.1 (#9517) 2023-01-17 15:10:39 +01:00
package.json chore: add issue analyzer (#9480) 2023-01-11 12:33:53 +01:00
README.md docs: improve docs (#9179) 2022-10-28 08:49:28 +02:00
release-please-config.json chore: update latest release sha (#9311) 2022-11-23 13:07:39 +01:00
tsconfig.base.json feat: separate puppeteer and puppeteer-core (#9023) 2022-10-05 14:17:03 +02:00
versions.js feat(chromium): roll to Chromium 110.0.5479.0 (r1083080) (#9500) 2023-01-12 11:31:20 +01:00

Puppeteer

Build status npm puppeteer package

Guides | API | FAQ | Contributing | Troubleshooting

Puppeteer is a Node.js library which provides a high-level API to control Chrome/Chromium over the DevTools Protocol. Puppeteer runs in headless mode by default, but can be configured to run in full (non-headless) Chrome/Chromium.

What can I do?

Most things that you can do manually in the browser can be done using Puppeteer! Here are a few examples to get you started:

  • Generate screenshots and PDFs of pages.
  • Crawl a SPA (Single-Page Application) and generate pre-rendered content (i.e. "SSR" (Server-Side Rendering)).
  • Automate form submission, UI testing, keyboard input, etc.
  • Create an automated testing environment using the latest JavaScript and browser features.
  • Capture a timeline trace of your site to help diagnose performance issues.
  • Test Chrome Extensions.

Getting Started

Installation

To use Puppeteer in your project, run:

npm i puppeteer
# or `yarn add puppeteer`
# or `pnpm i puppeteer`

When you install Puppeteer, it automatically downloads a recent version of Chromium (~170MB macOS, ~282MB Linux, ~280MB Windows) that is guaranteed to work with Puppeteer. For a version of Puppeteer without installation, see puppeteer-core.

Configuration

Puppeteer uses several defaults that can be customized through configuration files.

For example, to change the default cache directory Puppeteer uses to install browsers, you can add a .puppeteerrc.cjs (or puppeteer.config.cjs) at the root of your application with the contents

const {join} = require('path');

/**
 * @type {import("puppeteer").Configuration}
 */
module.exports = {
  // Changes the cache location for Puppeteer.
  cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
};

After adding the configuration file, you will need to remove and reinstall puppeteer for it to take effect.

See the configuration guide for more information.

puppeteer-core

Every release since v1.7.0 we publish two packages:

puppeteer is a product for browser automation. When installed, it downloads a version of Chromium, which it then drives using puppeteer-core. Being an end-user product, puppeteer automates several workflows using reasonable defaults that can be customized.

puppeteer-core is a library to help drive anything that supports DevTools protocol. Being a library, puppeteer-core is fully driven through its programmatic interface implying no defaults are assumed and puppeteer-core will not download Chromium when installed.

You should use puppeteer-core if you are connecting to a remote browser or managing browsers yourself. If you are managing browsers yourself, you will need to call puppeteer.launch with an an explicit executablePath (or channel if it's installed in a standard location).

When using puppeteer-core, remember to change the import:

import puppeteer from 'puppeteer-core';

Usage

Puppeteer follows the latest maintenance LTS version of Node.

Puppeteer will be familiar to people using other browser testing frameworks. You launch/connect a browser, create some pages, and then manipulate them with Puppeteer's API.

For more in-depth usage, check our guides and examples.

Example

The following example searches developers.google.com/web for articles tagged "Headless Chrome" and scrape results from the results page.

import puppeteer from 'puppeteer';

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();

  await page.goto('https://developers.google.com/web/');

  // Type into search box.
  await page.type('.devsite-search-field', 'Headless Chrome');

  // Wait for suggest overlay to appear and click "show all results".
  const allResultsSelector = '.devsite-suggest-all-results';
  await page.waitForSelector(allResultsSelector);
  await page.click(allResultsSelector);

  // Wait for the results page to load and display the results.
  const resultsSelector = '.gsc-results .gs-title';
  await page.waitForSelector(resultsSelector);

  // Extract the results from the page.
  const links = await page.evaluate(resultsSelector => {
    return [...document.querySelectorAll(resultsSelector)].map(anchor => {
      const title = anchor.textContent.split('|')[0].trim();
      return `${title} - ${anchor.href}`;
    });
  }, resultsSelector);

  // Print all the files.
  console.log(links.join('\n'));

  await browser.close();
})();

Default runtime settings

1. Uses Headless mode

Puppeteer launches Chromium in headless mode. To launch a full version of Chromium, set the headless option when launching a browser:

const browser = await puppeteer.launch({headless: false}); // default is true

2. Runs a bundled version of Chromium

By default, Puppeteer downloads and uses a specific version of Chromium so its API is guaranteed to work out of the box. To use Puppeteer with a different version of Chrome or Chromium, pass in the executable's path when creating a Browser instance:

const browser = await puppeteer.launch({executablePath: '/path/to/Chrome'});

You can also use Puppeteer with Firefox Nightly (experimental support). See Puppeteer.launch for more information.

See this article for a description of the differences between Chromium and Chrome. This article describes some differences for Linux users.

3. Creates a fresh user profile

Puppeteer creates its own browser user profile which it cleans up on every run.

Using Docker

See our Docker guide.

Using Chrome Extensions

See our Chrome extensions guide.

Resources

Contributing

Check out our contributing guide to get an overview of Puppeteer development.

FAQ

Our FAQ has migrated to our site.