'How to enable WebGL in Headless Chrome >= 96 within selenium-docker project to run Chrome inside a docker container without XVFB

I'm using selenium-docker project to run chrome inside a docker container, without XVFB (START_XVFB=false).

I want to use webgl support. With chrome v95 and lower (https://github.com/SeleniumHQ/docker-selenium/releases/tag/4.1.0-prerelease-20211105), webgl is enabled (checking with https://get.webgl.org/).

However, when using chrome v96 or later it doesn't work (https://github.com/SeleniumHQ/docker-selenium/releases/tag/4.1.2-20220131). I can see that the gpu-process has --use-gl=disabled argument, this does not happen with chrome v95.

seluser@6e0bab2896f2:/$ ps aux|grep chrome
seluser      136  0.0  0.0 16875056 16500 ?      Sl   22:36   0:00 /opt/selenium/chromedriver-97.0.4692.71 --port=48167
seluser      153  0.7  0.0 17181620 99736 ?      Sl   22:36   0:00 /opt/google/chrome/chrome --no-sandbox --allow-pre-commit-input --disable-background-networking --disable-client-side-phishing-detection --disable-default-apps --disable-hang-monitor --disable-popup-blocking --disable-prompt-on-repost --disable-sync --enable-automation --enable-blink-features=ShadowDOMV0 --enable-logging --headless --log-level=0 --no-first-run --no-service-autorun --password-store=basic --remote-debugging-port=0 --test-type=webdriver --use-mock-keychain --user-data-dir=/tmp/.com.google.Chrome.RBwolw data:,
seluser      160  0.0  0.0 17022544 54552 ?      S    22:36   0:00 /opt/google/chrome/chrome --type=zygote --no-zygote-sandbox --no-sandbox --enable-logging --headless --log-level=0 --headless --enable-crash-reporter
seluser      161  0.0  0.0 17022544 54628 ?      S    22:36   0:00 /opt/google/chrome/chrome --type=zygote --no-sandbox --enable-logging --headless --log-level=0 --headless --enable-crash-reporter
seluser      177  0.2  0.0 17088440 81444 ?      Sl   22:36   0:00 /opt/google/chrome/chrome --type=utility --utility-sub-type=network.mojom.NetworkService --field-trial-handle=10249259231085024426,2441013785441743208,131072 --disable-features=PaintHolding --lang=en-US --service-sandbox-type=none --no-sandbox --enable-logging --log-level=0 --use-angle=swiftshader-webgl --use-gl=angle --headless --enable-crash-reporter --enable-logging --log-level=0 --shared-files=v8_context_snapshot_data:100
seluser      206  0.0  0.0 17064708 47756 ?      Sl   22:36   0:00 /opt/google/chrome/chrome --type=gpu-process --field-trial-handle=10249259231085024426,2441013785441743208,131072 --disable-features=PaintHolding --no-sandbox --enable-logging --headless --log-level=0 --ozone-platform=headless --use-angle=swiftshader-webgl --headless --enable-crash-reporter --gpu-preferences=UAAAAAAAAAAgAAAYAAAAAAAAAAAAAAAAAABgAAAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAGAAAAAAAAAAIAAAAAAAAAAgAAAAAAAAACAAAAAAAAAA= --use-gl=disabled --override-use-software-gl-for-headless --enable-logging --log-level=0 --shared-files
seluser      240  0.4  0.0 25521252 86756 ?      Sl   22:36   0:00 /opt/google/chrome/chrome --type=renderer --headless --enable-crash-reporter --lang=en-US --no-sandbox --enable-automation --enable-logging --log-level=0 --remote-debugging-port=0 --test-type=webdriver --allow-pre-commit-input --ozone-platform=headless --field-trial-handle=10249259231085024426,2441013785441743208,131072 --disable-features=PaintHolding --disable-gpu-compositing --enable-blink-features=ShadowDOMV0 --lang=en-US --num-raster-threads=4 --enable-main-frame-before-activation --renderer-client-id=7 --launch-time-ticks=2093974944 --shared-files=v8_context_snapshot_data:100
seluser      265  0.0  0.0   9040   720 pts/0    S+   22:36   0:00 grep --color=auto chrome

I have tried passing arguments to chrome but they don't work. I believe selenium image has nothing to do with this behaviour, it's something that changed in chrome v96.

Enabling XVFB is not an option for me, performance is not the same.

How can I avoid this --use-gl=disabled argument being passed to the chrome gpu process?

This is the ps ouptut with chrome 94, here swiftshader is selected:

seluser     35  0.0  3.6 5418392 146164 ?      Sl   Feb16   2:40 java -Dselenium.LOGGER.level=WARNING -cp /opt/selenium/*:. org.openqa.grid.selenium.GridLauncherV3 -role node -hub http://selenium-hub:4444/grid/register -remoteHost http://chrome-node:5555 -nodeConfig /opt/selenium/config.json
seluser    353  0.3  0.3 16874900 15128 ?      Sl   08:45   0:00 /opt/selenium/chromedriver-94.0.4606.61 --port=13828
seluser    363  1.2  2.3 17163152 96028 ?      Sl   08:45   0:00 /opt/google/chrome/chrome --no-sandbox --allow-pre-commit-input --autoplay-policy=no-user-gesture-required --blink-settings=imagesEnabled=false --disable-background-network
ing --disable-background-timer-throttling --disable-backgrounding-occluded-windows --disable-breakpad --disable-client-side-phishing-detection --disable-component-extensions-with-background-pages --disable-default-apps --disable-extensio
ns --disable-features=TranslateUI --disable-hang-monitor --disable-ipc-flooding-protection --disable-notifications --disable-permissions-api --disable-popup-blocking --disable-prompt-on-repost --disable-renderer-backgrounding --disable-s
ync --disable-translate --enable-blink-features=ShadowDOMV0 --enable-logging --force-color-profile=srgb --headless --hide-scrollbars --ignore-certificate-errors --log-level=0 --metrics-recording-only --mute-audio --no-first-run --no-serv
ice-autorun --password-store=basic --remote-debugging-port=0 --safebrowsing-disable-auto-update --test-type=webdriver --use-mock-keychain --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36 --user-data-dir=/tmp/.com.google.Chrome.H8QetU --window-size=1280,1280 data:,
seluser    371  0.2  1.3 17020192 54600 ?      S    08:45   0:00 /opt/google/chrome/chrome --type=zygote --no-zygote-sandbox --no-sandbox --enable-logging --headless --log-level=0 --headless --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36
seluser    372  0.2  1.3 17020192 54700 ?      S    08:45   0:00 /opt/google/chrome/chrome --type=zygote --no-sandbox --enable-logging --headless --log-level=0 --headless --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36
seluser    387 11.6  2.9 17134132 119824 ?     Sl   08:45   0:01 /opt/google/chrome/chrome --type=gpu-process --field-trial-handle=5673360104449051270,16628090171661640812,131072 --disable-features=PaintHolding,TranslateUI --no-sandbox -
-disable-breakpad --enable-logging --headless --log-level=0 --ozone-platform=headless --headless --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36 --gpu-prefer
ences=UAAAAAAAAAAgAAAIAAAAAAAAAAAAAAAAAABgAAAAAAAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABgAAAAAAAAAGAAAAAAAAAAIAAAAAAAAAAgAAAAAAAAACAAAAAAAAAA= --use-gl=swiftshader-webgl --override-use-software-gl-for-headless --enable-logging --log-level=0 --shared-files
seluser    388  0.3  1.9 17086024 79308 ?      Sl   08:45   0:00 /opt/google/chrome/chrome --type=utility --utility-sub-type=network.mojom.NetworkService --field-trial-handle=5673360104449051270,16628090171661640812,131072 --disable-feat
ures=PaintHolding,TranslateUI --lang=en-US --service-sandbox-type=none --no-sandbox --enable-logging --ignore-certificate-errors --log-level=0 --use-gl=swiftshader-webgl --mute-audio --ignore-certificate-errors --headless --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safari/537.36 --enable-logging --log-level=0 --shared-files=v8_context_snapshot_data:100
seluser    418  8.3  2.3 25521800 93096 ?      Sl   08:45   0:00 /opt/google/chrome/chrome --type=renderer --headless --user-agent=Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/94.0.4606.71 Safar
i/537.36 --lang=en-US --no-sandbox --autoplay-policy=no-user-gesture-required --disable-background-timer-throttling --disable-breakpad --disable-notifications --disable-permissions-api --enable-logging --force-color-profile=srgb --log-le
vel=0 --remote-debugging-port=0 --test-type=webdriver --allow-pre-commit-input --blink-settings=imagesEnabled=false --ozone-platform=headless --field-trial-handle=5673360104449051270,16628090171661640812,131072 --disable-features=PaintHolding,TranslateUI --disable-gpu-compositing --enable-blink-features=ShadowDOMV0 --lang=en-US --num-raster-threads=4 --enable-main-frame-before-activation --renderer-client-id=5 --shared-files=v8_context_snapshot_data:100

Solution 1:^[1]

use-gl

--use-gl selects which implementation of GL the GPU process should use. The available options are:

desktop: whatever desktop OpenGL the user has installed (Linux and Mac default).
egl: whatever EGL / GLES2 the user has installed (Windows default - actually ANGLE).
swiftshader: The SwiftShader software renderer.

As per the discussion Issue 617551: Support WebGL in headless WebGL in headless mode was already supported through osmesa implementation.

Allow WebGL readback for Mesa llvmpipe driver: Allow WebGL readback for Mesa llvmpipe driver. Currently llvmpipe driver from Mesa is black listed. It is fast and stable enough to allow using the gpu process. But only enable WebGL, other features still won't use the gpu process. For example the 2D Compositing Skia is faster than gpu compositing on software GL driver.

This revision was to switch from osmesa to SwiftShader:

headless: Switch from osmesa to SwiftShader

Now that SwiftShader is shipped with Chrome we can start using it to render GL content in headless mode. This requires a couple of changes:

Skip GPU data collection in headless mode since SwiftShader isn't considered a software implementation by that code, leading to a
failure when we try to retrieve information from the window system.

Only skip GL initialization in InitializeStaticEGLInternal if we're using osmesa. SwiftShader requires initialization like the other
non-software implementations.

We also fix a bug where any --use-gl flag specified by the user was overwritten internally.

Note that SwiftShader is currently not supported on macOS, so we will continue to use the physical GPU in headless mode on that platform (unlike on other platforms where everything is software rendered).

To disable WebGL support in headless mode from now on, use --disable-gpu --disable-software-rasterizer.

Further this revision was introduced to add support for GPU acceleration in headless Chromium for Linux. With this fix it was expected that WebGL should be working in headless with SwiftShader.

However, tests in headless from docker minimal setup (alpine) still failed as Content with MapboxMap does not render correctly regardless of used options (swiftshader / osmesa). These discrete issues on specific platforms are being tracked in Issue 765284: Support GPU hardware in headless mode

Enable WebGL through osmesa

To install and enable osmesa you need to perform the following steps:

sudo apt-get install libosmesa
sudo ln -s /usr/lib/x86_64-linux-gnu/libOSMesa.so.6 /opt/google/chrome/libosmesa.so
google-chrome --no-first-run --user-data-dir=~/chrome-stuff --use-gl=osmesa

Note: When running with osmesa the entire page is rendered with osmesa making it pretty slow. So, if there are tests you have that can run without WebGL you probably want to run them without osmesa.

tl; dr

References

Investigating the real Headless Chrome
Some of the generic guidelines to run Chrome headless can be found here
Steps, if you're on Ubuntu or working with a Linux VM that isn't working with Linux.
The metabug for adding headless mode to Chromium is over here.
Justin Ribeiro's Docker setup for Windows and Mac users.
How can I enable WebGL in my browser?

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1