puppeteer-render-text - npm Package Compare versions

Comparing version 1.0.3 to 2.0.0

index.js

@@ -1,11 +0,14 @@
-'use strict'
+import fs from 'node:fs'
+import path from 'node:path'
+import url from 'node:url'
+import ow from 'ow'
+import puppeteer from 'puppeteer'
 
-const fs = require('fs')
-const ow = require('ow')
-const path = require('path')
-const puppeteer = require('puppeteer')
+import { cssifyObject } from 'css-in-js-utils'
 
-const { cssifyObject } = require('css-in-js-utils')
-
-const observerScript = fs.readFileSync(path.join(__dirname, 'lib', 'fontfaceobserver.standalone.js'), 'utf8')
+const dirname = path.dirname(url.fileURLToPath(import.meta.url))
+const observerScript = fs.readFileSync(
+  path.join(dirname, 'lib', 'fontfaceobserver.standalone.js'),
+  'utf8'
+)
 const observer = `
@@ -43,3 +46,3 @@ <script>
  */
-module.exports = async (opts) => {
+export async function renderText(opts) {
   const {
@@ -52,9 +55,9 @@ text,
     loadGoogleFont = false,
-    style = { },
-    inject = { }
+    style = {},
+    inject = {}
   } = opts
 
-  ow(output, ow.string.nonEmpty.label('output'))
-  ow(text, ow.string.label('text'))
-  ow(style, ow.object.plain.label('style'))
+  ow(output, 'output', ow.string.nonEmpty)
+  ow(text, 'text', ow.string)
+  ow(style, 'style', ow.object.plain)
 
@@ -68,18 +71,23 @@ const { fontFamily = '' } = style
   const fonts = loadFontFamily
-    ? [ loadFontFamily ]
+    ? [loadFontFamily]
     : loadGoogleFont
-      ? fontFamily.split(',').map((font) => font.trim())
-      : [ ]
+    ? fontFamily.split(',').map((font) => font.trim())
+    : []
 
   const fontHeader = loadFontFamily
-    ? observer : (
-      loadGoogleFont ? `
+    ? observer
+    : loadGoogleFont
+    ? `
       ${observer}
-      <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=${fonts.map((font) => font.replace(/ /g, '+')).join('|')}">
-    ` : ''
-    )
+      <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=${fonts
+        .map((font) => font.replace(/ /g, '+'))
+        .join('|')}">
+    `
+    : ''
 
   const fontsToLoad = fonts.map((font) => `new FontFaceObserver('${font}')`)
   const fontLoader = fontsToLoad.length
-    ? `Promise.all([ ${fontsToLoad.join(', ')} ].map((f) => f.load())).then(ready);`
+    ? `Promise.all([ ${fontsToLoad.join(
+        ', '
+      )} ].map((f) => f.load())).then(ready);`
     : 'ready();'
@@ -144,5 +152,7 @@
 
-  const browser = opts.browser || await puppeteer.launch({
-    args: [ '--no-sandbox', '--disable-setuid-sandbox' ]
-  })
+  const browser =
+    opts.browser ||
+    (await puppeteer.launch({
+      args: ['--no-sandbox', '--disable-setuid-sandbox']
+    }))
   const page = await browser.newPage()
@@ -149,0 +159,0 @@

index.test.js

@@ -1,17 +0,15 @@
-'use strict'
+import test from 'ava'
+import { temporaryFile } from 'tempy'
+import rmfr from 'rmfr'
+import sharp from 'sharp'
 
-const { test } = require('ava')
-const tempy = require('tempy')
-const rmfr = require('rmfr')
-const sharp = require('sharp')
+import { renderText } from './index.js'
 
-const renderText = require('.')
-
-function inDelta (actual, expected, delta) {
-  return (expected - delta <= actual && actual <= expected + delta)
+function inDelta(actual, expected, delta) {
+  return expected - delta <= actual && actual <= expected + delta
 }
 
 test('"hello world" builtin font', async (t) => {
-  const output0 = tempy.file({ extension: 'png' })
-  const output1 = tempy.file({ extension: 'png' })
+  const output0 = temporaryFile({ extension: 'png' })
+  const output1 = temporaryFile({ extension: 'png' })
 
@@ -54,3 +52,3 @@ await renderText({
 test('"foobar > barfoo" google font Roboto', async (t) => {
-  const output0 = tempy.file({ extension: 'png' })
+  const output0 = temporaryFile({ extension: 'png' })
 
@@ -77,4 +75,4 @@ await renderText({
 test('"lots of words to wrap" test word wrapping', async (t) => {
-  const output0 = tempy.file({ extension: 'png' })
-  const output1 = tempy.file({ extension: 'png' })
+  const output0 = temporaryFile({ extension: 'png' })
+  const output1 = temporaryFile({ extension: 'png' })
 
@@ -117,3 +115,3 @@ // this version should wrap because we give it a max width
 test('"puppeteer-render-text 😊" html with multiple google fonts', async (t) => {
-  const output0 = tempy.file({ extension: 'png' })
+  const output0 = temporaryFile({ extension: 'png' })
 
@@ -131,4 +129,5 @@ await renderText({
   const image0 = await sharp(output0).metadata()
-  t.true(inDelta(image0.width, 502, 5))
-  t.true(inDelta(image0.height, 79, 3))
+  console.log(image0)
+  t.true(inDelta(image0.width, 502, 20))
+  t.true(inDelta(image0.height, 79, 5))
   t.is(image0.channels, 4)
@@ -135,0 +134,0 @@ t.is(image0.format, 'png')

package.json

 {
   "name": "puppeteer-render-text",
-  "version": "1.0.3",
+  "version": "2.0.0",
   "description": "Robust text renderer using headless chrome.",
-  "main": "index.js",
   "repository": "transitive-bullshit/puppeteer-render-text",
   "author": "Travis Fischer <[e-mail]>",
   "license": "MIT",
-  "scripts": {
-    "docs": "update-markdown-jsdoc --no-markdown-toc",
-    "test": "ava -v && standard *.js"
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./index.js",
+      "default": "./index.js"
+    }
   },
   "engines": {
-    "node": ">=8"
+    "node": ">=14"
   },
+  "scripts": {
+    "test": "run-p test:*",
+    "test:unit": "ava",
+    "test:prettier": "prettier '**/*.{js,jsx,ts,tsx}' --check"
+  },
+  "dependencies": {
+    "css-in-js-utils": "^3.1.0",
+    "ow": "^1.1.0",
+    "puppeteer": "^19.3.0"
+  },
+  "devDependencies": {
+    "ava": "^5.1.0",
+    "npm-run-all": "^4.1.5",
+    "prettier": "^2.8.0",
+    "rmfr": "^2.0.0",
+    "sharp": "^0.31.2",
+    "tempy": "^3.0.0"
+  },
   "keywords": [
@@ -27,16 +47,3 @@ "puppeteer",
     "fontfaceobserver"
-  ],
-  "devDependencies": {
-    "ava": "^0.25.0",
-    "rmfr": "^2.0.0",
-    "sharp": "^0.20.5",
-    "standard": "^11.0.0",
-    "tempy": "^0.2.1",
-    "update-markdown-jsdoc": "^1.0.6"
-  },
-  "dependencies": {
-    "css-in-js-utils": "^2.0.1",
-    "ow": "^0.6.0",
-    "puppeteer": "^1.5.0"
-  }
+  ]
 }

readme.md

@@ -5,3 +5,3 @@ # puppeteer-render-text
 
-[![NPM](https://img.shields.io/npm/v/puppeteer-render-text.svg)](https://www.npmjs.com/package/puppeteer-render-text) [![Build Status](https://travis-ci.com/transitive-bullshit/puppeteer-render-text.svg?branch=master)](https://travis-ci.com/transitive-bullshit/puppeteer-render-text) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+[![NPM](https://img.shields.io/npm/v/puppeteer-render-text.svg)](https://www.npmjs.com/package/chatgpt) [![Build Status](https://github.com/transitive-bullshit/puppeteer-render-text/actions/workflows/test.yml/badge.svg)](https://github.com/transitive-bullshit/puppeteer-render-text/actions/workflows/test.yml) [![MIT License](https://img.shields.io/badge/license-MIT-blue)](https://github.com/transitive-bullshit/puppeteer-render-text/blob/main/license) [![Prettier Code Formatting](https://img.shields.io/badge/code_style-prettier-brightgreen.svg)](https://prettier.io)
 
@@ -24,10 +24,10 @@ <p align="center">
 
--   built-in [fontfaceobserver](https://fontfaceobserver.com/)
--   easily load [google fonts](https://fonts.google.com/)
--   optional word-wrap
--   main content is just **html**
--   styling is done via [**css**](https://www.w3schools.com/jsref/dom_obj_style.asp)
--   handles multiple fonts
--   thoroughly tested
--   includes a [CLI](https://github.com/transitive-bullshit/puppeteer-render-text-cli)
+- built-in [fontfaceobserver](https://fontfaceobserver.com/)
+- easily load [google fonts](https://fonts.google.com/)
+- optional word-wrap
+- main content is just **html**
+- styling is done via [**css**](https://www.w3schools.com/jsref/dom_obj_style.asp)
+- handles multiple fonts
+- thoroughly tested
+- includes a [CLI](https://github.com/transitive-bullshit/puppeteer-render-text-cli)
 
@@ -37,3 +37,3 @@ ## Install
 ```bash
-npm install --save puppeteer-render-text
+npm install puppeteer-render-text
 ```
@@ -44,3 +44,3 @@
 ```js
-const renderText = require('puppeteer-render-text')
+import { renderText } from 'puppeteer-render-text'
 
@@ -100,23 +100,25 @@ // render text with built-in font and no word-wrap
 
--   `opts` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Configuration options
-    -   `opts.text` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** HTML content to render
-    -   `opts.output` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path of image file to output result
-    -   `opts.width` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Optional max width for word-wrap
-    -   `opts.height` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Optional max height to clip overflow
-    -   `opts.loadFontFamily` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optional font family to load with fontfaceobserver
-    -   `opts.loadGoogleFont` **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Whether or not to load and wait for `opts.style.fontFamily` as one or more google fonts (optional, default `false`)
-    -   `opts.style` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** JS [CSS styles](https://www.w3schools.com/jsref/dom_obj_style.asp) to apply to the text's container div (optional, default `{}`)
-    -   `opts.inject` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Optionally injects arbitrary string content into the head, style, or body elements. (optional, default `{}`)
-        -   `opts.inject.head` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into the document <head>
-        -   `opts.inject.style` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into a <style> tag within the document <head>
-        -   `opts.inject.body` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into the document <body>
+- `opts` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Configuration options
+  - `opts.text` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** HTML content to render
+  - `opts.output` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** Path of image file to output result
+  - `opts.width` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Optional max width for word-wrap
+  - `opts.height` **[number](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number)?** Optional max height to clip overflow
+  - `opts.loadFontFamily` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optional font family to load with fontfaceobserver
+  - `opts.loadGoogleFont` **[boolean](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean)** Whether or not to load and wait for `opts.style.fontFamily` as one or more google fonts (optional, default `false`)
+  - `opts.style` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** JS [CSS styles](https://www.w3schools.com/jsref/dom_obj_style.asp) to apply to the text's container div (optional, default `{}`)
+  - `opts.inject` **[object](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object)** Optionally injects arbitrary string content into the head, style, or body elements. (optional, default `{}`)
+    - `opts.inject.head` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into the document <head>
+    - `opts.inject.style` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into a <style> tag within the document <head>
+    - `opts.inject.body` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)?** Optionally injected into the document <body>
 
 ## Related
 
--   [puppeteer-render-text-cli](https://github.com/transitive-bullshit/puppeteer-render-text-cli) - CLI for this module.
--   [puppeteer](https://github.com/GoogleChrome/puppeteer) - Headless Chrome Node API.
--   [awesome-puppeteer](https://github.com/transitive-bullshit/awesome-puppeteer) - Curated list of awesome puppeteer resources.
+- [puppeteer-render-text-cli](https://github.com/transitive-bullshit/puppeteer-render-text-cli) - CLI for this module.
+- [puppeteer](https://github.com/GoogleChrome/puppeteer) - Headless Chrome Node API.
+- [awesome-puppeteer](https://github.com/transitive-bullshit/awesome-puppeteer) - Curated list of awesome puppeteer resources.
 
 ## License
 
-MIT © [Travis Fischer](https://github.com/transitive-bullshit)
+MIT © [Travis Fischer](https://transitivebullsh.it)
+
+If you found this project interesting, please consider [sponsoring me](https://github.com/sponsors/transitive-bullshit) or <a href="https://twitter.com/transitive_bs">following me on twitter <img src="https://storage.googleapis.com/saasify-assets/twitter-logo.svg" alt="twitter" height="24px" align="center"></a>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

36911

increased by3.64%

Number of package files

15

increased by50%

Lines of code

290

increased by8.21%

Number of lines in readme file

120

increased by1.69%

Number of low supply chain risk alerts

1

decreased by-50%

Is type module

Yes

Dependency changes

• + Added@babel/code-frame@7.26.2(transitive)

• + Added@babel/helper-validator-identifier@7.25.9(transitive)

• + Added@puppeteer/browsers@0.5.0(transitive)

• + Added@sindresorhus/is@5.6.0(transitive)

• + Added@types/node@22.9.0(transitive)

• + Added@types/yauzl@2.10.3(transitive)

• + Addedagent-base@6.0.2(transitive)

• + Addedansi-regex@5.0.1(transitive)

• + Addedansi-styles@4.3.0(transitive)

• + Addedargparse@2.0.1(transitive)

• + Addedbase64-js@1.5.1(transitive)

• + Addedbl@4.1.0(transitive)

• + Addedbuffer@5.7.1(transitive)

• + Addedcallsites@3.1.04.2.0(transitive)

• + Addedchownr@1.1.4(transitive)

• + Addedchromium-bidi@0.4.7(transitive)

• + Addedcliui@8.0.1(transitive)

• + Addedcolor-convert@2.0.1(transitive)

• + Addedcolor-name@1.1.4(transitive)

• + Addedcosmiconfig@8.1.3(transitive)

• + Addedcross-fetch@3.1.5(transitive)

• + Addedcss-in-js-utils@3.1.0(transitive)

• + Addeddebug@4.3.4(transitive)

• + Addeddevtools-protocol@0.0.1107588(transitive)

• + Addeddot-prop@7.2.0(transitive)

• + Addedemoji-regex@8.0.0(transitive)

• + Addedend-of-stream@1.4.4(transitive)

• + Addederror-ex@1.3.2(transitive)

• + Addedescalade@3.2.0(transitive)

• + Addedextract-zip@2.0.1(transitive)

• + Addedfs-constants@1.0.0(transitive)

• + Addedget-caller-file@2.0.5(transitive)

• + Addedget-stream@5.2.0(transitive)

• + Addedhttps-proxy-agent@5.0.1(transitive)

• + Addedieee754@1.2.1(transitive)

• + Addedimport-fresh@3.3.0(transitive)

• + Addedis-arrayish@0.2.1(transitive)

• + Addedis-fullwidth-code-point@3.0.0(transitive)

• + Addedjs-tokens@4.0.0(transitive)

• + Addedjs-yaml@4.1.0(transitive)

• + Addedjson-parse-even-better-errors@2.3.1(transitive)

• + Addedlines-and-columns@1.2.4(transitive)

• + Addedlodash.isequal@4.5.0(transitive)

• + Addedmitt@3.0.0(transitive)

• + Addedmkdirp-classic@0.5.3(transitive)

• + Addedms@2.1.2(transitive)

• + Addednode-fetch@2.6.7(transitive)

• + Addedow@1.1.1(transitive)

• + Addedparent-module@1.0.1(transitive)

• + Addedparse-json@5.2.0(transitive)

• + Addedpath-type@4.0.0(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedpump@3.0.2(transitive)

• + Addedpuppeteer@19.11.1(transitive)

• + Addedpuppeteer-core@19.11.1(transitive)

• + Addedreadable-stream@3.6.2(transitive)

• + Addedrequire-directory@2.1.1(transitive)

• + Addedresolve-from@4.0.0(transitive)

• + Addedsafe-buffer@5.2.1(transitive)

• + Addedstring-width@4.2.3(transitive)

• + Addedstring_decoder@1.3.0(transitive)

• + Addedstrip-ansi@6.0.1(transitive)

• + Addedtar-fs@2.1.1(transitive)

• + Addedtar-stream@2.2.0(transitive)

• + Addedthrough@2.3.8(transitive)

• + Addedtr46@0.0.3(transitive)

• + Addedtype-fest@2.19.0(transitive)

• + Addedunbzip2-stream@1.4.3(transitive)

• + Addedundici-types@6.19.8(transitive)

• + Addedvali-date@1.0.0(transitive)

• + Addedwebidl-conversions@3.0.1(transitive)

• + Addedwhatwg-url@5.0.0(transitive)

• + Addedwrap-ansi@7.0.0(transitive)

• + Addedws@8.13.0(transitive)

• + Addedy18n@5.0.8(transitive)

• + Addedyargs@17.7.1(transitive)

• + Addedyargs-parser@21.1.1(transitive)

• - Removedagent-base@4.3.0(transitive)

• - Removedasync-limiter@1.0.1(transitive)

• - Removedbalanced-match@1.0.2(transitive)

• - Removedbrace-expansion@1.1.11(transitive)

• - Removedbuffer-from@1.1.2(transitive)

• - Removedconcat-map@0.0.1(transitive)

• - Removedconcat-stream@1.6.2(transitive)

• - Removedcore-util-is@1.0.3(transitive)

• - Removedcss-in-js-utils@2.0.1(transitive)

• - Removeddebug@2.6.93.2.74.3.7(transitive)

• - Removedes6-promise@4.2.8(transitive)

• - Removedes6-promisify@5.0.0(transitive)

• - Removedextract-zip@1.7.0(transitive)

• - Removedfs.realpath@1.0.0(transitive)

• - Removedglob@7.2.3(transitive)

• - Removedhttps-proxy-agent@2.2.4(transitive)

• - Removedinflight@1.0.6(transitive)

• - Removedisarray@1.0.0(transitive)

• - Removedisobject@3.0.1(transitive)

• - Removedmime@2.6.0(transitive)

• - Removedminimatch@3.1.2(transitive)

• - Removedminimist@1.2.8(transitive)

• - Removedmkdirp@0.5.6(transitive)

• - Removedms@2.0.02.1.3(transitive)

• - Removedow@0.6.0(transitive)

• - Removedpath-is-absolute@1.0.1(transitive)

• - Removedprocess-nextick-args@2.0.1(transitive)

• - Removedpuppeteer@1.20.0(transitive)

• - Removedreadable-stream@2.3.8(transitive)

• - Removedrimraf@2.7.1(transitive)

• - Removedsafe-buffer@5.1.2(transitive)

• - Removedstring_decoder@1.1.1(transitive)

• - Removedtypedarray@0.0.6(transitive)

• - Removedws@6.2.3(transitive)

• Updatedcss-in-js-utils@^3.1.0

• Updatedow@^1.1.0

• Updatedpuppeteer@^19.3.0