Encountering a "Chrome not found" error while attempting to import an npm dependency in Deno Puppeteer

Currently experimenting with utilizing node-html-to-image within Deno:

import nodeHtmlToImage from "npm:node-html-to-image";

nodeHtmlToImage({
  output: './image.png',
  html: '<html><body>Hello world!</body></html>'
})
  .then(() => console.log('Image successfully created!'))

When running 

deno run --allow-env --allow-read --allow-write that-file.ts
, I encounter this error:

error: Uncaught Error: Unable to launch browser, error message: Could not find expected browser (chrome) locally. Run `npm install` to download the correct Chromium revision (982053).
    at Cluster.<anonymous> (file:///Users/theonlygusti/Library/Caches/deno/npm/registry.npmjs.org/puppeteer-cluster/0.23.0/dist/Cluster.js:119:23)
    at Generator.throw (<anonymous>)
    at rejected (file:///Users/theonlygusti/Library/Caches/deno/npm/registry.npmjs.org/puppeteer-cluster/0.23.0/dist/Cluster.js:6:65)

Any suggestions on how to make use of the node-html-to-image npm package with Deno?

typescriptnpmpuppeteerdeno

Answer №1

Essentially, the solution to this issue can be found in Could not find expected browser chrome locally.

The unique aspect related to Deno is that the NPM installation path differs from traditional Node installations.

When utilizing the npm specifier in Deno, such as 

import nodeHtmlToImage from "npm:node-html-to-image";
, the Node packages are installed in a specific section of the deno cache directory:

  • Windows: 
    <user directory>/AppData/Local/deno/npm/registry.npmjs.org/
  • macOS: 
    ~/Library/Caches/deno/npm/registry.npmjs.org
  • Linux: 
    $XDG_CACHE_HOME/deno/npm/registry.npmjs.org
    or 
    $HOME/.cache/deno/npm/registry.npmjs.org

with a focus on Puppeteer: 

deno/npm/registry.npmjs.org/puppeteer/13.7.0

In the provided error message, it suggests

Execute npm install to obtain the correct Chromium revision (982053)

This implies running npm install within the aforementioned Puppeteer directory, which includes a file named install.js.

As a result, the appropriate chromium package revision will be installed in Puppeteer's directory under .local-chromium.

Unfortunately, there may be another issue ahead, particularly for Windows users, which states

Uncaught Error: Unable to launch browser, error message: Windows only supports ctrl-c (SIGINT) and ctrl-break (SIGBREAK).

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for updating the icon based on the active or inactive status in ag-grid within an angular application

HTML* <ng-template #actionButtons let-data="data"> <div class="cell-actions"> <a href="javascript:;" (click)="assign()"> <i nz-icon nzType="user-add" nzTheme= ...

javascriptangulartypescriptag-grid

Preventing memory leaks in unmounted components: A guide

Currently, I am facing an issue while fetching and inserting data using axios in my useState hook. The fetched data needs to be stored as an array, but unfortunately, I encountered a memory leak error. I have tried various solutions including using clean u ...

reactjstypescriptaxiosunmount

Ways to verify the compatibility between TypeScript type definitions in @types and the corresponding package

After dabbling with typescript in my node.js projects for a while, I've come to realize that many npm packages have separate @types packages for typescript definitions. But here's the dilemma: how can one be certain that the @types package is syn ...

node.jstypescriptnpmtypescript-typings

What steps can be taken to fix problems with npm libraries?

I was looking to set up lessc on my Ubuntu 12.04 system. These are the steps I followed: wget http://nodejs.org/dist/v0.6.8/node-v0.6.8.tar.gz tar zxf node-v0.6.8.tar.gz cd node-v0.6.8/ ./configure --prefix=/absolute/path/to/the/virtualenv/ make make ins ...

node.jsubuntunpmubuntu-12.04

Just a straightforward Minimum Working Example, encountering a TypeScript error TS2322 that states the object is not compatible with the type 'IntrinsicAttributes & Props & { children?: ReactNode; }'

Currently, I am immersed in a project involving React and Typescript. I am grappling with error code TS2322 and attempting to resolve it. Error: Type '{ submissionsArray: SubmissionProps[]; }' is not assignable to type 'IntrinsicAttributes ...

reactjstypescriptreact-typescript

Chokidar encountered an issue on drive D: due to a locked or busy resource, resulting in an error when attempting to access 'D:pagefile.sys'

Today, I encountered an issue when trying to run my Vue app using the npm run serve command. Although I have done this many times before with the same repository, it threw an error at me when I attempted to start it up recently. This dependency was not fou ...

vue.jsnpmwebpack

What is stopping npm i from finishing the installation process? Why does it keep saying that node and npm are unrecognized commands?

Struggling to get a React project up and running. Despite installing the latest version of Node and even trying older versions as per the readme instructions, I'm still facing issues. I've gone as far as uninstalling Node completely, removing eve ...

node.jsnpm

A guide on dynamically showcasing/summoning icons in react by utilizing array data

QUESTION: 1 (SOLVED!) https://i.stack.imgur.com/1M1K7.png What is the best way to display icons based on an array of data codes? const data = [{ img: '01d' }, { img: '02d' }] if(data) { data.map((item) => ( <img src={`./ ...

javascriptreactjstypescriptnext.js

Looking for a way to dynamically append a child element within another child

Struggling to include a new child within a specific child in Json myObject:any[] = []; this.myObject = { "type": "object", "properties": { "first_name": { "type": "string" }, "last_name": { "type": "string" }, } } addF ...

javascriptangulartypescript

Babel refuses to avoid running through npm script

My machine currently has the babel cli installed by executing the following command: npm install -g babel-cli Executing this command provides the desired output, creating file out.js babel script.js --out-file out.js However, attempting to run ...

npmbabeljs

Issue with JSON encoding in Embed message/interaction reply in Discord.js v14

I am currently utilizing Discord.js version 14.8, which was developed in typescript. Here is a snippet from my package.json file: "dependencies": { "@discordjs/rest": "^1.1.0", "@supabase/supabase-js": &quo ...

typescriptdiscord.js

What is the best way to download a file with a specific name using Angular and TypeScript?

Greetings! Below is a snippet of code from my Angular component: this.messageHistoryService.getMessageHistoriesCSV1(msgHistoryRequest).subscribe( (data) => { console.log(data.messageHistoryBytes); let file = new Blob( [data.messageHistoryBytes ...

javascriptangulartypescript

What causes Node.js to crash with the Headers already sent Error while managing errors in Express?

My current project involves using Express to set up an API endpoint for user registration. However, I've encountered a problem where sending a request that triggers an error to this API endpoint causes my node.js server to crash. The specific message ...

node.jstypescriptexpressheader

Split the massive array object into more manageable chunks

I have a large array that can range from 1 to 600K records. To work with this big array, I need to break it into smaller chunks to carry out operations. How can I achieve this effectively? Here is my proposed solution: The challenge I am facing is not kn ...

angulartypescript

Encountering an issue while integrating React three fiber library and attempting to utilize TextGeometry

Currently, I am utilizing React in conjunction with react-three fiber and typescript in an attempt to create basic 3D text. I have encountered the following error: THREE.TextGeometry has been relocated to /examples/jsm/geometries/TextGeometry.js Below is ...

reactjstypescriptthree.jsreact-three-fiber

Simplify the cognitive load of the function

I'm facing a challenge with a function that has a cognitive complexity of 24, however, we have a requirement to limit it to a maximum of 15. export function parameterValueParser<T extends Structure>( structure: T ): (parameterValue: Value) =&g ...

javascripttypescript

Are there any tools similar to JQAssistant that support Typescript?

Currently, I am delving into code analysis and utilizing the tool to interrogate the code of a Java application. I have successfully been able to query all the feign clients and establish relationships between a specific set of jar files, allowing me to g ...

typescriptdependency-managementcode-analysisjqassistant

Tips for sending data to CSS in Angular

I have an Angular application where I need to calculate the width of an element and store it in a variable called finalposition. Then, I want to move this element to the left by (finalposition)px when hovering over it. How can I achieve this styling effect ...

javascripthtmlcssangulartypescript

I am having trouble installing karma-jasmine and phantomjs on my Windows 8.1 operating system. How can I troubleshoot and successfully set it up?

My question has a unique twist compared to the issue discussed in this post about installing jasmine-core on Windows 7 / OSX I attempted to use the following command: npm install karma karma-jasmine karma-phantomjs-launcher --save-dev The answer pointed ...

npmjasminephantomjskarma-runner

Using Angular to dynamically set data and labels for a bar chart

My issue is with dynamically adding data to my bar chart dataset as it keeps returning undefined. Here's the current working version: public barChartData: ChartDataSets[] = [ { data: [], label: 'High' }, { data: [], label: 'Medium' ...

angulartypescript