images in tutorials are rendered too large if not constrained by page width

[grst]

[flying-sheep]

Matplotlib is configured to use a high DPI, and communicates the metadata about “CSS pixels” via Jupyter cell metadata.

{
  "data": {
    "image/png": "…",
    "text/plain": ["<Figure size 480x480 with 1 Axes>"]
  },
  "metadata": {
    "image/png": {
      "height": 398,
      "width": 390
    }
  },
  "output_type": "display_data"
}

It looks like myst-nb adds that metadata to the docutils image node, but somehow it doesn’t end up in the <img> tag.

Possible causes might be

1. that myst-nb has its own cell.metadata.myst metadata key and might read that one only, not the plain cell.metadata.width/height keys.
2. that the metadata is unitless and is probably read from the notebook as an int.

Maybe myst-nb adding px to unitless width or height would work? docutils says it wants a “length” or “percentage”, which maybe has to be a string with “px” or “%” at the end

[flying-sheep]

@grst could you file an issue for myst-nb? https://github.com/executablebooks/MyST-NB/issues/new?assignees=&labels=bug&projects=&template=bug_report.yml

[grst]

This has been fixed. TODO: require myst-nb>=v1.1.0 in the template.