Some elements not properly loading

Description

I’m using shot‑scraper from the command line to capture a PDF screenshot a web application dashboard(Thingsboard). Although the page displays the legend with colored indicators in the browser, the generated PDF is missing the color indicator next to the legend.

the code i use:

shot-scraper pdf https://demo.thingsboard.io/dashboard/e8e409c0-f2b5-11e6-a6ee-bb0136cc33d0?publicId=963ab470-34c9-11e7-a7ce-bb0136cc33d0 --wait 10000 --width 1288 --height 1000 --media-screen -o /home/user/Desktop/example.pdf

How said widget appear normally at dashboard:

How it appears at generated pdf:

Problem being legend section's coloring not appearing.(if you try example code same problem will appear)

I tried to resize the widget, change the legends placement to side from bottom.
I tried adding the --media-screen flag. However, this did not resolve the problem as well.

Environments used

Shot-scraper version 1.8
OS: Ubuntu 24.04

Not sure how to go about solving this any help appreciated.

Start by reproducing the provided shot-scraper pdf command against the ThingsBoard dashboard URL and compare the browser rendering with the generated PDF. Investigate the missing legend color indicators in PDF output; done means the indicators appear in the generated PDF while preserving the existing command options.