Skip to content

[TSVB] Printing Metric chart to PDF results in bad kerning #217287

@markov00

Description

@markov00

Kibana version:
8.15.3 - 8.17.4 (probably more)

Under Oracle Linux 8.10

Describe the bug:

When you print a Dashboard with a TSVB metric panel, the rendered text of the panel presents many font-kerning issues (see attached screenshot and pdf)

Steps to reproduce:

  1. Run a trial elasticsearch/kibana machine in linux oracle 8.10 (use https://github.com/tsullivan/kibana-dev-docker and adjust the Oracle docker file with FROM oraclelinux:8.10 and download the kibana release from https://www.elastic.co/downloads/past-releases#kibana)
  2. Create a TSVB metric chart and save it into a dashboard
  3. Click Share and export it as PDF

Expected behavior:
The chart should render correctly all its characters.

Screenshots (if relevant):

TSVB printing error.pdf

Image

Errors in browser console (if relevant):
N/A

Any additional context:

  • This behaviour was present since 8.15.3 at least.
  • It doesn't affect Lens, but only TSVB metric charts. This seems to be related to the way TSVB metric charts are styled in HTML: the original style has a pretty small font-size, but the container uses a matrix transformation to scale the chart depending on the panel size. My assumption is that the headless rendering is computing the position of each character in its original size and then scale this size up, causing some an issues with the character position rounding that causes the kerning to fall off.
  • It doesn't affect Chromium running on a Mac
  • It seems (but not tested at 100%) that a Native Linux Chromium installation is not affected by that problem, i tried to print the same dashboard as PDF (via a simple puppetteer js script) and it works perfectly. The only problem was instead with printing as "screenshot" await page.screenshot that I wasn't able to print the text of the TSVB chart (Lens was rendering fine).
  • I wasn't able to run a --print-to-pdf command from the headless_shell binary available in the Kibana release archive. I tried to run it in multiple way to just exclude the Kibana from the test

Metadata

Metadata

Labels

Feature:Reporting:ScreenshotReporting issues pertaining to PNG/PDF file exportFeature:TSVBTSVB (Time Series Visual Builder)Team:ResponseOpsPlatform ResponseOps team (formerly the Cases and Alerting teams) t//Team:VisualizationsTeam label for Lens, elastic-charts, Graph, legacy editors (TSVB, Visualize, Timelion) t//bugFixes for quality problems that affect the customer experience

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions