Tags not added on images with Docusaurus

[jaguarondi]

I'm using docusaurus which uses rehype/remark and added remark-attr. Other markups like links, headers, etc. are working fine but image tags just don't get any attributes added. I also tested the paragraph branch which works fine with paragraphs.

Is there any test I could do to help diagnose the problem with images further? I'm using

![img](img.png){class="none"}

which leads to

<img alt="img" src="/assets/images/img-2ce0a3f91f9b6ea2d3149cbaab375986.png">

Images are obviously copied to another folder and the src attribute rewritten in the way. This might just be the reason.

[arobase-che]

Ok I spent some time to reproduce this case. I'm happy that most of the plugin works. :)

I'm on vacation at the moment, I will investigate this bug next week. ^^

[jaguarondi]

Checking a bit further, I could get to the point where the token is called and the returned 'eaten' data seems correct:

{
  type: 'image',
  title: null,
  url: '/img/Logo_Cyan_flat.png',
  alt: 'alt',
  position: Position {
    start: { line: 5, column: 1, offset: 32 },
    end: { line: 5, column: 45, offset: 76 },
    indent: []
  },
  data: { hProperties: { height: '50' } }
}

This is with a default docusaurus install and just this last line added to docusaurus.config.js:

  presets: [
    [
      '@docusaurus/preset-classic',
      {
        docs: {
          sidebarPath: require.resolve('./sidebars.js'),
          // Please change this to your repo.
          editUrl:
            'https://github.com/facebook/docusaurus/edit/master/website/',
          remarkPlugins: [require('remark-attr')],

[arobase-che]

Ok, it's exactly what I tried.

If you manage to get the 'eaten' data and that seems correct then the problem doesn't come from remark-attr. Need more investigation.

Thank you for you implication.

[jaguarondi]

That's good to know, thanks. I could try to reach out at Docusaurus to investigate further but it's outside my skills at the moment. If you have anything that could help point in the right direction, that could help.

I integrated Tailwind CSS with Docusarus and remark-attr would be great to stick to markdown as much as possible while still having much more functionalities by tagging lists or paragraphs to have various meanings like figure or table caption, check mark lists, tutorial step lists, etc. I would like to look into lists after but I'm afraid that if tags don't get through, more problems might appear.