Merge branch 'main' into extract-bespoke-license

.eslintrc.js

@@ -23,7 +23,7 @@ module.exports = {
       extends: [
         'plugin:@typescript-eslint/recommended',
         'plugin:import/typescript',
-        'prettier/@typescript-eslint',
+        'prettier',
       ],
       rules: {
         '@typescript-eslint/no-explicit-any': 'off',

CHANGELOG.md

@@ -4,8 +4,14 @@
 
 ### Fixed
 
+- Conversion into multi images/PPTX takes only the first slide if using Chromium >= v89 ([#325](https://github.com/marp-team/marp-cli/issues/325), [#329](https://github.com/marp-team/marp-cli/pull/329))
 - Optimize bespoke template for bfcache ([#323](https://github.com/marp-team/marp-cli/pull/323))
 
+### Changed
+
+- Upgrade Puppeteer to v8 ([#329](https://github.com/marp-team/marp-cli/pull/329))
+- Upgrade dependent packages to the latest version ([#330](https://github.com/marp-team/marp-cli/pull/330))
+
 ## v0.23.2 - 2021-02-11
 
 ### Changed

package.json

@@ -65,70 +65,71 @@
   "devDependencies": {
     "@rollup/plugin-commonjs": "^17.1.0",
     "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^11.1.1",
-    "@rollup/plugin-replace": "^2.3.4",
-    "@rollup/plugin-typescript": "^8.1.1",
+    "@rollup/plugin-node-resolve": "^11.2.0",
+    "@rollup/plugin-replace": "^2.4.1",
+    "@rollup/plugin-typescript": "^8.2.0",
     "@rollup/plugin-url": "^6.0.0",
-    "@types/cheerio": "^0.22.23",
+    "@types/cheerio": "^0.22.27",
     "@types/express": "^4.17.11",
     "@types/jest": "^26.0.20",
-    "@types/node": "~14.14.25",
+    "@types/node": "~14.14.34",
     "@types/pug": "^2.0.4",
     "@types/supertest": "^2.0.10",
     "@types/ws": "^7.4.0",
     "@types/yargs": "^16.0.0",
-    "@typescript-eslint/eslint-plugin": "^4.15.0",
-    "@typescript-eslint/parser": "^4.15.0",
-    "autoprefixer": "^9.8.6",
+    "@typescript-eslint/eslint-plugin": "^4.17.0",
+    "@typescript-eslint/parser": "^4.17.0",
+    "autoprefixer": "^10.2.5",
     "bespoke": "bespokejs/bespoke",
     "builtin-modules": "^3.2.0",
     "chalk": "^4.1.0",
     "cheerio": "^1.0.0-rc.5",
     "codecov": "^3.8.1",
     "cssnano": "^4.1.10",
-    "eslint": "^7.19.0",
-    "eslint-config-prettier": "^7.2.0",
+    "eslint": "^7.22.0",
+    "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-jest": "^24.1.3",
+    "eslint-plugin-jest": "^24.3.0",
     "file-url": "^3.0.0",
     "get-stdin": "^8.0.0",
-    "image-size": "^0.9.3",
+    "image-size": "^0.9.5",
     "is-wsl": "^2.2.0",
     "jest": "^26.6.3",
     "jest-junit": "^12.0.0",
     "mkdirp": "^1.0.4",
-    "nanoid": "^3.1.20",
+    "nanoid": "^3.1.21",
     "npm-run-all": "^4.1.5",
     "os-locale": "^5.0.0",
     "pkg": "^4.4.9",
     "pkg-up": "^3.1.0",
     "portfinder": "^1.0.28",
-    "postcss-url": "^8.0.0",
+    "postcss": "^8.2.8",
+    "postcss-url": "^10.1.1",
     "prettier": "^2.2.1",
-    "pug": "^3.0.0",
+    "pug": "^3.0.2",
     "rimraf": "^3.0.2",
-    "rollup": "^2.38.5",
-    "rollup-plugin-license": "^2.2.0",
-    "rollup-plugin-postcss": "^3.1.8",
+    "rollup": "^2.41.2",
+    "rollup-plugin-license": "^2.3.0",
+    "rollup-plugin-postcss": "^4.0.0",
     "rollup-plugin-pug": "^1.1.1",
     "rollup-plugin-terser": "^7.0.2",
-    "sass": "^1.32.7",
+    "sass": "^1.32.8",
     "screenfull": "^5.1.0",
     "strip-ansi": "^6.0.0",
-    "stylelint": "^13.9.0",
+    "stylelint": "^13.12.0",
     "stylelint-config-prettier": "^8.0.2",
-    "stylelint-config-standard": "^20.0.0",
+    "stylelint-config-standard": "^21.0.0",
     "stylelint-scss": "^3.19.0",
     "supertest": "^6.1.3",
     "tar-stream": "^2.2.0",
-    "ts-jest": "^26.5.1",
+    "ts-jest": "^26.5.3",
     "ts-keycode-enum": "^1.0.6",
     "tslib": "^2.1.0",
-    "typescript": "^4.1.5",
+    "typescript": "^4.2.3",
     "vhtml": "^2.2.0",
     "wrap-ansi": "^7.0.0",
     "yauzl": "^2.10.0",
-    "zip-stream": "^4.0.4"
+    "zip-stream": "^4.1.0"
   },
   "dependencies": {
     "@marp-team/marp-core": "^1.4.3",
@@ -140,13 +141,17 @@
     "globby": "^11.0.2",
     "import-from": "^3.0.0",
     "pptxgenjs": "^3.4.0",
-    "puppeteer-core": "7.0.1",
+    "puppeteer-core": "8.0.0",
     "serve-index": "^1.9.1",
     "tmp": "^0.2.1",
-    "v8-compile-cache": "^2.2.0",
-    "ws": "^7.4.3",
+    "v8-compile-cache": "^2.3.0",
+    "ws": "^7.4.4",
     "yargs": "^16.2.0"
   },
+  "resolutions": {
+    "pug": "^3.0.2",
+    "pug-runtime": "^3.0.1"
+  },
   "publishConfig": {
     "access": "public"
   }

rollup.config.js

@@ -26,7 +26,10 @@ const plugins = (opts = {}) => [
     browser: !!opts.browser,
     mainFields: ['module', 'jsnext:main', 'main'],
   }),
-  replace({ 'process.env.NODE_ENV': JSON.stringify('production') }),
+  replace({
+    preventAssignment: true,
+    'process.env.NODE_ENV': JSON.stringify('production'),
+  }),
   commonjs(),
   typescript({ noEmitOnError: false }),
   postcss({

src/converter.ts

@@ -3,6 +3,7 @@ import { URL } from 'url'
 import { MarpOptions } from '@marp-team/marp-core'
 import { Marpit, Options as MarpitOptions } from '@marp-team/marpit'
 import chalk from 'chalk'
+import puppeteer from 'puppeteer-core'
 import { silence, warn } from './cli'
 import { Engine } from './engine'
 import infoPlugin, { engineInfo, EngineInfo } from './engine/info-plugin'
@@ -21,9 +22,6 @@ import {
   generatePuppeteerDataDirPath,
   generatePuppeteerLaunchArgs,
   launchPuppeteer,
-  PuppeteerBrowser,
-  PuppeteerPage,
-  PuppeteerRequest,
 } from './utils/puppeteer'
 import { isChromeInWSLHost, resolveWSLPathToHost } from './utils/wsl'
 import { notifier } from './watcher'
@@ -261,20 +259,26 @@ export class Converter {
       await page.goto(uri, { waitUntil: ['domcontentloaded', 'networkidle0'] })
       await page.emulateMediaType('print')
 
-      const screenshot = async (pageNumber?: number) => {
+      const screenshot = async (pageNumber = 1) => {
+        // for Chrome < 89 (TODO: Remove this script evaluation in future)
         await page.evaluate(
-          `window.scrollTo(0,${
-            ((pageNumber || 1) - 1) * tpl.rendered.size.height
-          })`
+          `window.scrollTo(0,${(pageNumber - 1) * tpl.rendered.size.height})`
         )
 
+        const clip = {
+          x: 0,
+          y: (pageNumber - 1) * tpl.rendered.size.height,
+          ...tpl.rendered.size,
+        } as const
+
         if (opts.type === ConvertType.jpeg)
           return (await page.screenshot({
+            clip,
             quality: opts.quality,
             type: 'jpeg',
           })) as Buffer
 
-        return (await page.screenshot({ type: 'png' })) as Buffer
+        return (await page.screenshot({ clip, type: 'png' })) as Buffer
       }
 
       if (opts.pages) {
@@ -367,7 +371,7 @@ export class Converter {
 
   private async usePuppeteer<T>(
     baseFile: File,
-    processer: (page: PuppeteerPage, uri: string) => Promise<T>
+    processer: (page: puppeteer.Page, uri: string) => Promise<T>
   ) {
     const tmpFile: File.TmpFileInterface | undefined = await (() => {
       if (!this.options.allowLocalFiles) return undefined
@@ -434,12 +438,12 @@ export class Converter {
   }
 
   private trackFailedLocalFileAccess(
-    page: PuppeteerPage
+    page: puppeteer.Page
   ): { missingFileSet: Set<string>; failedFileSet: Set<string> } {
     const missingFileSet = new Set<string>()
     const failedFileSet = new Set<string>()
 
-    page.on('requestfailed', (req: PuppeteerRequest) => {
+    page.on('requestfailed', (req: puppeteer.HTTPRequest) => {
       try {
         const url = new URL(req.url())
         if (url.protocol === 'file:') {
@@ -461,7 +465,7 @@ export class Converter {
     if (Converter.browser) await Converter.browser.close()
   }
 
-  private static browser?: PuppeteerBrowser
+  private static browser?: puppeteer.Browser
 
   private static async runBrowser() {
     if (!Converter.browser) {

src/preview.ts

@@ -1,6 +1,7 @@
 /* eslint-disable import/export, @typescript-eslint/no-namespace */
 import { EventEmitter } from 'events'
 import { nanoid } from 'nanoid'
+import puppeteer from 'puppeteer-core'
 import favicon from './assets/favicon.png'
 import { ConvertType, mimeTypes } from './converter'
 import { error } from './error'
@@ -9,9 +10,6 @@ import {
   generatePuppeteerDataDirPath,
   generatePuppeteerLaunchArgs,
   launchPuppeteer,
-  PuppeteerBrowser,
-  PuppeteerPage,
-  PuppeteerTarget,
 } from './utils/puppeteer'
 import TypedEventEmitter from './utils/typed-event-emitter'
 import { isChromeInWSLHost } from './utils/wsl'
@@ -34,7 +32,7 @@ export namespace Preview {
 export class Preview extends TypedEventEmitter<Preview.Events> {
   readonly options: Preview.Options
 
-  private puppeteerInternal: PuppeteerBrowser | undefined
+  private puppeteerInternal: puppeteer.Browser | undefined
 
   constructor(opts: Partial<Preview.Options> = {}) {
     super()
@@ -44,7 +42,7 @@ export class Preview extends TypedEventEmitter<Preview.Events> {
     }
   }
 
-  get puppeteer(): PuppeteerBrowser | undefined {
+  get puppeteer(): puppeteer.Browser | undefined {
     return this.puppeteerInternal
   }
 
@@ -69,7 +67,7 @@ export class Preview extends TypedEventEmitter<Preview.Events> {
     }
   }
 
-  private createWindowObject(page: PuppeteerPage) {
+  private createWindowObject(page: puppeteer.Page) {
     const window = new EventEmitter()
 
     page.on('close', async () => window.emit('close'))
@@ -102,12 +100,12 @@ export class Preview extends TypedEventEmitter<Preview.Events> {
   private async createWindow() {
     try {
       return this.createWindowObject(
-        await new Promise<PuppeteerPage>((res, rej) => {
+        await new Promise<puppeteer.Page>((res, rej) => {
           const pptr = this.puppeteer
           if (!pptr) return rej(false)
 
           const id = nanoid()
-          const idMatcher = (target: PuppeteerTarget) => {
+          const idMatcher = (target: puppeteer.Target) => {
             const url = new URL(target.url())
 
             if (url.searchParams.get('__marp_cli_id') === id) {

src/typings.d.ts

@@ -14,8 +14,3 @@ declare module '*.scss' {
   const scss: string
   export default scss
 }
-
-declare module 'puppeteer-core' {
-  import * as puppeteer from 'puppeteer-core/cjs-entry'
-  export = puppeteer
-}

src/utils/puppeteer.ts

@@ -7,19 +7,6 @@ import { CLIErrorCode, error } from '../error'
 import { findEdgeInstallation } from './edge-finder'
 import { isWSL, resolveWindowsEnv } from './wsl'
 
-type UnwrapPromise<T> = T extends Promise<infer U> ? U : never
-
-export type PuppeteerBrowser = UnwrapPromise<
-  ReturnType<typeof puppeteer['launch']>
->
-export type PuppeteerPage = UnwrapPromise<
-  ReturnType<PuppeteerBrowser['newPage']>
->
-export type PuppeteerRequest = UnwrapPromise<
-  ReturnType<PuppeteerPage['waitForRequest']>
->
-export type PuppeteerTarget = ReturnType<PuppeteerBrowser['target']>
-
 let executablePath: string | undefined | false = false
 let wslTmp: string | undefined