Come for the products,
stay for the community

The Atlassian Community can help you and your team get more value out of Atlassian products and practices.

Atlassian Community about banner
4,323,864
Community Members
 
Community Events
168
Community Groups

How to configure the CHROME_BIN in pipeline

Edited

4 answers

2 votes
Graham Gatus Atlassian Team Mar 06, 2019

@kumarpr I've put together an example repository demonstrating Puppeteer with Chromium in pipelines - https://bitbucket.org/bitbucketpipelines/example-chromium-headless-puppeteer/src/master/. In your case, it looks like there were additional dependencies that need edto be installed into the node:8.9.4 image in order to have Puppeteer be able to launch a Chromium browser instance.

In the linked example, the bitbucket-pipelines.yml file installs these required dependencies, then uses Puppeteer to start a Chromium instance and take a screenshot, saving it as a build artifact.

Hi Graham,

Thanks for your help. It's working fine now.

Thanks a lots.

Trying to use the example script in your repository does not work for me. 

I get: 

 

E: Unable to locate package libgconf-2-4

E: Unable to locate package update

Hey @kumarpr  I just ended up here as I was having the same problem.

Using @Graham Gatus  pipeline as inspiration and after some research I discovered that puppeteer node package installs a bundled chromium binary, so installing chromium again seems a bit redundant.

Instead, try to:

  1. Install some OS package dependencies (libgconf-2-4 libatk1.0-0 libatk-bridge2.0-0 libgdk-pixbuf2.0-0 libgtk-3-0 libgbm-dev libnss3-dev libxss-dev libasound2)
  2. Include `puppeteer` as a dev dependency on your `package.json` file
  3. Let npm know where this chrome bundled version is through the`CHROME_BIN` environment variable

Here's how my solution looks like:

```

image: node:10.16.3

pipelines:
  default:
    - step:
      name: Install dependencies and test the app
      caches:
        - node
      script:
        - apt update && apt install -yq libgconf-2-4 libatk1.0-0 libatk-bridge2.0-0 libgdk-pixbuf2.0-0 libgtk-3-0 libgbm-dev libnss3-dev libxss-dev libasound2
        - npm ci
        - export CHROME_BIN="./node_modules/puppeteer/.local-chromium/linux-884014/chrome-linux/chrome"
        - npm run testci


```

Where testci is the following custom command:

```

node node_modules/@angular/cli/bin/ng test --no-progress --no-watch --reporters junit --browsers ChromeHeadlessCI

```

PS: @PhilippHabele  see if this solves your issue too :)

Hope this help someone!

Cheers!

How do you know which binary version to use in CI environment? I installed the puppeteer package locally and since my computer is a Mac, it has the Mac binary.

I guess I don't have a straight answer to that @Daniel . See which version are you using locally and if every release is done for every platform. In that case, whatever your local Mac environment is using should work for the base image of the CI container/pipeline.

Hi,

 

I also have the same issue.

Currently I made a new Angular application and try to setup the default pipeline.

 

karma.conf.js

module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-chrome-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage-istanbul-reporter'),
require('@angular-devkit/build-angular/plugins/karma')
],
client: {
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, './coverage/frontenddevnet'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true
},
reporters: ['progress', 'kjhtml'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false,
restartOnFileChange: true
});

 

bitbucket-pipelines.yml

image: node

pipelines:
default:
- step:
name: Lint and Test
caches:
- node
script:
- npm install
- npm run lint
- npm run test

error
21 08 2019 10:58:42.349:WARN [karma]: No captured browser, open http://localhost:9876/
21 08 2019 10:58:42.399:INFO [karma-server]: Karma v4.1.0 server started at http://0.0.0.0:9876/
21 08 2019 10:58:42.399:INFO [launcher]: Launching browsers Chrome with concurrency unlimited
21 08 2019 10:58:42.408:INFO [launcher]: Starting browser Chrome
21 08 2019 10:58:42.409:ERROR [launcher]: No binary for Chrome browser on your platform.
Please, set "CHROME_BIN" env variable.
21 08 2019 10:58:47.381:WARN [karma]: No captured browser, open http://localhost:9876/

 

how to configure the Chrome browser? Any ideas?

 

Kind regards,

Phil

0 votes
Graham Gatus Atlassian Team Mar 05, 2019

@kumarpr , are you able to provide your bitbucket-pipelines.yml file?

Based on the error, it sounds like you may need to install chromium browser first.

You can test this by running `which chromium-browser` in your pipeline, which should give the location of chromium.

If chromium is not present, for an Ubuntu based build image (e.g when using the default pipelines image), you can install this via:

```

apt-get update && apt-get install -y chromium-browser

```

Hi Graham,

Thanks for your reply.

bitbucket-pipelines.yml

image: node:8.9.4
options:
max-time: 20
pipelines:
default:
- step:
name: Build and test
caches:
- node
script:
- npm install
- npm run lint
- npm run test
- npm run build

I have treid to install the puppeteer as well to use the ChromeHeadless

image: node:8.9.4
options:
max-time: 20
pipelines:
default:
- step:
name: Build and test
caches:
- node
script:
- npm install
- npm install -D puppeteer
- npm run lint
- npm run test
- npm run build 

Suggest an answer

Log in or Sign up to answer
TAGS
Community showcase
Published in Bitbucket

Git push size limits are coming to Bitbucket Cloud starting April 4th, 2022

Beginning on April 4th, we will be implementing push limits. This means that your push cannot be completed if it is over 3.5 GB. If you do attempt to complete a push that is over 3.5 GB, it will fail...

2,861 views 3 9
Read article

Atlassian Community Events